# 全局组件
本项目中自定义的全局组件,其中文件夹以 M
开头的,是对 element-ui
一些组件的二次封装,以在使用上更加便捷。
# 组件说明
本项目主要的组件,会在组件文件中添加注释,如 m-pagintion
组件
/**
* m-pagination
* @module components/MPagination
* @desc element-ui el-pagination 二次封装 传入pagination对象,接收方不需要再设置页码值
* @param {string} [layout] - 同 element-ui
* @param {object} pagination - 分页对象,支持 .sync 修饰符
* @param {number} pagination.per_page - 每页显示条目个数
* @param {number} pagination.page - 当前页数
* @param {number} pagination.total - 总条目数
* @param {array} [sizes] - 每页显示个数选择器的选项设置
*
* @example
* <m-pagination :pagination.sync="pagination" @on-change="getData()" />
*/
# 目录结构
└─ src
└─ components
├─ Bar #
│ ├─ HeaderBar.vue # 头部导航栏
│ ├─ LeftBar.vue # 左侧菜单栏
│ ├─ MiddleBar.vue # 左侧菜单详情菜单栏
│ └─ components # 组件
├─ Card # 数据/图表统计卡片
├─ Comment # 评论页及其组件
├─ DeleteModal # 资源删除原因
├─ FormItemSwitch #
├─ HistoryModal # 历史变更记录
├─ ImageUpload # 单个图片上传
├─ Layout # 基础框架
│ ├─ TabLayout # 资源详情tab框架
│ └─ ContainerLayout # 资源列表框架
├─ MButton # 按钮
├─ MInputNumber # 计数器
├─ MPagination # 分页
├─ MTable # 表格
├─ MTagGroup # 添加标签
├─ Photo # 相册页及其组件
│ ├─ Page # 相册管理页面
│ ├─ PhotoStatusModal.vue # 照片状态设置
│ └─ UploadModal.vue # 图片批量批量上传
├─ PhotoUpload # 图片批量上传
├─ PhotoWall # 图片墙,用户选择封面
├─ Plug # 三方插件封装
│ ├─ Editor.vue # wangEditor 富文本编辑器封装
│ └─ MixSearch.vue # 富文本外挂资源搜索插件
├─ Popover # 资源信息弹出框
│ ├─ ActorPopover # 影人信息
│ ├─ MoviePopover # 影视信息
│ ├─ RolePopover # 角色信息
│ └─ UserPopover # 用户信息
├─ Review
│ └─ ReviewDrawer # 影评详情
├─ Select
│ ├─ MSelect # el-select 二次封装,简化传参
│ └─ RemoteSelect # 资源远程搜索
├─ StatusModal # 资源状态管理
└─ Video
├─ VideoPlayer # 播放器
├─ VideoPreview # 视频预览
└─ StatusModal.vue # 视频状态设置