This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

更新日期选择器

old
宇天 2019-07-29 17:01:47 +08:00
parent d017653ca1
commit 9228b3d2df
1 changed files with 61 additions and 2 deletions

View File

@ -1,17 +1,76 @@
<template>
<input type="text" />
<label class="input">
<input readonly type="text" />
<wc-icon class="icon" is="key"></wc-icon>
</label>
<div class="calendar">
<header>
<wc-icon is="key"></wc-icon>
<wc-icon is="key"></wc-icon>
<wc-icon is="key"></wc-icon>
<wc-icon is="key"></wc-icon>
<span>2019-07</span>
</header>
</div>
</template>
<style lang="scss">
:host {
display: inline-block;
user-select: none;
-moz-user-select: none;
color: nth($cd, 2);
border-radius: 4px;
}
.input {
display: flex;
justify-content: center;
align-items: center;
min-width: 64px;
height: 32px;
font-size: 14px;
border: 1px solid nth($cp, 3);
border-radius: inherit;
background: #fff;
color: inherit;
cursor: text;
input {
min-width: 0;
padding: 0 5px;
border: 0;
border-radius: inherit;
color: inherit;
font-size: inherit;
background: none;
outline: none;
box-shadow: none;
cursor: inherit;
&::placeholder {
color: nth($cgr, 1);
}
}
&:focus-within {
box-shadow: 0 0 3px nth($co, 1);
}
/* ----- */
.icon {
padding: 0 5px;
--size: 20px;
}
}
</style>
<script>
import '../icon/index'
export default class DatePicker {
props = {
value: ''
value: '',
format: 'Y-m-d'
}
constructor() {