Service Proxies

使用

通过如下命令生成 service 文件

  1. # 在 angular 根目录生成
  2. abp generate-proxy

在 abp 后端能够正常访问的情况下，该命令能够遍历后端接口定义，自动生成 service，并且对应的 enum 和 model 也包含。

现在看来目录结构还是有点混乱，在考虑是否要整理；不过如果整理，接口有变化，然后再次生成时，应该就乱了吧。

参考

1、结合 storybook，https://medium.com/angular-in-depth/how-to-build-a-component-library-with-angular-and-storybook-718278ab976
2、华为团队实践 https://segmentfault.com/a/1190000022637243
3、use lib 方式 https://segmentfault.com/a/1190000024510539
4、ng-alain https://github.com/ng-alain/ng-alain/blob/master/src/app/layout/layout.module.ts

abp/zorro/ng-alain 结合逻辑

1、方式一，abp+zorro+ng-alain，doing 改动量大
2、方式二、zorro+ng-alain+abp，待尝试。
https://getbootstrap.com/docs/5.0/migration/

abp-angular，如果加页面，需要做些处理；
只能以在最外层的router-module中增加 子 module 的形式。

调整内容

1、通用 layout，左右布局。( zorro )
https://github.com/abpframework/abp/blob/4.4.4/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html

2、zorro 升级，4.4.4
（https://github.com/abpframework/abp/blob/4.4.4/templates/app/angular/package.json）

4、非400，异常弹窗，bootstrap 处理
https://github.com/abpframework/abp/blob/4.4.4/npm/ng-packs/packages/theme-shared/src/lib/handlers/error.handler.ts

5、guard 相关
https://github.com/abpframework/abp/tree/4.4.4/npm/ng-packs/packages/core/src/lib/guards

其他调整
1、接口请求代理。abp 或 angular — 后端配一下
2、跳转登录的判断。暂存路径。加中间页，跳转中。home+guard
3、登录页，放在后端改。

abp-ng-Zorro

repo（https://github.com/yixiangling/abp-ng-Zorro）

项目问题说明文档（https://github.com/yixiangling/abp-ng-Zorro/wiki/%E7%BE%A4%E5%86%85%E9%97%AE%E9%A2%98-%E5%9B%9E%E7%AD%94%E6%95%B4%E7%90%86）

类似项目：
abp-ng-zorro（https://github.com/rqx110/abp-ng-zorro）
名字差个字母……

主题覆盖

1、安装 abp 工具
https://docs.abp.io/en/abp/4.4/CLI

2、获取默认的主题文件

  1. abp add-package @abp/ng.theme.basic --with-source-code

https://docs.abp.io/en/abp/latest/UI/Angular/Theming#the-easy-way

3、AuthConfig 中的url地址
https://devazhospital-auth.innocellence.com
apis api地址
https://mytest.zhanghc188.work/

参考

自定义布局，解决方案
https://stackoverflow.com/questions/66041937/how-to-use-custom-header-and-different-layout-guards-and-custom-login-in-abp

UI包，原有的内容调整
https://docs.abp.io/en/abp/latest/UI/Angular/How-Replaceable-Components-Work-with-Extensions

自己实现一遍 abp ui 包的示例工程
https://github.com/abpframework/abp-samples/tree/master/CustomAngularAppWithIdentityServer

ABP FRAMEWORK docouments 文档阅读

http请求处理

https://docs.abp.io/en/abp/latest/UI/Angular/HTTP-Requests
较 Angular 的 httpClient 好处：中心化的异常处理。
如下为使用方式：

  1. import { RestService } from '@abp/ng.core';

如何自定义登录页

https://community.abp.io/articles/how-to-customize-the-login-page-for-mvc-razor-page-applications-9a40f3cd
在 .net core 项目中，进行自定义；

权限部分的处理

https://docs.abp.io/en/abp/latest/UI/Angular/Authorization
主要由 angular-oath2-oidc（https://github.com/manfredsteyer/angular-oauth2-oidc#logging-in） 这个库来处理

Environment 文件说明

https://docs.abp.io/en/abp/latest/UI/Angular/Environment
介绍了每个字段的含义