abp-vnext-pro 实战（一，如何增加菜单项）

GuGu / 2023-07-21 / 原文

1. 在前端的vben admin 目录新增菜单

直接在 src/router/routes/modules 内新增一个模块文件即可。不需要手动引入，放在src/router/routes/modules 内的文件会自动被加载。

import type { AppRouteModule } from '/@/router/types';
import { LAYOUT } from '/@/router/constant';
import { t } from '/@/hooks/web/useI18n';
const tenant: AppRouteModule = {
  path: '/crm',
  name: 'CRM',
  component: LAYOUT,
  meta: {
    orderNo: 40,
    icon: 'ant-design:contacts-outlined',
    title: t('routes.crm.module'),
    policy: 'AbpTenantManagement',
  },
  children: [
    {
      path: 'Tenant',
      name: 'Tenant',
      component: () => import('/@/views/tenants/Tenant.vue'),
      meta: {
        title: t('routes.crm.clientInfo'),
        icon: 'ant-design:switcher-filled',
        policy: 'AbpTenantManagement.Tenants',
      },
    },
        {
      path: 'Tenant',
      name: 'Tenant',
      component: () => import('/@/views/tenants/Tenant.vue'),
      meta: {
        title: t('routes.crm.clientInfo'),
        icon: 'ant-design:switcher-filled',
        policy: 'AbpTenantManagement.Tenants',
      },
    },
        {
      path: 'Tenant',
      name: 'Tenant',
      component: () => import('/@/views/tenants/Tenant.vue'),
      meta: {
        title: t('routes.crm.clientInfo'),
        icon: 'ant-design:switcher-filled',
        policy: 'AbpTenantManagement.Tenants',
      },
    },
  ],
};

export default tenant;

2. 菜单名字的本地化，t('routes.模块名字.变量名字') 来表示，

在vben28\src\locales\lang\zh-CN\routes\[模块名字].ts

export default {
  module: 'CRM企业版',
  clientInfo: '客户信息',
  name: '客户名称',
  code: '客户编号',
  industry: '所属行业',
  owner: '跟进人',
  contact: '客户联系人',
  contactTel: '客户联系电话',
  contactEmail: '客户邮件',
  project_name: '项目名称',
  project_progress: '进度',
  project_owner: '负责人',
  project_participant: '参与人',
  project_startDate: '开始日期',
  project_endDate: '结束日期',
  project_status: '项目状态',
};

3. 后端要对前端的菜单做权限控制，没有权限的就不能看到

角色权限在Application.Contracts\Permissions 目录定义CRMPermissionDefinitionProvider.cs,CRMPermission.cs

在Domain.Shared\Localization目录定义CRMREsource.cs, 新建CRM目录和zh-Hans.json文件

在Domain.Shared\ERPDomainSharedModule.cs 文件里的ConfigureServices方法里增加

            Configure<AbpExceptionLocalizationOptions>(options => { options.MapCodeNamespace(ERPDomainSharedConsts.NameSpace, typeof(ERPResource)); });
            
            Configure<AbpLocalizationOptions>(options =>
            {
                options.Resources
                    .Add<CRMResource>(ERPDomainSharedConsts.DefaultCultureName)
                    .AddVirtualJson("/Localization/CRM");

                options.DefaultResourceType = typeof(CRMResource);
            });

            Configure<AbpExceptionLocalizationOptions>(options => { options.MapCodeNamespace(ERPDomainSharedConsts.NameSpace, typeof(CRMResource)); });