init: UserBaseFront (frontend)

src/views/role-authz/EditRoleContainer.vue

@@ -0,0 +1,55 @@
+<template>
+    <RoleForm v-model="visible" :initForm="detailData" :isEdit="true" :loading="submitting"
+        @submit="handleSubmit" @cancel="visible = false" />
+</template>
+
+<script lang="ts" setup>
+import { ref } from "vue";
+import RoleForm from "./RoleForm.vue";
+
+const visible = ref(false);
+const detailData = ref<Record<string, any>>({});
+const currentId = ref<number | null>(null);
+let onSuccessCallback: (() => void) | null = null;
+
+// useForm 托管提交（角色编辑：仅可改 name/remark/disabled；allAppFlag 与 appId 后端禁止修改）
+const { form, loading: submitting, send: sendForm, onSuccess, onError } = useForm(
+    (dto) => Apis.AppRole.roleEdit({ pathParams: { id: currentId.value! }, data: dto }),
+    {
+        initialForm: { name: "", appId: undefined, allAppFlag: false, remark: "", disabled: false },
+        resetAfterSubmiting: true,
+    }
+);
+
+onSuccess(() => {
+    Message.success("编辑角色成功！");
+    visible.value = false;
+    onSuccessCallback?.();
+});
+onError((event: any) => {
+    Message.error(event?.error?.message || "编辑失败");
+});
+
+function open(id: number, row: any, onSuccess?: () => void) {
+    currentId.value = id;
+    // 直接用行数据回填（roleList 返回的字段与表单一致）
+    detailData.value = { ...row };
+    onSuccessCallback = onSuccess || null;
+    visible.value = true;
+}
+
+async function handleSubmit(formData: Record<string, any>) {
+    if (!currentId.value) return;
+    form.value = {
+        id: currentId.value,
+        name: formData.name,
+        appId: formData.appId,
+        allAppFlag: formData.allAppFlag,
+        remark: formData.remark,
+        disabled: formData.disabled,
+    };
+    await sendForm();
+}
+
+defineExpose({ open, visible });
+</script>