项目文件功能分析

在dir-dest.txt项目描述文件的基础上对NiceFish项目每个文件模块的功能做一下简单的描述:

├─app
│  ├─animations     //这里定义了动画效果
│  │  ├─fade-in.ts    //定义淡入淡出动画模块

│  ├─chart          //图表组件,这里结合了echarts

│  ├─comment                         //这里是添加评论组件
│  │  ├─add-comment         //页面显示增加评论和显示评论列表功能
│  │  ├─model               //评论对象模型(类似java里的class)
│  │  └─services            //从服务器获取评论列表(这是个angular服务)

│  ├─home                                       //这是首页组件
│  │  ├─online-contact                //"QQ群-请勿加多个"这一模块
│  │  ├─social-channel                //"社交媒体"这一模块
│  │  ├─home.component.html           //首页视图文件
│  │  ├─home.component.scss           //首页样式文件
│  │  ├─home.component.ts             //首页组件逻辑
│  │  ├─home.module.ts           //首页模块定义,包含有online-contact ,social-channel,home.component.ts等组件
│  │  ├─home.routes.ts           //首页模块路由(定义左侧文章列表postlist模块的子路由地址)

│  ├─jsplumb-demo               //制作jsplumb流程图(jsPlumb是一个强大的JavaScript连线库,
                                //它可以将html中的元素用箭头、曲线、直线等连接起来,适用于开发Web上的图表、建模工具等)

│  ├─manage                     //这是管理员后台模块(包含以下很多组件)Console按钮点进去
│  │  ├─comment-table                 //评论管理组件包括评论列表和搜索评论(http://localhost:4200/user/commenttable/page/1)
│  │  ├─manage-main                   //Console右侧栏目,系统管理栏目组件
│  │  ├─post-table                    //Console左侧文章管理组件包括文章搜索和文章列表(http://localhost:4200/manage/posttable/page/1)
│  │  │  └─services                         //文章管理的各种服务包括获取列表,删除文章,编辑文章
│  │  ├─sys-param                     //系统设置组件包括文章,评论,用户名密码等参数设置
│  │  └─user-table                    //用户管理组件包括用户搜索,用户列表

│  ├─post                       //地图模块

│  ├─post                                       //这是跟文章有关的组件,文章模块包括文章详情和列表以及创建新的文章
│  │  ├─model                    //定义文章对象(类似java文章class类)
│  │  ├─post-detail              //文章详情查看组件http://localhost:4200/posts/postdetail/1
│  │  │  └─services                   //向服务器获取文章详情服务
│  │  ├─post-detail-main         //文章主视图里面包括文章详情视图,登录视图,评论列表视图,作者信息视图,这里写成了一个组件
│  │  ├─postlist                 //文章列表组件包括搜索文章,发表文章
│  │  │  └─services                   //getPostList方法获取文章列表服务
│  │  └─write-post               //这是写文章组件,需要参考TinyMCE编辑器和ng2集成的请看这里

│  ├─shared                      //包含国际化功能模块,用户登录注册等功能的表单组件

│  ├─sitestat                    //网站记录汇总以及时间显示组件

│  ├─user                                       //这里是与用户相关的组件构成的模块
│  │  ├─forget-pwd                    //找回密码组件
│  │  ├─model                         //用户对象模型(类似java的user class)
│  │  ├─user-info                     //用户头像,昵称,文章数,评论数等信息展示和关注组件(@Input和@Output的用法请参考这个目录)
│  │  ├─user-login                    //用户登录组件(模板驱动型表单请参考这个目录)这个组件在其他地方也有用到所以关联
│  │  ├─user-main                     //用户详情主界面,左边是文章列表,右边是用户基本信息
│  │  ├─user-profile                  //用户基本信息设置组件(动态表单请参考这个目录)http://localhost:4200/user/profile
│  │  │  ├─dyn-form                   //<form-control/>组件根据配置信息编译成指定的input类型
│  │  │      └─field
│  │  │  └─user.profile.component     //里面form的input是用ng-for动态生成的子组件是<form-control/>
│  │  └─user-register                 //用户注册组件(响应式表单请参考这个目录)
│  │      └─directives                //密码两次输入是否相同的指令
│  └─utils

├─assets                                            //这个目录里面是一些CSS、字体图标、图片等
│  ├─bootstrap-v3.3.7
│  ├─css
│  ├─fonts
│  │  ├─bootstrap
│  │  ├─icomoon
│  │  │  └─icomoon
│  │  │      ├─demo-files
│  │  │      └─fonts
│  │  └─simple-line-icons
│  ├─i18n                           //详情用法见ng-translate
│  ├─imgs
│  └─skins
│      └─lightgray
│          ├─fonts
│          └─img
├─documentation
├─environments          //项目运行环境配置文件
└─mock-data                         //测试数据全部放在这个目录里面,【注意】这个目录需要你手动拷贝到Tomcat去

 

posted @ 2017-09-13 16:02  潇洒-zhutao  阅读(314)  评论(0编辑  收藏  举报