gin/collab-ledger
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: collaboration and statistics

Browse Source
This commit is contained in:
gin
2026-05-15 09:19:09 +08:00
parent cdee21ee8e
commit 2757a4fb49
91 changed files with 4504 additions and 1301 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/web/src/views/system/post/index.vue
+58 -15
View File
@@ -1,8 +1,9 @@
<script setup lang="ts">
import { ref } from "vue";
import { h, ref } from "vue";
import { usePostHook } from "./utils/hook";
import { PureTableBar } from "@/components/RePureTableBar";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { addDialog } from "@/components/ReDialog";
import Delete from "@iconify-icons/ep/delete";
import Search from "@iconify-icons/ep/search";
@@ -12,8 +13,15 @@ import { useUserStoreHook } from "@/store/modules/user";
import { CommonUtils } from "@/utils/common";
import PostFormModal from "@/views/system/post/post-form-modal.vue";
import EditPen from "@iconify-icons/ep/edit-pen";
import { PostPageResponse } from "@/api/system/post";
import {
AddPostCommand,
PostPageResponse,
UpdatePostCommand,
addPostApi,
updatePostApi
} from "@/api/system/post";
import AddFill from "@iconify-icons/ri/add-circle-line";
import { ElMessage } from "element-plus";
/** 组件name最好和菜单表中的router_name一致 */
defineOptions({
@@ -43,13 +51,55 @@ const {
handleBulkDelete
} = usePostHook();
const opType = ref<"add" | "update">("add");
const modalVisible = ref(false);
const opRow = ref<PostPageResponse>();
const postFormRef = ref();
function getPostFormData(row?: PostPageResponse) {
return {
postId: row?.postId ?? 0,
postCode: row?.postCode ?? "",
postName: row?.postName ?? "",
postSort: row?.postSort ?? 1,
remark: row?.remark ?? "",
status: row?.status?.toString() ?? ""
};
}
async function submitPostForm(
type: "add" | "update",
formData: AddPostCommand & Partial<UpdatePostCommand>,
done: () => void
) {
if (type === "add") {
await addPostApi(formData);
} else {
await updatePostApi(formData as UpdatePostCommand);
}
ElMessage.success("提交成功");
done();
onSearch(tableRef);
}
function openDialog(type: "add" | "update", row?: PostPageResponse) {
opType.value = type;
opRow.value = row;
modalVisible.value = true;
const formInline = getPostFormData(row);
addDialog({
title: type === "add" ? "新增岗位" : "更新岗位",
props: { formInline },
width: "40%",
draggable: true,
fullscreenIcon: true,
closeOnClickModal: false,
contentRenderer: () => h(PostFormModal, { ref: postFormRef }),
beforeSure: (done, { options }) => {
const formRuleRef = postFormRef.value.getFormRuleRef();
const formData = options.props.formInline as AddPostCommand &
Partial<UpdatePostCommand>;
formRuleRef.validate(valid => {
if (valid) {
submitPostForm(type, formData, () => done());
}
});
}
});
}
</script>
@@ -205,13 +255,6 @@ function openDialog(type: "add" | "update", row?: PostPageResponse) {
</pure-table>
</template>
</PureTableBar>
<post-form-modal
v-model="modalVisible"
:type="opType"
:row="opRow"
@success="onSearch"
/>
</div>
</template>
frontend/web/src/views/system/post/post-form-modal.vue
+42 -94
View File
@@ -1,43 +1,24 @@
<script setup lang="ts">
import VDialog from "@/components/VDialog/VDialog.vue";
import { computed, reactive, ref } from "vue";
import {
AddPostCommand,
PostPageResponse,
UpdatePostCommand,
addPostApi,
updatePostApi
} from "@/api/system/post";
import { ref } from "vue";
import { AddPostCommand, UpdatePostCommand } from "@/api/system/post";
import { useUserStoreHook } from "@/store/modules/user";
import { ElMessage, FormInstance, FormRules } from "element-plus";
import { FormInstance, FormRules } from "element-plus";
interface Props {
type: "add" | "update";
modelValue: boolean;
row?: PostPageResponse;
formInline: AddPostCommand & Partial<UpdatePostCommand>;
}
const props = defineProps<Props>();
const emits = defineEmits<{
(e: "update:modelValue", v: boolean): void;
(e: "success"): void;
}>();
const visible = computed({
get: () => props.modelValue,
set(v) {
emits("update:modelValue", v);
}
});
const formData = reactive<AddPostCommand | UpdatePostCommand>({
postId: 0,
postCode: "",
postName: "",
postSort: 1,
remark: "",
status: ""
const props = withDefaults(defineProps<Props>(), {
formInline: () => ({
postId: 0,
postCode: "",
postName: "",
postSort: 1,
remark: "",
status: ""
})
});
const formData = ref(props.formInline);
const statusList = useUserStoreHook().dictionaryMap["common.status"];
@@ -62,70 +43,37 @@ const rules: FormRules = {
]
};
const formRef = ref<FormInstance>();
function handleOpened() {
if (props.row) {
Object.assign(formData, props.row);
} else {
formRef.value?.resetFields();
}
function getFormRuleRef() {
return formRef.value;
}
const loading = ref(false);
async function handleConfirm() {
try {
loading.value = true;
if (props.type === "add") {
await addPostApi(formData);
} else if (props.type === "update") {
await updatePostApi(formData as UpdatePostCommand);
}
ElMessage.info("提交成功");
visible.value = false;
emits("success");
} catch (e) {
console.error(e);
ElMessage.error((e as Error)?.message || "提交失败");
} finally {
loading.value = false;
}
}
defineExpose({ getFormRuleRef });
</script>
<template>
<v-dialog
show-full-screen
:fixed-body-height="false"
use-body-scrolling
:title="type === 'add' ? '新增岗位' : '更新岗位'"
v-model="visible"
:loading="loading"
@confirm="handleConfirm"
@cancel="visible = false"
@opened="handleOpened"
>
<el-form :model="formData" label-width="120px" :rules="rules" ref="formRef">
<el-form-item prop="postName" label="岗位名称" required inline-message>
<el-input v-model="formData.postName" />
</el-form-item>
<el-form-item prop="postCode" label="岗位编码" required>
<el-input v-model="formData.postCode" />
</el-form-item>
<el-form-item prop="postSort" label="岗位顺序" required>
<el-input-number :min="1" v-model="formData.postSort" />
</el-form-item>
<el-form-item prop="status" label="岗位状态">
<el-radio-group v-model="formData.status">
<el-radio
v-for="item in Object.keys(statusList)"
:key="item"
:label="statusList[item].value"
>{{ statusList[item].label }}</el-radio
>
</el-radio-group>
</el-form-item>
<el-form-item prop="remark" label="备注" style="margin-bottom: 0">
<el-input type="textarea" v-model="formData.remark" />
</el-form-item>
</el-form>
</v-dialog>
<el-form :model="formData" label-width="120px" :rules="rules" ref="formRef">
<el-form-item prop="postName" label="岗位名称" required inline-message>
<el-input v-model="formData.postName" />
</el-form-item>
<el-form-item prop="postCode" label="岗位编码" required>
<el-input v-model="formData.postCode" />
</el-form-item>
<el-form-item prop="postSort" label="岗位顺序" required>
<el-input-number :min="1" v-model="formData.postSort" />
</el-form-item>
<el-form-item prop="status" label="岗位状态">
<el-radio-group v-model="formData.status">
<el-radio
v-for="item in Object.keys(statusList)"
:key="item"
:label="statusList[item].value"
>{{ statusList[item].label }}</el-radio
>
</el-radio-group>
</el-form-item>
<el-form-item prop="remark" label="备注" style="margin-bottom: 0">
<el-input type="textarea" v-model="formData.remark" />
</el-form-item>
</el-form>
</template>
frontend/web/src/views/system/role/index.vue
+76 -16
View File
@@ -1,15 +1,23 @@
<script setup lang="ts">
import { ref } from "vue";
import { h, ref } from "vue";
import { useRole } from "./utils/hook";
import { PureTableBar } from "@/components/RePureTableBar";
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
import { addDialog } from "@/components/ReDialog";
import Delete from "@iconify-icons/ep/delete";
import EditPen from "@iconify-icons/ep/edit-pen";
import Search from "@iconify-icons/ep/search";
import Refresh from "@iconify-icons/ep/refresh";
import AddFill from "@iconify-icons/ri/add-circle-line";
import { getRoleInfoApi, RoleDTO } from "@/api/system/role";
import {
AddRoleCommand,
RoleDTO,
UpdateRoleCommand,
addRoleApi,
getRoleInfoApi,
updateRoleApi
} from "@/api/system/role";
import RoleFormModal from "@/views/system/role/role-form-modal.vue";
import { ElMessage } from "element-plus";
@@ -31,11 +39,37 @@ const {
handleDelete
} = useRole();
const opType = ref<"add" | "update">("add");
const modalVisible = ref(false);
const opRow = ref<RoleDTO>();
const roleFormRef = ref();
function getRoleFormData(row?: RoleDTO) {
return {
roleId: row?.roleId ?? 0,
dataScope: row?.dataScope?.toString() ?? "",
menuIds: row?.selectedMenuList ?? [],
remark: row?.remark ?? "",
roleKey: row?.roleKey ?? "",
roleName: row?.roleName ?? "",
roleSort: row?.roleSort ?? 1,
status: row?.status?.toString() ?? ""
};
}
async function submitRoleForm(
type: "add" | "update",
formData: AddRoleCommand & Partial<UpdateRoleCommand>,
done: () => void
) {
if (type === "add") {
await addRoleApi(formData);
} else {
await updateRoleApi(formData as UpdateRoleCommand);
}
ElMessage.success("提交成功");
done();
onSearch();
}
async function openDialog(type: "add" | "update", row?: RoleDTO) {
debugger;
try {
await getMenuTree();
if (row) {
@@ -46,10 +80,43 @@ async function openDialog(type: "add" | "update", row?: RoleDTO) {
} catch (e) {
console.error(e);
ElMessage.error((e as Error)?.message || "加载菜单失败");
return;
}
opType.value = type;
opRow.value = row;
modalVisible.value = true;
const formInline = getRoleFormData(row);
addDialog({
title: type === "add" ? "新增角色" : "更新角色",
props: {
formInline,
menuOptions: menuTree.value
},
width: "40%",
draggable: true,
fullscreenIcon: true,
closeOnClickModal: false,
contentRenderer: () => h(RoleFormModal, { ref: roleFormRef }),
beforeSure: (done, { options }) => {
const formRuleRef = roleFormRef.value.getFormRuleRef();
const formData = options.props.formInline as AddRoleCommand &
Partial<UpdateRoleCommand>;
formRuleRef.validate(valid => {
if (valid) {
submitRoleForm(type, formData, () => done());
}
});
}
});
}
function handleSelectionChange(rows: RoleDTO[]) {
void rows;
}
function handleSizeChange() {
onSearch();
}
function handleCurrentChange() {
onSearch();
}
</script>
<template>
@@ -205,13 +272,6 @@ async function openDialog(type: "add" | "update", row?: RoleDTO) {
</pure-table>
</template>
</PureTableBar>
<role-form-modal
v-model="modalVisible"
:type="opType"
:row="opRow"
:menu-options="menuTree"
/>
</div>
</template>
frontend/web/src/views/system/role/role-form-modal.vue
+62 -115
View File
@@ -1,47 +1,29 @@
<script setup lang="ts">
import VDialog from "@/components/VDialog/VDialog.vue";
import { computed, reactive, ref } from "vue";
import { ref } from "vue";
import { useUserStoreHook } from "@/store/modules/user";
import { ElMessage, FormInstance, FormRules } from "element-plus";
import {
AddRoleCommand,
RoleDTO,
UpdateRoleCommand,
addRoleApi,
updateRoleApi
} from "@/api/system/role";
import { ElTree, FormInstance, FormRules } from "element-plus";
import { AddRoleCommand, UpdateRoleCommand } from "@/api/system/role";
import { MenuDTO } from "@/api/system/menu";
interface Props {
type: "add" | "update";
modelValue: boolean;
row?: RoleDTO;
formInline: AddRoleCommand & Partial<UpdateRoleCommand>;
menuOptions: MenuDTO[];
}
const props = defineProps<Props>();
const emits = defineEmits<{
(e: "update:modelValue", v: boolean): void;
(e: "success"): void;
}>();
const visible = computed({
get: () => props.modelValue,
set(v) {
emits("update:modelValue", v);
}
});
const formData = reactive<AddRoleCommand | UpdateRoleCommand>({
roleId: 0,
dataScope: "",
menuIds: [],
remark: "",
roleKey: "",
roleName: "",
roleSort: 1,
status: ""
const props = withDefaults(defineProps<Props>(), {
formInline: () => ({
roleId: 0,
dataScope: "",
menuIds: [],
remark: "",
roleKey: "",
roleName: "",
roleSort: 1,
status: ""
}),
menuOptions: () => []
});
const formData = ref(props.formInline);
const statusList = useUserStoreHook().dictionaryMap["common.status"];
@@ -66,93 +48,58 @@ const rules: FormRules = {
]
};
const formRef = ref<FormInstance>();
function handleOpened() {
console.log("opened", props.row);
if (props.row) {
Object.assign(formData, props.row);
formData.menuIds = props.row.selectedMenuList;
} else {
formRef.value?.resetFields();
}
}
const treeRef = ref<InstanceType<typeof ElTree>>();
function handleCheckChange() {
formData.menuIds = treeRef.value.getCheckedKeys(false) as number[];
formData.value.menuIds = treeRef.value.getCheckedKeys(false) as number[];
}
const loading = ref(false);
async function handleConfirm() {
try {
loading.value = true;
if (props.type === "add") {
await addRoleApi(formData);
} else if (props.type === "update") {
await updateRoleApi(formData as UpdateRoleCommand);
}
ElMessage.info("提交成功");
visible.value = false;
emits("success");
} catch (e) {
console.error(e);
ElMessage.error((e as Error)?.message || "提交失败");
} finally {
loading.value = false;
}
function getFormRuleRef() {
return formRef.value;
}
defineExpose({ getFormRuleRef });
</script>
<template>
<v-dialog
show-full-screen
fixed-body-height
use-body-scrolling
:title="type === 'add' ? '新增角色' : '更新角色'"
v-model="visible"
:loading="loading"
@confirm="handleConfirm"
@cancel="visible = false"
@opened="handleOpened"
>
<el-form :model="formData" label-width="120px" :rules="rules" ref="formRef">
<el-form-item prop="roleName" label="角色名称" required inline-message>
<el-input v-model="formData.roleName" />
</el-form-item>
<el-form-item prop="roleKey" label="权限字符" required>
<el-input v-model="formData.roleKey" />
</el-form-item>
<el-form-item prop="roleSort" label="角色顺序" required>
<el-input-number :min="1" v-model="formData.roleSort" />
</el-form-item>
<el-form-item prop="status" label="角色状态">
<el-radio-group v-model="formData.status">
<el-radio
v-for="item in Object.keys(statusList)"
:key="item"
:label="statusList[item].value"
>{{ statusList[item].label }}</el-radio
>
</el-radio-group>
</el-form-item>
<el-form-item label="菜单权限" prop="menuIds">
<el-tree
ref="treeRef"
:props="{ label: 'menuName', children: 'children' }"
:data="props.menuOptions"
node-key="id"
check-strictly
show-checkbox
default-expand-all
check-on-click-node
:expand-on-click-node="false"
:default-checked-keys="formData.menuIds"
@check-change="handleCheckChange"
style="width: 100%"
/>
</el-form-item>
<el-form-item prop="remark" label="备注" style="margin-bottom: 0">
<el-input type="textarea" v-model="formData.remark" />
</el-form-item>
</el-form>
</v-dialog>
<el-form :model="formData" label-width="120px" :rules="rules" ref="formRef">
<el-form-item prop="roleName" label="角色名称" required inline-message>
<el-input v-model="formData.roleName" />
</el-form-item>
<el-form-item prop="roleKey" label="权限字符" required>
<el-input v-model="formData.roleKey" />
</el-form-item>
<el-form-item prop="roleSort" label="角色顺序" required>
<el-input-number :min="1" v-model="formData.roleSort" />
</el-form-item>
<el-form-item prop="status" label="角色状态">
<el-radio-group v-model="formData.status">
<el-radio
v-for="item in Object.keys(statusList)"
:key="item"
:label="statusList[item].value"
>{{ statusList[item].label }}</el-radio
>
</el-radio-group>
</el-form-item>
<el-form-item label="菜单权限" prop="menuIds">
<el-tree
ref="treeRef"
:props="{ label: 'menuName', children: 'children' }"
:data="props.menuOptions"
node-key="id"
check-strictly
show-checkbox
default-expand-all
check-on-click-node
:expand-on-click-node="false"
:default-checked-keys="formData.menuIds"
@check-change="handleCheckChange"
style="width: 100%"
/>
</el-form-item>
<el-form-item prop="remark" label="备注" style="margin-bottom: 0">
<el-input type="textarea" v-model="formData.remark" />
</el-form-item>
</el-form>
</template>