Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[comp: Rate] add Rate component #34

Closed
1 task done
CocaColf opened this issue Dec 18, 2020 · 7 comments · Fixed by #152
Closed
1 task done

[comp: Rate] add Rate component #34

CocaColf opened this issue Dec 18, 2020 · 7 comments · Fixed by #152
Assignees
Labels
enhancement New feature or request
Milestone

Comments

@CocaColf
Copy link
Contributor

CocaColf commented Dec 18, 2020

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

  • 支持鼠标悬浮和点击图标时,图标高亮,可以自定义高亮和未选状态的颜色
  • 支持图标数目
  • 支持半分(选)
  • 支持只读状态
  • 图标支持自定义字符或icon,一般来说是是使用某个文字或者某个iconfont
  • 可捕获图标被hover时的事件,实现譬如鼠标悬浮到不同分数时,某个位置显示一些状态文字
  • 可捕获分数change时的事件

What does the proposed API look like?

props

参数 说明 默认值 类型 备注
value 高亮的数目 0 number -
strokeColor 高亮颜色 待定 string -
backgroundColor 未被选择时的颜色 待定 string -
count 图标数目 5 number -
icon 自定义图标 string props 或 slot
allowHalf 支持半分(选) false boolean -
disabled 只读模式 false boolean -
tooltips 每一个元素的提示信息 [] string[] -
allowClear 是否可以取消选择 false boolean -

event

参数 说明 类型
hover 鼠标经过图标时触发 Function(value: number)
change 分数发生改变时触发 Function(value: number)
@CocaColf CocaColf added the enhancement New feature or request label Dec 18, 2020
@danranVm danranVm mentioned this issue Dec 18, 2020
95 tasks
@danranVm
Copy link
Member

表单组件下周我会出一个统一的设计方案,到时候需要一起沟通下。

@danranVm
Copy link
Member

@coolyuantao @danranVm 负责此组件的 review, API 设计完成后请 @ 他们

@CocaColf
Copy link
Contributor Author

@coolyuantao @danranVm 负责此组件的 review, API 设计完成后请 @ 他们

I got it.

@CocaColf
Copy link
Contributor Author

@danranVm @coolyuantao API review please.

@coolyuantao
Copy link
Member

  1. allowClear 该配置也保留吧, 这样才可以实现选择 0 这样的操作,建议参考antd的,默认值为true
  2. showHalf 希望在实现的时候可以支持任意小数,鼠标操作可以只实现半边功能,但是如果是设置value可以实现类似1.1这样的比例
  3. highlightColor -> strokeColor ,并与 progress组件:[comp: progress] add Progress component  #35 保持一致
  4. voidColor -> backgroundColor
  5. tooltips 建议保留
  6. 另外readonlydisable这样表单相关配置 @danranVm 统一下就可以

@danranVm
Copy link
Member

danranVm commented Dec 24, 2020

有几点建议:

  • value 支持 v-model
  • highlightColor 和 voidColor 移除,可以通过 less 变量提供出去,不需要使用这种方式吧。
  • readonly 更改为 disabled ,因为更符合 form 组件的统一用法
  • tooltips 建议保留
  • allowClear 建议保留
  • count, icon, allowHalf,allowClear 可以提供全局配置,参见useGlobalConfig

@danranVm
Copy link
Member

@coolyuantao highlightColor 和 voidColor 是否提供 less 变量即可,不需要提供 props 吧

@danranVm danranVm added this to the v1.0.0 milestone Dec 25, 2020
CocaColf added a commit to CocaColf/components that referenced this issue Jan 19, 2021
CocaColf added a commit to CocaColf/components that referenced this issue Jan 20, 2021
CocaColf added a commit to CocaColf/components that referenced this issue Jan 20, 2021
CocaColf added a commit to CocaColf/components that referenced this issue Jan 21, 2021
CocaColf added a commit to CocaColf/components that referenced this issue Jan 21, 2021
CocaColf added a commit to CocaColf/components that referenced this issue Jan 21, 2021
danranVm pushed a commit that referenced this issue Jan 21, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants