feat:新增岗位管理

Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Application.Contracts/Dtos/Post/PostCreateInputVo.cs

@@ -5,12 +5,9 @@ namespace Yi.Framework.Rbac.Application.Contracts.Dtos.Post
     /// </summary>
     public class PostCreateInputVo
     {
-        public Guid Id { get; set; }
-        public DateTime CreationTime { get; set; } = DateTime.Now;
-        public long? CreatorId { get; set; }
         public bool? State { get; set; }
-        public string PostCode { get; set; } = string.Empty;
+        public string PostCode { get; set; }
-        public string PostName { get; set; } = string.Empty;
+        public string PostName { get; set; } 
         public string? Remark { get; set; }
     }
 }

Yi.Abp.Net8/module/rbac/Yi.Framework.Rbac.Application.Contracts/Dtos/Post/PostUpdateInputVo.cs

@@ -2,12 +2,9 @@ namespace Yi.Framework.Rbac.Application.Contracts.Dtos.Post
 {
     public class PostUpdateInputVo
     {
-        public Guid Id { get; set; }
-        public DateTime CreationTime { get; set; } = DateTime.Now;
-        public Guid? CreatorId { get; set; }
         public bool? State { get; set; }
-        public string PostCode { get; set; } = string.Empty;
+        public string PostCode { get; set; }
-        public string PostName { get; set; } = string.Empty;
+        public string PostName { get; set; }
         public string? Remark { get; set; }
     }
 }

Yi.Pure.Vue3/locales/en.yaml

@@ -71,6 +71,7 @@ menus:
   pureRole: Role Manage
   pureSystemMenu: Menu Manage
   pureDept: Dept Manage
+  purePost: Post Manage
   pureSysMonitor: System Monitor
   pureOnlineUser: Online User
   pureLoginLog: Login Log

Yi.Pure.Vue3/locales/zh-CN.yaml

@@ -71,6 +71,7 @@ menus:
   pureRole: 角色管理
   pureSystemMenu: 菜单管理
   pureDept: 部门管理
+  purePost: 岗位管理
   pureSysMonitor: 系统监控
   pureOnlineUser: 在线用户
   pureLoginLog: 登录日志

Yi.Pure.Vue3/mock/asyncRoutes.ts

@@ -51,6 +51,15 @@ const systemManagementRouter = {
         title: "menus.pureDept",
         //roles: ["admin"]
       }
+    },
+    {
+      path: "/system/post/index",
+      name: "SystemPost",
+      meta: {
+        icon: "ant-design:deployment-unit-outlined",
+        title: "menus.purePost",
+        //roles: ["admin"]
+      }
     }
   ]
 };
@@ -328,7 +337,7 @@ export default defineFakeRoute([
       return [
         systemManagementRouter,
         systemMonitorRouter,
-        permissionRouter,
+        //permissionRouter,
         // frameRouter,
         // tabsRouter
       ];

Yi.Pure.Vue3/src/api/system/post.ts

@@ -2,31 +2,36 @@ import { http } from "@/utils/http";
 import type { Result, ResultPage } from "@/api/result";
 
 /** 查询岗位列表 */
-export const getList = (data?: object) => {
+export const getPostList = (data?: object) => {
-  return http.request<ResultPage>("get", "/dept", { data });
+  return http.request<ResultPage>("get", "/post", { data });
 };
 
-/** 查询部门详细 */
+/** 查询岗位详细 */
 export const getPost = id => {
-  return http.request<Result>("get", `/dept/${id}`, {});
+  return http.request<Result>("get", `/post/${id}`, {});
 };
 
-/** 新增部门 */
+/** 新增岗位 */
 export const addPost = data => {
-  return http.request<Result>("post", `/dept`, { data });
+  return http.request<Result>("post", `/post`, { data });
 };
 
-/** 修改部门 */
+/** 修改岗位 */
 export const updatePost = (id, data) => {
-  return http.request<Result>("put", `/dept/${id}`, { data });
+  return http.request<Result>("put", `/post/${id}`, { data });
 };
 
-/** 删除部门 */
+/** 修改岗位状态 */
-export const delPost = id => {
+export const updatePostStatus = (id, state) => {
-  return http.request<Result>("delete", `/dept`, { params: { id } });
+  return http.request<Result>("put", `/post/${id}/${state}`, {});
 };
 
-/** 获取部门选择框列表 */
+/** 删除岗位 */
+export const delPost = ids => {
+  return http.request<Result>("delete", `/post`, { params: { id:ids } });
+};
+
+/** 获取岗位选择框列表 */
 export const getPostOptionSelect = () => {
   return http.request<Result>("get", `/post`, {});
 };

Yi.Pure.Vue3/src/api/system/role.ts

@@ -7,7 +7,7 @@ export const getRoleOption = () => {
 };
 
 /** 查询角色列表 */
-export const listRole = query => {
+export const getRoleList = query => {
   return http.request<ResultPage>("get", `/role`, { params: query });
 };
 
@@ -26,7 +26,7 @@ export const updateRole = (roleId, data) => {
   return http.request<Result>("put", `/role/${roleId}`, { data });
 };
 
-/** 修改角色 */
+/** 修改角色状态 */
 export const changeRoleStatus = (roleId, state) => {
   return http.request<Result>("put", `/role/${roleId}/${state}`, {});
 };

Yi.Pure.Vue3/src/layout/hooks/useNav.ts

@@ -14,6 +14,7 @@ import { useUserStoreHook } from "@/store/modules/user";
 import { useGlobal, isAllEmpty } from "@pureadmin/utils";
 import { useEpThemeStoreHook } from "@/store/modules/epTheme";
 import { usePermissionStoreHook } from "@/store/modules/permission";
+import {getFileUrl} from "@/utils/file"
 import ExitFullscreen from "@iconify-icons/ri/fullscreen-exit-fill";
 import Fullscreen from "@iconify-icons/ri/fullscreen-fill";
 
@@ -40,9 +41,7 @@ export function useNav() {
 
   /** 头像（如果头像为空则使用 src/assets/user.jpg ） */
   const userAvatar = computed(() => {
-    return isAllEmpty(useUserStoreHook()?.avatar)
+    return getFileUrl(useUserStoreHook()?.avatar,Avatar);
-      ? Avatar
-      : useUserStoreHook()?.avatar;
   });
 
   /** 昵称（如果昵称为空则显示用户名） */

Yi.Pure.Vue3/src/utils/file.ts

@@ -0,0 +1,8 @@
+import {isAllEmpty} from "@pureadmin/utils";
+
+export function getFileUrl(fileId: string, tryPath: string): string {
+  if (isAllEmpty(fileId)) {
+    return tryPath;
+  }
+  return `${import.meta.env.VITE_APP_BASE_API}/file/${fileId}`;
+}

Yi.Pure.Vue3/src/utils/http/index.ts

@@ -12,7 +12,8 @@ import { stringify } from "qs";
 import NProgress from "../progress";
 import { getToken, formatToken } from "@/utils/auth";
 import { useUserStoreHook } from "@/store/modules/user";
-
+import {message} from "@/utils/message";
+import { transformI18n } from "@/plugins/i18n";
 // 相关配置请参考：www.axios-js.com/zh-cn/docs/#axios-request-config-1
 const defaultConfig: AxiosRequestConfig = {
   baseURL: import.meta.env.VITE_APP_BASE_API,
@@ -134,13 +135,14 @@ class PureHttp {
         }
         return response;
       },
-      (error: PureHttpError) => {
+      (error: any) => {
         const $error = error;
+        message(error.response.data.error.message, { type: "error" });
         $error.isCancelRequest = Axios.isCancel($error);
         // 关闭进度条动画
         NProgress.done();
         // 所有的响应异常 区分来源为取消请求/非取消请求
-        return Promise.reject($error);
+         return Promise.reject($error);
       }
     );
   }

Yi.Pure.Vue3/src/views/system/menu/utils/hook.tsx

@@ -1,7 +1,7 @@
 import editForm from "../form.vue";
 import { handleTree } from "@/utils/tree";
 import { message } from "@/utils/message";
-import { addMenu, delMenu, getListMenu, updateMenu } from "@/api/system/menu";
+import {addMenu, delMenu, getListMenu, getMenu, updateMenu} from "@/api/system/menu";
 import { transformI18n } from "@/plugins/i18n";
 import { addDialog } from "@/components/ReDialog";
 import { reactive, ref, onMounted, h } from "vue";
@@ -129,32 +129,32 @@ export function useMenu() {
   }
 
   async function openDialog(title = "新增", row?: FormItemProps) {
-    // let data: any = null;
+    let data: any = null;
-    // if (title == "修改") {
+    if (title == "修改") {
-    //   data = await getMenu(row.id);
+      data = await getMenu(row.id);
-    // }
+    }
     addDialog({
       title: `${title}菜单`,
       props: {
         formInline: {
           menuName: row?.menuName ?? "",
           menuType:
-            row?.menuType == undefined
+            data?.menuType == undefined
               ? 0
               : menuTypeOptions.findIndex(
                   option => option.value === row?.menuType
                 ),
           higherMenuOptions: formatHigherMenuOptions(cloneDeep(dataList.value)),
-          id: row?.id ?? "",
+          id: data?.id ?? "",
-          parentId: row?.parentId ?? 0,
+          parentId: data?.parentId ?? 0,
-          router: row?.router ?? "",
+          router: data?.router ?? "",
-          component: row?.component ?? "",
+          component: data?.component ?? "",
-          orderNum: row?.orderNum ?? 0,
+          orderNum: data?.orderNum ?? 0,
-          icon: row?.icon ?? "",
+          icon: data?.icon ?? "",
-          permissionCode: row?.permissionCode ?? "",
+          permissionCode: data?.permissionCode ?? "",
-          showLink: row?.isShow ?? true,
+          showLink: data?.isShow ?? true,
-          isLink: row?.isLink ?? false,
+          isLink: data?.isLink ?? false,
-          state: row?.state ?? true
+          state: data?.state ?? true
         }
       },
       width: "45%",

Yi.Pure.Vue3/src/views/system/post/form.vue

@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { formRules } from "./utils/rule";
+import { FormProps } from "./utils/types";
+
+const props = withDefaults(defineProps<FormProps>(), {
+  formInline: () => ({
+    id: "",
+    postName: "",
+    postCode: "",
+    remark: "",
+    orderNum: 0
+  })
+});
+
+const ruleFormRef = ref();
+const newFormInline = ref(props.formInline);
+
+function getRef() {
+  return ruleFormRef.value;
+}
+
+defineExpose({ getRef });
+</script>
+
+<template>
+  <el-form
+    ref="ruleFormRef"
+    :model="newFormInline"
+    :rules="formRules"
+    label-width="82px"
+  >
+    <el-form-item label="角色名称" prop="postName">
+      <el-input
+        v-model="newFormInline.postName"
+        clearable
+        placeholder="请输入角色名称"
+      />
+    </el-form-item>
+
+    <el-form-item label="角色标识" prop="postCode">
+      <el-input
+        v-model="newFormInline.postCode"
+        clearable
+        placeholder="请输入角色标识"
+      />
+    </el-form-item>
+
+    <el-form-item label="备注">
+      <el-input
+        v-model="newFormInline.remark"
+        placeholder="请输入备注信息"
+        type="textarea"
+      />
+    </el-form-item>
+  </el-form>
+</template>

Yi.Pure.Vue3/src/views/system/post/index.vue

@@ -0,0 +1,293 @@
+<script setup lang="ts">
+import { usePost } from "./utils/hook";
+import { ref, computed, nextTick, onMounted } from "vue";
+import { PureTableBar } from "@/components/RePureTableBar";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+import {
+  delay,
+  subBefore,
+  deviceDetection,
+  useResizeObserver
+} from "@pureadmin/utils";
+
+// import Database from "@iconify-icons/ri/database-2-line";
+// import More from "@iconify-icons/ep/more-filled";
+import Delete from "@iconify-icons/ep/delete";
+import EditPen from "@iconify-icons/ep/edit-pen";
+import Refresh from "@iconify-icons/ep/refresh";
+import Menu from "@iconify-icons/ep/menu";
+import AddFill from "@iconify-icons/ri/add-circle-line";
+import Close from "@iconify-icons/ep/close";
+import Check from "@iconify-icons/ep/check";
+
+defineOptions({
+  name: "SystemPost"
+});
+
+const iconClass = computed(() => {
+  return [
+    "w-[22px]",
+    "h-[22px]",
+    "flex",
+    "justify-center",
+    "items-center",
+    "outline-none",
+    "rounded-[4px]",
+    "cursor-pointer",
+    "transition-colors",
+    "hover:bg-[#0000000f]",
+    "dark:hover:bg-[#ffffff1f]",
+    "dark:hover:text-[#ffffffd9]"
+  ];
+});
+const formRef = ref();
+const tableRef = ref();
+const contentRef = ref();
+const treeHeight = ref();
+
+const {
+  form,
+  isShow,
+  curRow,
+  loading,
+  columns,
+  rowStyle,
+  dataList,
+  treeData,
+  treeProps,
+  isLinkage,
+  pagination,
+  isExpandAll,
+  isSelectAll,
+  treeSearchValue,
+  onSearch,
+  resetForm,
+  openDialog,
+  handleMenu,
+  handleSave,
+  handleDelete,
+  filterMethod,
+  transformI18n,
+  onQueryChanged,
+  handleSizeChange,
+  handleCurrentChange,
+  handleSelectionChange
+} = usePost();
+
+onMounted(() => {
+  useResizeObserver(contentRef, async () => {
+    await nextTick();
+    delay(60).then(() => {
+      treeHeight.value = parseFloat(
+        subBefore(tableRef.value.getTableDoms().tableWrapper.style.height, "px")
+      );
+    });
+  });
+});
+</script>
+
+<template>
+  <div class="main">
+    <el-form
+      ref="formRef"
+      :inline="true"
+      :model="form"
+      class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px] overflow-auto"
+    >
+      <el-form-item label="岗位名称：" prop="postName">
+        <el-input
+          v-model="form.postName"
+          placeholder="请输入岗位名称"
+          clearable
+          class="!w-[180px]"
+        />
+      </el-form-item>
+      <el-form-item label="岗位标识：" prop="postCode">
+        <el-input
+          v-model="form.postCode"
+          placeholder="请输入岗位标识"
+          clearable
+          class="!w-[180px]"
+        />
+      </el-form-item>
+      <el-form-item label="状态：" prop="state">
+        <el-select
+          v-model="form.state"
+          placeholder="请选择状态"
+          clearable
+          class="!w-[180px]"
+        >
+          <el-option label="已启用" :value="true" />
+          <el-option label="已停用" :value="false" />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon('ri:search-line')"
+          :loading="loading"
+          @click="onSearch"
+        >
+          搜索
+        </el-button>
+        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)">
+          重置
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <div
+      ref="contentRef"
+      :class="['flex', deviceDetection() ? 'flex-wrap' : '']"
+    >
+      <PureTableBar
+        :class="[isShow && !deviceDetection() ? '!w-[60vw]' : 'w-full']"
+        style="transition: width 220ms cubic-bezier(0.4, 0, 0.2, 1)"
+        title="岗位管理"
+        :columns="columns"
+        @refresh="onSearch"
+      >
+        <template #buttons>
+          <el-button
+            type="primary"
+            :icon="useRenderIcon(AddFill)"
+            @click="openDialog()"
+          >
+            新增岗位
+          </el-button>
+        </template>
+        <template v-slot="{ size, dynamicColumns }">
+          <pure-table
+            ref="tableRef"
+            align-whole="center"
+            showOverflowTooltip
+            table-layout="auto"
+            :loading="loading"
+            :size="size"
+            adaptive
+            :row-style="rowStyle"
+            :adaptiveConfig="{ offsetBottom: 108 }"
+            :data="dataList"
+            :columns="dynamicColumns"
+            :pagination="{ ...pagination, size }"
+            :header-cell-style="{
+              background: 'var(--el-fill-color-light)',
+              color: 'var(--el-text-color-primary)'
+            }"
+            @selection-change="handleSelectionChange"
+            @page-size-change="handleSizeChange"
+            @page-current-change="handleCurrentChange"
+          >
+            <template #operation="{ row }">
+              <el-button
+                class="reset-margin"
+                link
+                type="primary"
+                :size="size"
+                :icon="useRenderIcon(EditPen)"
+                @click="openDialog('修改', row)"
+              >
+                修改
+              </el-button>
+              <el-popconfirm
+                :title="`是否确认删除岗位名称为${row.postName}的这条数据`"
+                @confirm="handleDelete(row)"
+              >
+                <template #reference>
+                  <el-button
+                    class="reset-margin"
+                    link
+                    type="primary"
+                    :size="size"
+                    :icon="useRenderIcon(Delete)"
+                  >
+                    删除
+                  </el-button>
+                </template>
+              </el-popconfirm>
+            </template>
+          </pure-table>
+        </template>
+      </PureTableBar>
+
+      <div
+        v-if="isShow"
+        class="!min-w-[calc(100vw-60vw-268px)] w-full mt-2 px-2 pb-2 bg-bg_color ml-2 overflow-auto"
+      >
+        <div class="flex justify-between w-full px-3 pt-5 pb-4">
+          <div class="flex">
+            <span :class="iconClass">
+              <IconifyIconOffline
+                v-tippy="{
+                  content: '关闭'
+                }"
+                class="dark:text-white"
+                width="18px"
+                height="18px"
+                :icon="Close"
+                @click="handleMenu"
+              />
+            </span>
+            <span :class="[iconClass, 'ml-2']">
+              <IconifyIconOffline
+                v-tippy="{
+                  content: '保存菜单权限'
+                }"
+                class="dark:text-white"
+                width="18px"
+                height="18px"
+                :icon="Check"
+                @click="handleSave"
+              />
+            </span>
+          </div>
+          <p class="font-bold truncate">
+            菜单权限
+            {{ `${curRow?.name ? `（${curRow.name}）` : ""}` }}
+          </p>
+        </div>
+        <el-input
+          v-model="treeSearchValue"
+          placeholder="请输入菜单进行搜索"
+          class="mb-1"
+          clearable
+          @input="onQueryChanged"
+        />
+        <div class="flex flex-wrap">
+          <el-checkbox v-model="isExpandAll" label="展开/折叠" />
+          <el-checkbox v-model="isSelectAll" label="全选/全不选" />
+          <el-checkbox v-model="isLinkage" label="父子联动" />
+        </div>
+        <el-tree-v2
+          ref="treeRef"
+          show-checkbox
+          :data="treeData"
+          :props="treeProps"
+          :height="treeHeight"
+          :check-strictly="!isLinkage"
+          :filter-method="filterMethod"
+        >
+          <template #default="{ node }">
+            <span>{{ transformI18n(node.label) }}</span>
+          </template>
+        </el-tree-v2>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+:deep(.el-dropdown-menu__item i) {
+  margin: 0;
+}
+
+.main-content {
+  margin: 24px 24px 0 !important;
+}
+
+.search-form {
+  :deep(.el-form-item) {
+    margin-bottom: 12px;
+  }
+}
+</style>

Yi.Pure.Vue3/src/views/system/post/utils/hook.tsx

@@ -0,0 +1,298 @@
+import dayjs from "dayjs";
+import editForm from "../form.vue";
+import {message} from "@/utils/message";
+import {ElMessageBox} from "element-plus";
+import {usePublicHooks} from "../../hooks";
+import {transformI18n} from "@/plugins/i18n";
+import {addDialog} from "@/components/ReDialog";
+import type {FormItemProps} from "../utils/types";
+import type {PaginationProps} from "@pureadmin/table";
+import {getKeyList, deviceDetection} from "@pureadmin/utils";
+import {
+  getPostList,
+  addPost,
+  updatePost,
+  delPost,
+  getPost,
+  updatePostStatus
+} from "@/api/system/post"
+
+import {
+  type Ref,
+  reactive,
+  ref,
+  onMounted,
+  h,
+  toRaw,
+  watch,
+  nextTick
+} from "vue";
+
+export function usePost(treeRef: Ref) {
+  const form = reactive({
+    postName: "",
+    postCode: "",
+    state: true,
+    skipCount: 1,
+    maxResultCount: 10
+  });
+  const curRow = ref();
+  const formRef = ref();
+  const dataList = ref([]);
+  const treeIds = ref([]);
+  const treeData = ref([]);
+  const isShow = ref(false);
+  const loading = ref(true);
+  const isLinkage = ref(false);
+  const treeSearchValue = ref();
+  const switchLoadMap = ref({});
+  const isExpandAll = ref(false);
+  const isSelectAll = ref(false);
+  const {switchStyle} = usePublicHooks();
+  const pagination = reactive<PaginationProps>({
+    total: 0,
+    pageSize: 10,
+    currentPage: 1,
+    background: true
+  });
+  const columns: TableColumnList = [
+    {
+      label: "岗位编号",
+      prop: "id"
+    },
+    {
+      label: "岗位名称",
+      prop: "postName"
+    },
+    {
+      label: "岗位标识",
+      prop: "postCode"
+    },
+    {
+      label: "状态",
+      cellRenderer: scope => (
+        <el-switch
+          size={scope.props.size === "small" ? "small" : "default"}
+          loading={switchLoadMap.value[scope.index]?.loading}
+          v-model={scope.row.state}
+          active-value={true}
+          inactive-value={false}
+          active-text="已启用"
+          inactive-text="已停用"
+          inline-prompt
+          style={switchStyle.value}
+          onChange={() => onChange(scope as any)}
+        />
+      ),
+      minWidth: 90
+    },
+    {label:"排序",prop:"orderNum"},
+    {
+      label: "备注",
+      prop: "remark",
+      minWidth: 160
+    },
+    {
+      label: "创建时间",
+      prop: "creationTime",
+      minWidth: 160,
+      formatter: ({creationTime}) =>
+        dayjs(creationTime).format("YYYY-MM-DD HH:mm:ss")
+    },
+    {
+      label: "操作",
+      fixed: "right",
+      width: 210,
+      slot: "operation"
+    }
+  ];
+
+  async function onChange({row, index}) {
+    ElMessageBox.confirm(
+      `确认要<strong>${
+        row.state === false ? "停用" : "启用"
+      }</strong><strong style='color:var(--el-color-primary)'>${
+        row.roleName
+      }</strong>吗?`,
+      "系统提示",
+      {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+        dangerouslyUseHTMLString: true,
+        draggable: true
+      }
+    )
+      .then(async () => {
+        switchLoadMap.value[index] = Object.assign(
+          {},
+          switchLoadMap.value[index],
+          {
+            loading: true
+          }
+        );
+
+        await updatePostStatus(row.id, row.state);
+
+        switchLoadMap.value[index] = Object.assign(
+          {},
+          switchLoadMap.value[index],
+          {
+            loading: false
+          }
+        );
+        message(`已${row.state === false ? "停用" : "启用"}${row.roleName}`, {
+          type: "success"
+        });
+      })
+      .catch(() => {
+        row.state === false ? (row.state = true) : (row.state = false);
+      });
+  }
+
+  async function handleDelete(row) {
+    await delPost([row.id]);
+    message(`您删除了角色名称为${row.roleName}的这条数据`, {type: "success"});
+    onSearch();
+  }
+
+  function handleSizeChange(val: number) {
+    form.maxResultCount = val;
+    onSearch();
+  }
+
+  function handleCurrentChange(val: number) {
+    form.skipCount = val;
+    onSearch();
+  }
+
+  function handleSelectionChange(val) {
+    console.log("handleSelectionChange", val);
+  }
+
+  async function onSearch() {
+    loading.value = true;
+    const {data} = await getPostList(toRaw(form));
+    dataList.value = data.items;
+    pagination.total = data.totalCount;
+    loading.value = false;
+  }
+
+  const resetForm = formEl => {
+    if (!formEl) return;
+    formEl.resetFields();
+    onSearch();
+  };
+
+  async function openDialog(title = "新增", row?: FormItemProps) {
+    let data: any = null;
+    if (title == "修改") {
+      data = (await getPost(row?.id)).data;
+    }
+    addDialog({
+      title: `${title}岗位`,
+      props: {
+        formInline: {
+          postName: row?.postName ?? "",
+          postCode: row?.postCode ?? "",
+          remark: row?.remark ?? "",
+          orderNum: data?.orderNum ?? 0,
+        }
+      },
+      width: "40%",
+      draggable: true,
+      fullscreen: deviceDetection(),
+      fullscreenIcon: true,
+      closeOnClickModal: false,
+      contentRenderer: () => h(editForm, {ref: formRef}),
+      beforeSure: (done, {options}) => {
+        const FormRef = formRef.value.getRef();
+        const curData = options.props.formInline as FormItemProps;
+
+        function chores() {
+          message(`您${title}了岗位名称为${curData.postName}的这条数据`, {
+            type: "success"
+          });
+          done(); // 关闭弹框
+          onSearch(); // 刷新表格数据
+        }
+
+        FormRef.validate(async valid => {
+          if (valid) {
+            // 表单规则校验通过
+            if (title === "新增") {
+              // 实际开发先调用新增接口，再进行下面操作
+              await addPost(curData);
+              chores();
+            } else {
+              // 实际开发先调用修改接口，再进行下面操作
+              await updatePost(row?.id, curData);
+              chores();
+            }
+          }
+        });
+      }
+    });
+  }
+
+  /** 高亮当前权限选中行 */
+  function rowStyle({row: {id}}) {
+    return {
+      cursor: "pointer",
+      background: id === curRow.value?.id ? "var(--el-fill-color-light)" : ""
+    };
+  }
+
+  /** 数据权限 可自行开发 */
+    // function handleDatabase() {}
+
+  const onQueryChanged = (query: string) => {
+      treeRef.value!.filter(query);
+    };
+
+  const filterMethod = (query: string, node) => {
+    return transformI18n(node.title)!.includes(query);
+  };
+
+  onMounted(async () => {
+    onSearch();
+  });
+
+  watch(isExpandAll, val => {
+    val
+      ? treeRef.value.setExpandedKeys(treeIds.value)
+      : treeRef.value.setExpandedKeys([]);
+  });
+
+  watch(isSelectAll, val => {
+    val
+      ? treeRef.value.setCheckedKeys(treeIds.value)
+      : treeRef.value.setCheckedKeys([]);
+  });
+
+  return {
+    form,
+    isShow,
+    curRow,
+    loading,
+    columns,
+    rowStyle,
+    dataList,
+    treeData,
+    isLinkage,
+    pagination,
+    isExpandAll,
+    isSelectAll,
+    treeSearchValue,
+    onSearch,
+    resetForm,
+    openDialog,
+    handleDelete,
+    filterMethod,
+    transformI18n,
+    onQueryChanged,
+    handleSizeChange,
+    handleCurrentChange,
+    handleSelectionChange
+  };
+}

Yi.Pure.Vue3/src/views/system/post/utils/rule.ts

@@ -0,0 +1,8 @@
+import { reactive } from "vue";
+import type { FormRules } from "element-plus";
+
+/** 自定义表单规则校验 */
+export const formRules = reactive(<FormRules>{
+  postName: [{ required: true, message: "岗位名称为必填项", trigger: "blur" }],
+  postCode: [{ required: true, message: "岗位标识为必填项", trigger: "blur" }]
+});

Yi.Pure.Vue3/src/views/system/post/utils/types.ts

@@ -0,0 +1,18 @@
+// 虽然字段很少 但是抽离出来 后续有扩展字段需求就很方便了
+
+interface FormItemProps {
+  id?: string;
+  /** 角色名称 */
+  postName: string;
+  /** 角色编号 */
+  postCode: string;
+  /** 备注 */
+  remark: string;
+  orderNum: number;
+
+}
+interface FormProps {
+  formInline: FormItemProps;
+}
+
+export type { FormItemProps, FormProps };

Yi.Pure.Vue3/src/views/system/role/index.vue

@@ -98,7 +98,7 @@ onMounted(() => {
       :model="form"
       class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px] overflow-auto"
     >
-      <el-form-item label="角色名称：" prop="name">
+      <el-form-item label="角色名称：" prop="roleName">
         <el-input
           v-model="form.roleName"
           placeholder="请输入角色名称"
@@ -106,7 +106,7 @@ onMounted(() => {
           class="!w-[180px]"
         />
       </el-form-item>
-      <el-form-item label="角色标识：" prop="code">
+      <el-form-item label="角色标识：" prop="roleCode">
         <el-input
           v-model="form.roleCode"
           placeholder="请输入角色标识"
@@ -114,7 +114,7 @@ onMounted(() => {
           class="!w-[180px]"
         />
       </el-form-item>
-      <el-form-item label="状态：" prop="status">
+      <el-form-item label="状态：" prop="state">
         <el-select
           v-model="form.state"
           placeholder="请选择状态"

Yi.Pure.Vue3/src/views/system/role/utils/hook.tsx

@@ -10,7 +10,7 @@ import type { FormItemProps } from "../utils/types";
 import type { PaginationProps } from "@pureadmin/table";
 import { getKeyList, deviceDetection } from "@pureadmin/utils";
 import {
-  listRole,
+  getRoleList,
   getRole,
   addRole,
   updateRole,
@@ -180,7 +180,7 @@ export function useRole(treeRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await listRole(toRaw(form));
+    const { data } = await getRoleList(toRaw(form));
     dataList.value = data.items;
     pagination.total = data.totalCount;
     loading.value = false;

Yi.Pure.Vue3/src/views/system/user/utils/hook.tsx

@@ -1,15 +1,16 @@
 import "./reset.css";
 import dayjs from "dayjs";
 import editForm from "../form/index.vue";
-import { zxcvbn } from "@zxcvbn-ts/core";
+import {zxcvbn} from "@zxcvbn-ts/core";
-import { handleTree } from "@/utils/tree";
+import {handleTree} from "@/utils/tree";
-import { message } from "@/utils/message";
+import {message} from "@/utils/message";
 import userAvatar from "@/assets/user.jpg";
-import { usePublicHooks } from "../../hooks";
+import {getFileUrl} from "@/utils/file"
-import { addDialog } from "@/components/ReDialog";
+import {usePublicHooks} from "../../hooks";
-import type { PaginationProps } from "@pureadmin/table";
+import {addDialog} from "@/components/ReDialog";
+import type {PaginationProps} from "@pureadmin/table";
 import ReCropperPreview from "@/components/ReCropperPreview";
-import type { FormItemProps } from "../utils/types";
+import type {FormItemProps} from "../utils/types";
 import {
   getKeyList,
   isAllEmpty,
@@ -25,8 +26,8 @@ import {
   updateUser,
   getUserList
 } from "@/api/system/user";
-import { getRoleOption } from "@/api/system/role";
+import {getRoleOption} from "@/api/system/role";
-import { getDeptList } from "@/api/system/dept";
+import {getDeptList} from "@/api/system/dept";
 import {
   ElForm,
   ElInput,
@@ -62,7 +63,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
   // 上传头像信息
   const avatarInfo = ref();
   const switchLoadMap = ref({});
-  const { switchStyle } = usePublicHooks();
+  const {switchStyle} = usePublicHooks();
   const higherDeptOptions = ref();
   const treeData = ref([]);
   const treeLoading = ref(true);
@@ -88,12 +89,12 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     {
       label: "用户头像",
       prop: "avatar",
-      cellRenderer: ({ row }) => (
+      cellRenderer: ({row}) => (
         <el-image
           fit="cover"
           preview-teleported={true}
-          src={row.avatar || userAvatar}
+          src={getFileUrl(row.avatar, userAvatar)}
-          preview-src-list={Array.of(row.avatar || userAvatar)}
+          preview-src-list={Array.of(getFileUrl(row.avatar , userAvatar))}
           class="w-[24px] h-[24px] rounded-full align-middle"
         />
       ),
@@ -113,7 +114,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       label: "性别",
       prop: "sex",
       minWidth: 90,
-      cellRenderer: ({ row, props }) => (
+      cellRenderer: ({row, props}) => (
         <el-tag
           size={props.size}
           type={row.sex === "Woman" ? "danger" : null}
@@ -132,8 +133,8 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       label: "手机号码",
       prop: "phone",
       minWidth: 90,
-      formatter: ({ phone }) =>
+      formatter: ({phone}) =>
-        phone == null ? "-" : hideTextAtIndex(phone, { start: 3, end: 6 })
+        phone == null ? "-" : hideTextAtIndex(phone, {start: 3, end: 6})
     },
     {
       label: "状态",
@@ -158,7 +159,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       label: "创建时间",
       minWidth: 90,
       prop: "creationTime",
-      formatter: ({ creationTime }) =>
+      formatter: ({creationTime}) =>
         dayjs(creationTime).format("YYYY-MM-DD HH:mm:ss")
     },
     {
@@ -182,17 +183,17 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     password: ""
   });
   const pwdProgress = [
-    { color: "#e74242", text: "非常弱" },
+    {color: "#e74242", text: "非常弱"},
-    { color: "#EFBD47", text: "弱" },
+    {color: "#EFBD47", text: "弱"},
-    { color: "#ffa500", text: "一般" },
+    {color: "#ffa500", text: "一般"},
-    { color: "#1bbf1b", text: "强" },
+    {color: "#1bbf1b", text: "强"},
-    { color: "#008000", text: "非常强" }
+    {color: "#008000", text: "非常强"}
   ];
   // 当前密码强度（0-4）
   const curScore = ref();
   const roleOptions = ref([]);
 
-  function onChange({ row, index }) {
+  function onChange({row, index}) {
     ElMessageBox.confirm(
       `确认要<strong>${
         row.state === 0 ? "停用" : "启用"
@@ -241,7 +242,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
 
   async function handleDelete(row) {
     await delUser([row.id]);
-    message(`您删除了用户编号为${row.id}的这条数据`, { type: "success" });
+    message(`您删除了用户编号为${row.id}的这条数据`, {type: "success"});
     onSearch();
   }
 
@@ -285,7 +286,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
 
   async function onSearch() {
     loading.value = true;
-    const { data } = await getUserList(toRaw(form));
+    const {data} = await getUserList(toRaw(form));
     dataList.value = data.items;
     pagination.total = data.totalCount;
     // pagination.pageSize = data.pageSize;
@@ -304,7 +305,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     onSearch();
   };
 
-  function onTreeSelect({ id, selected }) {
+  function onTreeSelect({id, selected}) {
     form.deptId = selected ? id : "";
     onSearch();
   }
@@ -320,6 +321,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     }
     return newTreeList;
   }
+
   async function openDialog(title = "新增", row?: FormItemProps) {
     let data: any = null;
     //打开弹窗之前，如果是修改，还需进行查询详情
@@ -351,8 +353,8 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       fullscreen: deviceDetection(),
       fullscreenIcon: true,
       closeOnClickModal: false,
-      contentRenderer: () => h(editForm, { ref: formRef }),
+      contentRenderer: () => h(editForm, {ref: formRef}),
-      beforeSure: (done, { options }) => {
+      beforeSure: (done, {options}) => {
         const FormRef = formRef.value.getRef();
         const curData = options.props.formInline as FormItemProps;
 
@@ -394,7 +396,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
       contentRenderer: () =>
         h(ReCropperPreview, {
           ref: cropRef,
-          imgSrc: row.avatar || userAvatar,
+          imgSrc: getFileUrl(row.avatar, userAvatar),
           onCropper: info => (avatarInfo.value = info)
         }),
       beforeSure: done => {
@@ -409,7 +411,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
 
   watch(
     pwdForm,
-    ({ password }) =>
+    ({password}) =>
       (curScore.value = isAllEmpty(password) ? -1 : zxcvbn(password).score)
   );
 
@@ -444,10 +446,10 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
             </ElFormItem>
           </ElForm>
           <div class="mt-4 flex">
-            {pwdProgress.map(({ color, text }, idx) => (
+            {pwdProgress.map(({color, text}, idx) => (
               <div
                 class="w-[19vw]"
-                style={{ marginLeft: idx !== 0 ? "4px" : 0 }}
+                style={{marginLeft: idx !== 0 ? "4px" : 0}}
               >
                 <ElProgress
                   striped
@@ -460,7 +462,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
                 />
                 <p
                   class="text-center"
-                  style={{ color: curScore.value === idx ? color : "" }}
+                  style={{color: curScore.value === idx ? color : ""}}
                 >
                   {text}
                 </p>
@@ -492,7 +494,7 @@ export function useUser(tableRef: Ref, treeRef: Ref) {
     onSearch();
 
     // 归属部门
-    const { data } = await getDeptList();
+    const {data} = await getDeptList();
     higherDeptOptions.value = handleTree(data.items);
     treeData.value = handleTree(data.items);
     treeLoading.value = false;