docs: 编写 date-picker 文档

This commit is contained in:
就眠儀式 2022-04-02 03:43:12 +08:00
parent c7bbe6d458
commit f28e3cbcbf
4 changed files with 42 additions and 14 deletions

View File

@ -138,5 +138,17 @@ export default {
:::
::: title Date Picker 属性
:::
::: table
| 属性 | 描述 | 类型 | 默认值 | 可选值 |
| ------------- | ------------------------------------------------------------ | -------------- | ------ | -------------- |
| v-model | 当前时间 | `string` | -- | — |
| type | 选择类型 | `string` | `date` | `date` `datetime` `year` `month` `time` |
:::
::: previousNext transfer
:::

View File

@ -10,19 +10,19 @@
::: demo
<template>
<lay-timeline>
<lay-timeline-item title="0.4.0">
<lay-timeline-item title="1.0.x">
<ul>
<a name="0-4-5"> </a>
<a name="1-0-0"> </a>
<li>
<h3>0.4.5 <span class="layui-badge-rim">2022-04-01</span></h3>
<h3>1.0.0 <span class="layui-badge-rim">2022-04-01</span></h3>
<ul>
<li>[新增] switch 组件 onswitch-value 属性。</li>
<li>[新增] switch 组件 unswitch-value 属性。</li>
<li>[新增] date-picker 组件 time 属性, 支持时分秒选择。</li>
<li>[新增] tab 组件 position 属性, 不同方向的选项卡标题。</li>
<li>[新增] switch 组件 onswitch-value 属性, 默认为 true</li>
<li>[新增] switch 组件 unswitch-value 属性, 默认为 false</li>
<li>[新增] date-picker 组件 time 属性, 支持 选择。</li>
<li>[新增] tab 组件 position 属性, 用于支持不同方向的选项卡标题。</li>
<li>[新增] button 组件 border-style 属性, 可选值 dashed dotted 等。</li>
<li>[修复] transfer 组件 showSearch 属性类型警告。</li>
<li>[修复] date-picker 默认 12 小时制为 24 小时制。</li>
<li>[修复] transfer 组件 showSearch 属性类型警告。</li>
<li>[修复] upload 组件 number 属性必填警告。</li>
<li>[修复] variable 全局变量重复导入的问题。</li>
<li>[修复] menu 组件 openKeys 属性失效。</li>
@ -32,6 +32,8 @@
</ul>
</li>
</ul>
</lay-timeline-item>
<lay-timeline-item title="0.4.x">
<ul>
<a name="0-4-4"> </a>
<li>

View File

@ -1,6 +1,6 @@
{
"name": "@layui/layui-vue",
"version": "0.4.5-alpha.8",
"version": "1.0.0-alpha.2",
"author": "就眠儀式",
"license": "MIT",
"description": "a component library for Vue 3 base on layui-vue",

View File

@ -229,7 +229,10 @@
</div>
</div>
<div class="layui-laydate-footer">
<span @click="showPane = 'date'" v-if="type!='time'" class="laydate-btns-time"
<span
@click="showPane = 'date'"
v-if="type != 'time'"
class="laydate-btns-time"
>返回日期</span
>
<div class="laydate-footer-btns">
@ -249,7 +252,15 @@
</template>
<script lang="ts" setup>
import { computed, nextTick, ref, watch, defineProps, defineEmits, onMounted } from "vue";
import {
computed,
nextTick,
ref,
watch,
defineProps,
defineEmits,
onMounted,
} from "vue";
import moment from "moment";
import LayIcon from "../icon/index";
@ -317,7 +328,10 @@ const dateValue = computed<string>(() => {
return "";
}
let momentVal;
let momentObj = moment(currentDay.value).hour(hms.value.hh).minute(hms.value.mm).second(hms.value.ss);
let momentObj = moment(currentDay.value)
.hour(hms.value.hh)
.minute(hms.value.mm)
.second(hms.value.ss);
switch (props.type) {
case "date":
momentVal = momentObj.format("YYYY-MM-DD");
@ -475,5 +489,5 @@ onMounted(() => {
hms.value.hh = moment(currentDay.value).hour();
hms.value.mm = moment(currentDay.value).minute();
hms.value.ss = moment(currentDay.value).second();
})
</script>
});
</script>