Skip to content

Conversation

@Deardrops
Copy link
Owner

@Deardrops Deardrops commented Jul 4, 2017

close #90

组件

元素组件

  • 拓展Block组件,添加可选项显示卡片数量
  • 新增Box组件,对应MD的Card组件,显示桌面视图中的单张卡片(图片+卡名),带有显示详细信息的按钮,单击可以选中该卡片
  • 抽象出CardInfoTable组件,显示卡片详细信息的表格
  • 抽象出DeckHead组件,用于指示卡组的卡片数量,生命爆发数量和Mayu‘room
  • 抽象出Tips插件,用于显示tips

容器组件

  • 改写CellContainer组件,使用作用域插槽插入子组件,可选项长列表优化,根据窗口宽度自适应2列布局
  • 新增FlexboxContainer组件,用于容纳Box组件,可选项滚动到底部加载更多
  • 新增DeckSubheader组件,显示在Deck页面中,其中包含DeckHead组件

布局组件

  • 新增Sidebar组件,用于显示卡片大图和详细信息,点击一张卡片的详情按钮后出现
  • 新增ActionButtonBar组件,用于对当前选中的卡片进行某项操作,单击一张或多张卡片后出现

功能按钮

  • 卡组操作的相关功能
    • 按钮:新建卡组,删除卡组
    • 在卡组名称上直接修改:卡组改名
    • 下拉菜单:复制,导入导出

状态管理

  • 自适应布局相关的响应式数据,在开始时初始化数值,监听resize事件并更新数值
    • 新增windowWidth
    • 新增fontSize
  • 新增shownPid,表示DeckEditor的侧边栏中显示详细信息的卡片
    • shownPid === 0时,隐藏侧边栏,为合法值时弹出侧边栏
  • 新增selectedPids,表示DeckEdtior中当前选中的卡片
    • selectedPids为空时,隐藏ActionButtonBar,数组不为空时,弹出ActionButtonBar

图标

  • 新增图标:check,infomation,blub

TODO

  • 整理和记录新增的文本,用于本地化
  • 添加toast组件

@Deardrops Deardrops changed the title add desktop view for DeckEditor [WIP] add desktop view for DeckEditor Jul 27, 2017
rename `ListContainer` -> `CellConainer`
rename `Card` -> `Box`
store `fontSize` in store.js, change by window's resizing
add new localize string to `lang`
save search string in vue-router's query
rename FlexboxContainer -> BoxContainer
@Deardrops Deardrops changed the title [WIP] add desktop view for DeckEditor [Request Review] add desktop view for DeckEditor Aug 17, 2017
@Deardrops Deardrops changed the title [Request Review] add desktop view for DeckEditor [Abandon] add desktop view for DeckEditor Aug 19, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

DeckEditor | Desktop View

2 participants