Skip to content

Commit

Permalink
[fix][update] Fixed DetailsList selector bug, update DatePicker and T…
Browse files Browse the repository at this point in the history 
…imePicker styles.
  • Loading branch information
@aleversn
aleversn committed Jan 19, 2024
1 parent 6e4c4b7 commit 9582224
Show file tree
Hide file tree
Showing 11 changed files with 936 additions and 485 deletions.
57 changes: 22 additions & 35 deletions examples/docs/zh/DatePicker/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,6 @@

[[toc]]

<style>
.custom_style{
background-color: rgb(0, 204, 153);
border:1px solid rgb(0, 204, 153);
color:white;
}
.custom_style:hover{
border:1px solid rgb(0, 204, 153);
background-color: rgb(0, 204, 153,0.8);
}
</style>

<script>
export default {
data(){
Expand Down Expand Up @@ -102,11 +90,9 @@
<fv-DatePicker
v-model="date"
:showWeek="true"
class="custom_style"
hoverColor="rgba(0, 204, 153,0.7)"
innerBorderColor="rgb(0, 204, 153)"
:optionsStyle="{backgroundColor:'rgba(0, 204, 153,0.3)',color:'white',borderColor:'rgba(0, 204, 153,0.3)'}"
:selectStyle="{backgroundColor:'rgb(0, 204, 153)'}"
inputBackground="rgba(0, 90, 204, 0.6)"
innerBorderColor="rgb(0, 90, 153, 0.1)"
hoverColor="rgba(0, 204, 153, 0.1)"
>
</fv-DatePicker>
</ClientOnly>
Expand Down Expand Up @@ -139,25 +125,26 @@ innerBorderColor="rgb(0, 204, 153)"

### Propoties
---
| 属性(attr) | 类型(type) | 必填(required) | 默认值(default) | 说明(statement) |
|:-----------:|:----------------------------------:|:--------------:|:---------------:|:-----------------------:|
| v-model | [Date] | No | Date(1970,0,1) | 绑定的时间 |
| theme | ['system','dark','light','custom'] | No | 'system' | 主题色 |
| months | Array | No | ["January","February",...] | 月份显示数组 |
| weeks | Array | No | ["Sun.","Mon."...] | 星期显示输出 |
| hideYear | Boolean | No | false | 是否隐藏年份 |
| hideMonth | Boolean | No | false | 是否隐藏月份 |
| hideDay | Boolean | No | false | 是否隐藏天数 |
| showWeek | Boolean | No | false | 是否显示星期 |
| optionsStyle | Object | No | {} | 选项菜单样式 |
| selectStyle | Object | No | {} | 选项菜单中间选项蒙版样式 |
| disabled | Boolean | No | false | 是否禁用选项框 |
| hoverColor | String | No | undefined | 选项的Hover值 |
| 属性(attr) | 类型(type) | 必填(required) | 默认值(default) | 说明(statement) |
|:------------------:|:----------------------------------:|:--------------:|:--------------------------:|:----------------:|
| v-model | [Date] | No | Date(1970,0,1) | 绑定的时间 |
| theme | ['system','dark','light','custom'] | No | 'system' | 主题色 |
| months | Array | No | ["January","February",...] | 月份显示数组 |
| weeks | Array | No | ["Sun.","Mon."...] | 星期显示输出 |
| hideYear | Boolean | No | false | 是否隐藏年份 |
| hideMonth | Boolean | No | false | 是否隐藏月份 |
| hideDay | Boolean | No | false | 是否隐藏天数 |
| showWeek | Boolean | No | false | 是否显示星期 |
| inputBackground | String | No | N/A | 输入框背景色 |
| selectedBackground | String | No | N/A | 当前选中框背景色 |
| optionBackground | String | No | N/A | 选择器背景色 |
| disabled | Boolean | No | false | 是否禁用选项框 |
| hoverColor | String | No | undefined | 选项的Hover值 |

### Events
---
| 事件名(Name) | 参数类型(args) | 说明(statement) |
|:------------:|:--------------:|:---------------:|
| focus | | 触发焦点时触发 |
| change | | 当选中的时间发生变化时 |
| 事件名(Name) | 参数类型(args) | 说明(statement) |
|:------------:|:--------------:|:----------------------:|
| focus | | 触发焦点时触发 |
| change | | 当选中的时间发生变化时 |

42 changes: 15 additions & 27 deletions examples/docs/zh/TimePicker/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,6 @@

[[toc]]

<style>
.custom_style{
background-color: rgb(0, 204, 153);
border:1px solid rgb(0, 204, 153);
color:white;
}
.custom_style:hover{
border:1px solid rgb(0, 204, 153);
background-color: rgb(0, 204, 153,0.8);
}
</style>

<script>
export default {
data(){
Expand Down Expand Up @@ -86,10 +74,9 @@
<fv-TimePicker
v-model="date"
class="custom_style"
innerBorderColor="rgb(0, 204, 153)"
hoverColor="rgba(0, 204, 153,0.7)"
:optionsStyle="{backgroundColor:'rgba(0, 204, 153,0.3)',color:'white',borderColor:'rgba(0, 204, 153,0.3)'}"
:selectStyle="{backgroundColor:'rgb(0, 204, 153)'}"
inputBackground="rgba(0, 90, 204, 0.6)"
innerBorderColor="rgb(0, 90, 153, 0.1)"
hoverColor="rgba(0, 204, 153, 0.1)"
>
</fv-TimePicker>
</ClientOnly>
Expand All @@ -99,7 +86,7 @@ hoverColor="rgba(0, 204, 153,0.7)"
v-model="date"
class="custom_style"
innerBorderColor="rgb(0, 204, 153)"
hoverColor="rgba(0, 204, 153,0.7)"
hoverColor="rgba(0, 204, 153, 0.7)"
:optionsStyle="{backgroundColor:'rgba(0, 204, 153,0.3)',color:'white',borderColor:'rgba(0, 204, 153,0.3)'}"
:selectStyle="{backgroundColor:'rgb(0, 204, 153)'}"
>
Expand All @@ -112,16 +99,17 @@ hoverColor="rgba(0, 204, 153,0.7)"

### Propoties
---
| 属性(attr) | 类型(type) | 必填(required) | 默认值(default) | 说明(statement) |
|:------------:|:-------------------------------------:|:--------------:|:---------------:|:------------------------:|
| v-model | | No | Date() | 绑定的时间 |
| timeType | Number | No | 12 | 时间制（可选12，24） |
| period | Array | No | ['A.M.','P.M.'] | 上午下午显示 |
| optionsStyle | Object | No | {} | 选项菜单样式 |
| selectStyle | Object | No | {} | 选项菜单中间选项蒙版样式 |
| disabled | Boolean | No | false | 是否禁用选项框 |
| hoverColor | String | No | undefined | 选项的Hover值 |
| theme | ['light', 'dark', 'custom', 'system'] | No | system | Custom theme |
| 属性(attr) | 类型(type) | 必填(required) | 默认值(default) | 说明(statement) |
|:------------------:|:-------------------------------------:|:--------------:|:---------------:|:--------------------:|
| v-model | | No | Date() | 绑定的时间 |
| timeType | Number | No | 12 | 时间制（可选12，24） |
| period | Array | No | ['A.M.','P.M.'] | 上午下午显示 |
| inputBackground | String | No | N/A | 输入框背景色 |
| selectedBackground | String | No | N/A | 当前选中框背景色 |
| optionBackground | String | No | N/A | 选择器背景色 |
| disabled | Boolean | No | false | 是否禁用选项框 |
| hoverColor | String | No | undefined | 选项的Hover值 |
| theme | ['light', 'dark', 'custom', 'system'] | No | system | Custom theme |


### Events
Expand Down
Loading

0 comments on commit 9582224

Please sign in to comment.