feat:对接岗位管理，修复模板生成bug

docs/template/modules/soy.operate-drawer.vue.vm

@@ -30,7 +30,7 @@ const visible = defineModel<boolean>('visible', {
 
 #if($dictList && $dictList.size() > 0)
 #foreach($dict in $dictList)
-const { options: ${dict.name}Options } = useDict(${dict.type}#if($dict.immediate), false#end);
+const { options: ${dict.name}Options } = useDict('${dict.type}'#if($dict.immediate), false#end);
 #end#end
 
 const { formRef, validate, restoreValidation } = useNaiveForm();

docs/template/modules/soy.search.vue.vm

@@ -27,7 +27,7 @@ const model = defineModel<Api.$ModuleName.${BusinessName}SearchParams>('model',
 
 #if($dictList && $dictList.size() > 0)
 #foreach($dict in $dictList)
-const { options: ${dict.name}Options } = useDict('${dict.type}#if($dict.immediate)', false#end);
+const { options: ${dict.name}Options } = useDict('${dict.type}'#if($dict.immediate), false#end);
 #end#end
 
 async function reset() {

src/router/elegant/imports.ts

@@ -26,6 +26,7 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
   system_dict: () => import("@/views/system/dict/index.vue"),
   system_dict_type: () => import("@/views/system/dict/type/index.vue"),
   system_menu: () => import("@/views/system/menu/index.vue"),
+  system_post: () => import("@/views/system/post/index.vue"),
   system_tenant: () => import("@/views/system/tenant/index.vue"),
   system_user: () => import("@/views/system/user/index.vue"),
   tool_gen: () => import("@/views/tool/gen/index.vue"),

src/router/elegant/routes.ts

@@ -135,6 +135,15 @@ export const generatedRoutes: GeneratedRoute[] = [
           order: 3
         }
       },
+      {
+        name: 'system_post',
+        path: '/system/post',
+        component: 'view.system_post',
+        meta: {
+          title: 'system_post',
+          i18nKey: 'route.system_post'
+        }
+      },
       {
         name: 'system_tenant',
         path: '/system/tenant',

src/router/elegant/transform.ts

@@ -175,6 +175,7 @@ const routeMap: RouteMap = {
   "system_dict_data": "/system/dict/data",
   "system_dict_type": "/system/dict/type",
   "system_menu": "/system/menu",
+  "system_post": "/system/post",
   "system_tenant": "/system/tenant",
   "system_user": "/system/user",
   "tool": "/tool",

src/service/api/system/post.ts

@@ -28,7 +28,7 @@ export function fetchUpdatePost(data: Api.System.PostOperateParams) {
 }
 
 /** 批量删除岗位信息 */
-export function fetchDeletePost(postIds: CommonType.IdType[]) {
+export function fetchBatchDeletePost(postIds: CommonType.IdType[]) {
   return request<boolean>({
     url: `/system/post/${postIds.join(',')}`,
     method: 'delete'

src/typings/api/system.api.d.ts

@@ -358,8 +358,8 @@ declare namespace Api {
 
     /** post search params */
     type PostSearchParams = CommonType.RecordNullable<
-      Pick<Api.System.Post, 'deptId' | 'postCode' | 'postCategory' | 'postName' | 'status'> &
-        Api.Common.CommonSearchParams
+      Pick<Api.System.Post, 'deptId' | 'postCode' | 'postName' | 'status'>
+      & { belongDeptId: CommonType.IdType } & Api.Common.CommonSearchParams
     >;
 
     /** post operate params */
@@ -441,7 +441,7 @@ declare namespace Api {
     /** tenant search params */
     type TenantSearchParams = CommonType.RecordNullable<
       Pick<Api.System.Tenant, 'tenantId' | 'contactUserName' | 'contactPhone' | 'companyName'> &
-        Api.Common.CommonSearchParams
+      Api.Common.CommonSearchParams
     >;
 
     /** tenant operate params */
@@ -492,7 +492,7 @@ declare namespace Api {
     /** tenant package search params */
     type TenantPackageSearchParams = CommonType.RecordNullable<
       Pick<Api.System.TenantPackage, 'packageName' | 'menuIds' | 'menuCheckStrictly' | 'status'> &
-        Api.Common.CommonSearchParams
+      Api.Common.CommonSearchParams
     >;
 
     /** tenant package operate params */

src/typings/components.d.ts

@@ -100,7 +100,9 @@ declare module 'vue' {
     NRadio: typeof import('naive-ui')['NRadio']
     NRadioButton: typeof import('naive-ui')['NRadioButton']
     NRadioGroup: typeof import('naive-ui')['NRadioGroup']
+    NS: typeof import('naive-ui')['NS']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
+    NSe: typeof import('naive-ui')['NSe']
     NSelect: typeof import('naive-ui')['NSelect']
     NSpace: typeof import('naive-ui')['NSpace']
     NSpin: typeof import('naive-ui')['NSpin']

src/typings/elegant-router.d.ts

@@ -29,6 +29,7 @@ declare module "@elegant-router/types" {
     "system_dict_data": "/system/dict/data";
     "system_dict_type": "/system/dict/type";
     "system_menu": "/system/menu";
+    "system_post": "/system/post";
     "system_tenant": "/system/tenant";
     "system_user": "/system/user";
     "tool": "/tool";
@@ -99,6 +100,7 @@ declare module "@elegant-router/types" {
     | "system_dict"
     | "system_dict_type"
     | "system_menu"
+    | "system_post"
     | "system_tenant"
     | "system_user"
     | "tool_gen"

src/views/system/post/index.vue

@@ -0,0 +1,349 @@
+<script setup lang="tsx">
+import { NButton, NPopconfirm } from 'naive-ui';
+import { fetchBatchDeletePost, fetchGetPostList } from '@/service/api/system/post';
+import { useLoading } from '@sa/hooks';
+import { fetchGetDeptTree } from '@/service/api/system';
+import { $t } from '@/locales';
+import { useAuth } from '@/hooks/business/auth';
+import { useAppStore } from '@/store/modules/app';
+import { useDownload } from '@/hooks/business/download';
+import { useTable, useTableOperate } from '@/hooks/common/table';
+import DictTag from '@/components/custom/dict-tag.vue';
+import PostOperateDrawer from './modules/post-operate-drawer.vue';
+import PostSearch from './modules/post-search.vue';
+import { ref } from 'vue';
+
+defineOptions({
+  name: 'PostList'
+});
+
+const appStore = useAppStore();
+const { download } = useDownload();
+const { hasAuth } = useAuth();
+
+const {
+  columns,
+  columnChecks,
+  data,
+  getData,
+  getDataByPage,
+  loading,
+  mobilePagination,
+  searchParams,
+  resetSearchParams
+} = useTable({
+  apiFn: fetchGetPostList,
+  apiParams: {
+    pageNum: 1,
+    pageSize: 10,
+    // if you want to use the searchParams in Form, you need to define the following properties, and the value is null
+    // the value can not be undefined, otherwise the property in Form will not be reactive
+    postCode: null,
+    postName: null,
+    status: null,
+  },
+  columns: () => [
+    {
+      type: 'selection',
+      align: 'center',
+      width: 48
+    },
+    {
+      key: 'index',
+      title: $t('common.index'),
+      align: 'center',
+      width: 64
+    },
+    {
+      key: 'postCode',
+      title: '岗位编码',
+      align: 'center',
+      minWidth: 120
+    },
+    {
+      key: 'postCategory',
+      title: '类别编码',
+      align: 'center',
+      minWidth: 120
+    },
+    {
+      key: 'postName',
+      title: '岗位名称',
+      align: 'center',
+      minWidth: 120
+    },
+    {
+      key: 'postSort',
+      title: '显示顺序',
+      align: 'center',
+      minWidth: 120
+    },
+    {
+      key: 'status',
+      title: '状态',
+      align: 'center',
+      minWidth: 120,
+      render(row) {
+        return <DictTag size="small" value={row.status} dictCode="sys_normal_disable" />;
+      }
+    },
+    {
+      key: 'createTime',
+      title: '创建时间',
+      align: 'center',
+      minWidth: 120,
+      ellipsis: {
+        tooltip: true
+      }
+    },
+    {
+      key: 'operate',
+      title: $t('common.operate'),
+      align: 'center',
+      width: 130,
+      render: row => {
+        const editBtn = () => {
+            if (!hasAuth('system:post:edit')) {
+                return null;
+            }
+            return (
+                <NButton type="primary" ghost size="small" onClick={() => edit(row.postId!)}>
+                    {$t('common.edit')}
+                </NButton>
+            );
+        };
+
+        const deleteBtn = () => {
+            if (!hasAuth('system:post:remove')) {
+                return null;
+            }
+            return (
+                <NPopconfirm onPositiveClick={() => handleDelete(row.postId!)}>
+                    {{
+                        default: () => $t('common.confirmDelete'),
+                        trigger: () => (
+                            <NButton type="error" ghost size="small">
+                                {$t('common.delete')}
+                            </NButton>
+                        )
+                    }}
+                </NPopconfirm>
+            );
+        };
+
+        return (
+            <div class="flex-center gap-8px">
+                {editBtn()}
+                {deleteBtn()}
+            </div>
+        );
+      }
+    }
+  ]
+});
+
+const {
+  drawerVisible,
+  operateType,
+  editingData,
+  handleAdd,
+  handleEdit,
+  checkedRowKeys,
+  onBatchDeleted,
+  onDeleted
+} = useTableOperate(data, getData);
+
+async function handleBatchDelete() {
+  // request
+  const { error } = await fetchBatchDeletePost(checkedRowKeys.value)
+  if (error) return;
+  onBatchDeleted();
+}
+
+async function handleDelete(postId: CommonType.IdType) {
+  // request
+  const { error } = await fetchBatchDeletePost([postId])
+  if (error) return;
+  onDeleted();
+}
+
+async function edit(postId: CommonType.IdType) {
+  handleEdit('postId', postId);
+}
+
+async function handleExport() {
+    download('/system/post/export', searchParams, `岗位信息_${new Date().getTime()}.xlsx`);
+}
+
+const { loading: treeLoading, startLoading: startTreeLoading, endLoading: endTreeLoading } = useLoading();
+const deptPattern = ref<string>();
+const deptData = ref<Api.Common.CommonTreeRecord>([]);
+const selectedKeys = ref<string[]>([]);
+
+async function getTreeData() {
+  startTreeLoading();
+  const { data: tree, error } = await fetchGetDeptTree();
+  if (!error) {
+    deptData.value = tree;
+  }
+  endTreeLoading();
+}
+
+getTreeData();
+
+function handleClickTree(keys: string[]) {
+  selectedKeys.value = keys;
+  searchParams.belongDeptId = keys.length ? keys[0] : null;
+  checkedRowKeys.value = [];
+  getDataByPage();
+}
+
+function handleResetTreeData() {
+  deptPattern.value = undefined;
+  selectedKeys.value = [];
+  searchParams.belongDeptId = null;
+  getTreeData();
+  getDataByPage();
+}
+</script>
+
+<template>
+  <TableSiderLayout sider-title="部门列表">
+    <template #header-extra>
+      <NButton size="small" text class="h-18px" @click.stop="() => handleResetTreeData()">
+        <template #icon>
+          <SvgIcon icon="ic:round-refresh" />
+        </template>
+      </NButton>
+    </template>
+    <template #sider>
+      <NInput v-model:value="deptPattern" clearable :placeholder="$t('common.keywordSearch')" />
+      <NSpin class="dept-tree" :show="treeLoading">
+        <NTree
+          block-node
+          show-line
+          :data="deptData as []"
+          v-model:selected-keys="selectedKeys"
+          :default-expanded-keys="deptData?.length ? [deptData[0].id!] : []"
+          :show-irrelevant-nodes="false"
+          :pattern="deptPattern"
+          block-line
+          class="infinite-scroll h-full min-h-200px py-3"
+          key-field="id"
+          label-field="label"
+          virtual-scroll
+          @update:selected-keys="handleClickTree"
+        >
+          <template #empty>
+            <NEmpty description="暂无部门信息" class="h-full min-h-200px justify-center" />
+          </template>
+        </NTree>
+      </NSpin>
+    </template>
+    <div class="h-full flex-col-stretch gap-12px overflow-hidden lt-sm:overflow-auto">
+      <PostSearch v-model:model="searchParams" @reset="resetSearchParams" @search="getDataByPage" />
+      <NCard title="岗位信息列表" :bordered="false" size="small" class="sm:flex-1-hidden card-wrapper">
+        <template #header-extra>
+          <TableHeaderOperation
+            v-model:columns="columnChecks"
+            :disabled-delete="checkedRowKeys.length === 0"
+            :loading="loading"
+            :show-add="hasAuth('system:post:add')"
+            :show-delete="hasAuth('system:post:remove')"
+            :show-export="hasAuth('system:post:export')"
+            @add="handleAdd"
+            @delete="handleBatchDelete"
+            @export="handleExport"
+            @refresh="getData"
+          />
+        </template>
+        <NDataTable
+          v-model:checked-row-keys="checkedRowKeys"
+          :columns="columns"
+          :data="data"
+          size="small"
+          :flex-height="!appStore.isMobile"
+          :scroll-x="962"
+          :loading="loading"
+          remote
+          :row-key="row => row.postId"
+          :pagination="mobilePagination"
+          class="sm:h-full"
+        />
+        <PostOperateDrawer
+          v-model:visible="drawerVisible"
+          :operate-type="operateType"
+          :row-data="editingData"
+          :dept-data="deptData"
+          @submitted="getDataByPage"
+        />
+      </NCard>
+    </div>
+  </TableSiderLayout>
+</template>
+
+
+<style scoped lang="scss">
+.dept-tree {
+  .n-button {
+    --n-padding: 8px !important;
+  }
+
+  :deep(.n-tree__empty) {
+    height: 100%;
+    justify-content: center;
+  }
+
+  :deep(.n-spin-content) {
+    height: 100%;
+  }
+
+  :deep(.infinite-scroll) {
+    height: calc(100vh - 228px - var(--calc-footer-height, 0px)) !important;
+    max-height: calc(100vh - 228px - var(--calc-footer-height, 0px)) !important;
+  }
+
+  @media screen and (max-width: 1024px) {
+    :deep(.infinite-scroll) {
+      height: calc(100vh - 227px - var(--calc-footer-height, 0px)) !important;
+      max-height: calc(100vh - 227px - var(--calc-footer-height, 0px)) !important;
+    }
+  }
+
+  :deep(.n-tree-node) {
+    height: 33px;
+  }
+
+  :deep(.n-tree-node-switcher) {
+    height: 33px;
+  }
+
+  :deep(.n-tree-node-switcher__icon) {
+    font-size: 16px !important;
+    height: 16px !important;
+    width: 16px !important;
+  }
+}
+
+:deep(.n-data-table-wrapper),
+:deep(.n-data-table-base-table),
+:deep(.n-data-table-base-table-body) {
+  height: 100%;
+}
+
+@media screen and (max-width: 800px) {
+  :deep(.n-data-table-base-table-body) {
+    max-height: calc(100vh - 400px - var(--calc-footer-height, 0px));
+  }
+}
+
+@media screen and (max-width: 802px) {
+  :deep(.n-data-table-base-table-body) {
+    max-height: calc(100vh - 473px - var(--calc-footer-height, 0px));
+  }
+}
+
+:deep(.n-card-header__main) {
+  min-width: 69px !important;
+}
+</style>

src/views/system/post/modules/post-operate-drawer.vue

@@ -0,0 +1,174 @@
+<script setup lang="ts">
+import { computed, reactive, watch } from 'vue';
+import { useFormRules, useNaiveForm } from '@/hooks/common/form';
+import { $t } from '@/locales';
+import { fetchCreatePost, fetchUpdatePost } from '@/service/api/system/post';
+import { useLoading } from '@sa/hooks';
+defineOptions({
+  name: 'PostOperateDrawer'
+});
+
+interface Props {
+  /** the type of operation */
+  operateType: NaiveUI.TableOperateType;
+  /** the edit row data */
+  rowData?: Api.System.Post | null;
+  /** the dept tree data */
+  deptData?: Api.Common.CommonTreeRecord;
+}
+
+const props = defineProps<Props>();
+
+interface Emits {
+  (e: 'submitted'): void;
+}
+
+const emit = defineEmits<Emits>();
+
+const visible = defineModel<boolean>('visible', {
+  default: false
+});
+
+const { formRef, validate, restoreValidation } = useNaiveForm();
+const { createRequiredRule } = useFormRules();
+const { loading: deptLoading, startLoading: startDeptLoading, endLoading: endDeptLoading } = useLoading();
+const title = computed(() => {
+  const titles: Record<NaiveUI.TableOperateType, string> = {
+    add: '新增岗位信息',
+    edit: '编辑岗位信息'
+  };
+  return titles[props.operateType];
+});
+
+type Model = Api.System.PostOperateParams;
+
+const model: Model = reactive(createDefaultModel());
+
+function createDefaultModel(): Model {
+  return {
+    deptId: null,
+    postCode: '',
+    postCategory: '',
+    postName: '',
+    postSort: null,
+    status: '0',
+    remark: ''
+  };
+}
+
+type RuleKey = Extract<
+  keyof Model,
+  | 'postId'
+  | 'deptId'
+  | 'postCode'
+  | 'postName'
+  | 'postSort'
+  | 'status'
+>;
+
+const rules: Record<RuleKey, App.Global.FormRule> = {
+  postId: createRequiredRule('岗位ID不能为空'),
+  deptId: createRequiredRule('归属部门不能为空'),
+  postCode: createRequiredRule('岗位编码不能为空'),
+  postName: createRequiredRule('岗位名称不能为空'),
+  postSort: createRequiredRule('显示顺序不能为空'),
+  status: createRequiredRule('状态不能为空'),
+};
+
+function handleUpdateModelWhenEdit() {
+  if (props.operateType === 'add') {
+    Object.assign(model, createDefaultModel());
+    return;
+  }
+
+  if (props.operateType === 'edit' && props.rowData) {
+    startDeptLoading();
+    Object.assign(model, props.rowData);
+    endDeptLoading();
+  }
+}
+
+function closeDrawer() {
+  visible.value = false;
+}
+
+async function handleSubmit() {
+  await validate();
+
+  // request
+  if (props.operateType === 'add') {
+    const { deptId, postCode, postCategory, postName, postSort, status, remark } = model;
+    const { error } = await fetchCreatePost({ deptId, postCode, postCategory, postName, postSort, status, remark });
+    if (error) return;
+  }
+
+  if (props.operateType === 'edit') {
+    const { postId, deptId, postCode, postCategory, postName, postSort, status, remark } = model;
+    const { error } = await fetchUpdatePost({ postId, deptId, postCode, postCategory, postName, postSort, status, remark });
+    if (error) return;
+  }
+
+  window.$message?.success($t('common.updateSuccess'));
+  closeDrawer();
+  emit('submitted');
+}
+
+watch(visible, () => {
+  if (visible.value) {
+    handleUpdateModelWhenEdit();
+    restoreValidation();
+  }
+});
+</script>
+
+<template>
+  <NDrawer v-model:show="visible" :title="title" display-directive="show" :width="800" class="max-w-90%">
+    <NDrawerContent :title="title" :native-scrollbar="false" closable>
+      <NForm ref="formRef" :model="model" :rules="rules">
+        <NFormItem label="归属部门" path="deptId">
+          <NTreeSelect
+              v-model:value="model.deptId"
+              :loading="deptLoading"
+              clearable
+              :options="deptData as []"
+              label-field="label"
+              key-field="id"
+              :default-expanded-keys="deptData?.length ? [deptData[0].id] : []"
+              placeholder="请选择归属部门"
+            />
+        </NFormItem>
+        <NFormItem label="岗位编码" path="postCode">
+              <NInput v-model:value="model.postCode" placeholder="请输入岗位编码" />
+        </NFormItem>
+        <NFormItem label="类别编码" path="postCategory">
+              <NInput v-model:value="model.postCategory" placeholder="请输入类别编码" />
+        </NFormItem>
+        <NFormItem label="岗位名称" path="postName">
+              <NInput v-model:value="model.postName" placeholder="请输入岗位名称" />
+        </NFormItem>
+        <NFormItem label="显示顺序" path="postSort">
+              <NInputNumber v-model:value="model.postSort" placeholder="请输入显示顺序" />
+        </NFormItem>
+        <NFormItem label="状态" path="status">
+          <DictRadio v-model:value="model.status" dict-code="sys_normal_disable" />
+        </NFormItem>
+        <NFormItem label="备注" path="remark">
+          <NInput
+            v-model:value="model.remark"
+            :rows="3"
+            type="textarea"
+            placeholder="请输入备注"
+          />
+        </NFormItem>
+      </NForm>
+      <template #footer>
+        <NSpace :size="16">
+          <NButton @click="closeDrawer">{{ $t('common.cancel') }}</NButton>
+          <NButton type="primary" @click="handleSubmit">{{ $t('common.confirm') }}</NButton>
+        </NSpace>
+      </template>
+    </NDrawerContent>
+  </NDrawer>
+</template>
+
+<style scoped></style>

src/views/system/post/modules/post-search.vue

@@ -0,0 +1,77 @@
+<script setup lang="ts">
+import { $t } from '@/locales';
+import { useNaiveForm } from '@/hooks/common/form';
+import { useDict } from '@/hooks/business/dict';
+defineOptions({
+  name: 'PostSearch'
+});
+
+interface Emits {
+  (e: 'reset'): void;
+  (e: 'search'): void;
+}
+
+const emit = defineEmits<Emits>();
+
+const { formRef, validate, restoreValidation } = useNaiveForm();
+
+
+const model = defineModel<Api.System.PostSearchParams>('model', { required: true });
+
+const { options: sysCommonStatusOptions } = useDict('sys_normal_disable');
+
+async function reset() {
+  await restoreValidation();
+  emit('reset');
+}
+
+async function search() {
+  await validate();
+  emit('search');
+}
+</script>
+
+<template>
+  <NCard :bordered="false" size="small" class="card-wrapper">
+    <NCollapse>
+      <NCollapseItem :title="$t('common.search')" name="user-search">
+        <NForm ref="formRef" :model="model" label-placement="left" :label-width="80">
+          <NGrid responsive="screen" item-responsive>
+            <NFormItemGi span="24 s:12 m:6" label="岗位编码" path="postCode" class="pr-24px">
+              <NInput v-model:value="model.postCode" placeholder="请输入岗位编码" />
+            </NFormItemGi>
+            <NFormItemGi span="24 s:12 m:6" label="岗位名称" path="postName" class="pr-24px">
+              <NInput v-model:value="model.postName" placeholder="请输入岗位名称" />
+            </NFormItemGi>
+            <NFormItemGi span="24 s:12 m:6" label="状态" path="status" class="pr-24px">
+              <NSelect
+                v-model:value="model.status"
+                placeholder="请选择状态"
+                :options="sysCommonStatusOptions"
+                clearable
+              />
+            </NFormItemGi>
+            <NFormItemGi span="24" class="pr-24px">
+              <NSpace class="w-full" justify="end">
+                <NButton @click="reset">
+                  <template #icon>
+                    <icon-ic-round-refresh class="text-icon" />
+                  </template>
+                  {{ $t('common.reset') }}
+                </NButton>
+                <NButton type="primary" ghost @click="search">
+                  <template #icon>
+                    <icon-ic-round-search class="text-icon" />
+                  </template>
+                  {{ $t('common.search') }}
+                </NButton>
+              </NSpace>
+            </NFormItemGi>
+          </NGrid>
+        </NForm>
+      </NCollapseItem>
+    </NCollapse>
+  </NCard>
+</template>
+
+<style scoped></style>