10 changed files with 472 additions and 325 deletions
@ -1,119 +1,152 @@ |
|||||
<template> |
<template> |
||||
<view class="form-item"> |
<view class="form-item"> |
||||
<!-- 左侧标签 + 必填提示 --> |
<!-- 左侧标签 + 必填提示 --> |
||||
<view class="label"> |
<view class="label"> |
||||
<!-- <text v-if="required" class="required">*</text> --> |
<text class="PfScMedium">{{ label }}</text> |
||||
<text>{{ label }}</text> |
<image v-if="required" class="required" :src="cssUrl + 'required.svg'" /> |
||||
<image v-if="required" class="required" :src="cssUrl + 'required.svg'" /> |
</view> |
||||
</view> |
|
||||
|
|
||||
<!-- 输入模式 --> |
|
||||
<input |
|
||||
v-if="type === 'input'" |
|
||||
class="input" |
|
||||
:placeholder="placeholder" |
|
||||
:value="value" |
|
||||
@input="handleInput" |
|
||||
:disabled="disabled" |
|
||||
/> |
|
||||
|
|
||||
<!-- 点击选择模式（如性别、年份） --> |
<!-- 输入模式 --> |
||||
<view |
<input |
||||
v-else |
v-if="type === 'input'" |
||||
class="picker" |
class="input" |
||||
@click="handleClick" |
:placeholder="placeholder" |
||||
> |
:placeholder-class="!value ? placeholderClass : '' " |
||||
<text :class="{ 'placeholder': !value }"> |
:value="value" |
||||
{{ displayValue || placeholder }} |
@input="handleInput" |
||||
</text> |
:disabled="disabled" |
||||
<image class="right_img" :src="cssUrl + 'input_ex.png'" /> |
/> |
||||
|
|
||||
<!-- <uni-icons type="arrowright" size="14" color="#999" /> --> |
<!-- 点击选择模式（如性别、年份） --> |
||||
</view> |
<view |
||||
|
v-else |
||||
|
class="picker" |
||||
|
@click="handleClick" |
||||
|
> |
||||
|
<text :class="((placeholderClass && !displayValue) ? placeholderClass : ((!displayValue ? 'placeholder ':'')))"> |
||||
|
{{ displayValue || placeholder }} |
||||
|
</text> |
||||
|
<image class="right_img" :src="cssUrl + '/input_ex.png'" /> |
||||
</view> |
</view> |
||||
</template> |
</view> |
||||
|
</template> |
||||
|
|
||||
<script> |
<script> |
||||
export default { |
export default { |
||||
name: 'FormItem', |
name: 'FormItem', |
||||
props: { |
props: { |
||||
label: String, // 左侧标签文本（如"姓名"） |
label: String, // 左侧标签文本（如"姓名"） |
||||
type: { // 类型：input（输入）或 picker（点击选择） |
type: { // 类型：input（输入）或 picker（点击选择） |
||||
type: String, |
type: String, |
||||
default: 'input', |
default: 'input', |
||||
validator: (val) => ['input', 'picker'].includes(val), |
validator: (val) => ['input', 'picker'].includes(val), |
||||
}, |
|
||||
value: [String, Number], // 绑定的值 |
|
||||
placeholder: String, // 占位文本 |
|
||||
required: Boolean, // 是否必填 |
|
||||
disabled: Boolean, // 是否禁用 |
|
||||
displayValue: String, // 显示的值（用于picker模式，如性别显示"男/女"） |
|
||||
}, |
}, |
||||
data(){ |
placeholderClass: { |
||||
return{ |
type: String, |
||||
cssUrl: this.cssUrl, |
default: 'formItemPlaceholderStyle' |
||||
} |
|
||||
}, |
}, |
||||
methods: { |
value:{ |
||||
handleInput(e) { |
type: [String, Number, Boolean], |
||||
this.$emit('input', e.detail.value); |
default: false |
||||
}, |
},// 绑定的值 |
||||
handleClick() { |
placeholder: String, // 占位文本 |
||||
if (!this.disabled) { |
required: Boolean, // 是否必填 |
||||
this.$emit('click'); // 触发父组件的选择逻辑 |
disabled: Boolean, // 是否禁用 |
||||
} |
displayValue: { |
||||
}, |
type: String, |
||||
|
default: '' |
||||
|
}, // 显示的值（用于picker模式，如性别显示"男/女"） |
||||
|
|
||||
|
}, |
||||
|
data(){ |
||||
|
return{ |
||||
|
cssUrl: this.cssUrl, |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
handleInput(e) { |
||||
|
this.$emit('input', e.detail.value); |
||||
}, |
}, |
||||
}; |
handleClick() { |
||||
</script> |
if (!this.disabled) { |
||||
|
this.$emit('click'); // 触发父组件的选择逻辑 |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.form-item { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
padding: 36rpx 0rpx; |
||||
|
border-bottom: 1rpx solid #eee; |
||||
|
min-height: 44rpx; |
||||
|
} |
||||
|
.right_img{ |
||||
|
width: 26rpx; |
||||
|
height: 26rpx; |
||||
|
} |
||||
|
|
||||
<style scoped> |
.label { |
||||
.form-item { |
display: flex; |
||||
display: flex; |
align-items: center; |
||||
justify-content: space-between; |
font-size: 32rpx; |
||||
align-items: center; |
font-weight: 500; |
||||
padding: 36rpx 24rpx; |
line-height: 44rpx; |
||||
border-bottom: 1rpx solid #eee; |
letter-spacing: 2rpx; |
||||
} |
color: #222222; |
||||
.right_img{ |
} |
||||
width: 26rpx; |
|
||||
height: 26rpx; |
|
||||
} |
|
||||
|
|
||||
.label { |
.required { |
||||
display: flex; |
margin-left: 8rpx; |
||||
align-items: center; |
color: #f56c6c; |
||||
font-family: PingFang SC; |
font-size: 12px; |
||||
font-size: 32rpx; |
width: 16rpx; |
||||
font-weight: 500; |
height: 16rpx; |
||||
line-height: 44rpx; |
} |
||||
letter-spacing: 2rpx; |
.input{ |
||||
color: #222222; |
height: 44rpx; |
||||
} |
flex-grow: 1; |
||||
|
font-size: 32rpx; |
||||
|
flex: 1; |
||||
|
padding-left: 20rpx; |
||||
|
color: #000000; |
||||
|
display: flex; |
||||
|
justify-content: flex-end; |
||||
|
align-items: center; |
||||
|
flex-grow: 1; |
||||
|
text-align: right; |
||||
|
} |
||||
|
|
||||
.required { |
.picker { |
||||
margin-left: 8rpx; |
flex: 1; |
||||
color: #f56c6c; |
padding-left: 20rpx; |
||||
font-size: 12px; |
color: #000000; |
||||
width: 16rpx; |
display: flex; |
||||
height: 16rpx; |
justify-content: flex-end; |
||||
} |
align-items: center; |
||||
|
} |
||||
|
|
||||
.input, |
.picker text{ |
||||
.picker { |
font-size: 32rpx; |
||||
flex: 1; |
line-height: 32rpx; |
||||
text-align: right; |
} |
||||
padding-left: 20rpx; |
|
||||
color: #333; |
|
||||
} |
|
||||
|
|
||||
.placeholder { |
.placeholder { |
||||
font-family: PingFang SC; |
font-family: PingFang SC; |
||||
font-size: 32rpx; |
font-size: 32rpx; |
||||
font-weight: normal; |
font-weight: normal; |
||||
line-height: 44rpx; |
line-height: 44rpx; |
||||
text-align: right; |
text-align: right; |
||||
letter-spacing: 0.24rpx; |
letter-spacing: 0.24rpx; |
||||
color: #999999; |
color: #000; |
||||
} |
} |
||||
</style> |
/deep/ .formItemPlaceholderStyle { |
||||
|
font-size: 32rpx; |
||||
|
color: #999999; |
||||
|
line-height: 44rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -1,170 +0,0 @@ |
|||||
<template> |
|
||||
<uni-popup ref="selectDate" :safe-area="false"> |
|
||||
<view class="popup-container"> |
|
||||
<view class="header"> |
|
||||
<view class="title PfScMedium">出生年份</view> |
|
||||
<image class="close-icon" @tap="closePop" :src="cssUrl + 'close.svg'" /> |
|
||||
</view> |
|
||||
<view class="date">请选择阳历出生年份</view> |
|
||||
|
|
||||
<view class="yearPicker date-wraper"> |
|
||||
<picker-view :value="value" @change="handleYearChange" class="picker-view"> |
|
||||
<picker-view-column class="picker-column"> |
|
||||
<view class="item" v-for="(item, index) in years" :key="index">{{ item }}</view> |
|
||||
</picker-view-column> |
|
||||
</picker-view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="confirm-button-wrapper btPadding"> |
|
||||
<view class="confirm-button PfScMedium" @click="comfirmYear"> |
|
||||
确认 |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</uni-popup> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
data() { |
|
||||
const date = new Date() |
|
||||
const years = [] |
|
||||
const year = date.getFullYear() |
|
||||
for (let i = 1900; i <= year; i++) { |
|
||||
years.push(i) |
|
||||
} |
|
||||
var currentYear = year - 10 |
|
||||
var value = [years.indexOf(currentYear)] |
|
||||
return { |
|
||||
value, |
|
||||
currentYear, |
|
||||
cssUrl:this.cssUrl, |
|
||||
years: years, |
|
||||
}; |
|
||||
}, |
|
||||
methods: { |
|
||||
handleYearChange(e) { |
|
||||
this.currentYear = this.years[e.detail.value]; |
|
||||
}, |
|
||||
comfirmYear(){ |
|
||||
this.$emit('change', this.currentYear) |
|
||||
this.closePop() |
|
||||
}, |
|
||||
show(){ |
|
||||
this.$refs.selectDate.open('bottom') |
|
||||
}, |
|
||||
closePop() { |
|
||||
this.$refs.selectDate.close() |
|
||||
}, |
|
||||
}, |
|
||||
}; |
|
||||
</script> |
|
||||
<style lang="scss" scoped> |
|
||||
.yearPicker { |
|
||||
height: 470rpx; |
|
||||
background: #F7F7F7; |
|
||||
.picker-view { |
|
||||
height: 420rpx; |
|
||||
margin: 0 auto; |
|
||||
padding: 0 35rpx; |
|
||||
background: #F7F7F7; |
|
||||
|
|
||||
} |
|
||||
.item { |
|
||||
line-height: 70rpx; |
|
||||
font-size: 28rpx; |
|
||||
font-weight: 600; |
|
||||
text-align: center; |
|
||||
} |
|
||||
} |
|
||||
.popup-container { |
|
||||
position: relative; |
|
||||
max-height: calc(100vh - 200rpx); |
|
||||
overflow-y: scroll; |
|
||||
background: #ffffff; |
|
||||
border-radius: 40rpx 40rpx 0px 0px; |
|
||||
padding: 42rpx 54rpx 16rpx; |
|
||||
|
|
||||
.header { |
|
||||
position: relative; |
|
||||
text-align: center; |
|
||||
|
|
||||
.title { |
|
||||
font-weight: 500; |
|
||||
font-size: 32rpx; |
|
||||
color: #000000; |
|
||||
line-height: 36rpx; |
|
||||
} |
|
||||
|
|
||||
.close-icon { |
|
||||
width: 40rpx; |
|
||||
height: 40rpx; |
|
||||
position: absolute; |
|
||||
right: 0; |
|
||||
bottom: 0; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.content-container { |
|
||||
padding: 24rpx 0rpx 68rpx; |
|
||||
font-family: PingFang SC; |
|
||||
|
|
||||
.content-item { |
|
||||
background: #FAFAFA; |
|
||||
|
|
||||
&:first-child { |
|
||||
border-top: none; |
|
||||
padding: 25rpx 24rpx; |
|
||||
} |
|
||||
|
|
||||
padding: 19rpx 24rpx; |
|
||||
border-top: 2rpx solid #F0F0F0; |
|
||||
|
|
||||
span {} |
|
||||
|
|
||||
.bold { |
|
||||
font-weight: 500; |
|
||||
font-size: 30rpx; |
|
||||
color: #000000; |
|
||||
} |
|
||||
|
|
||||
.top { |
|
||||
margin-top: 12rpx; |
|
||||
margin-bottom: 12rpx; |
|
||||
|
|
||||
} |
|
||||
|
|
||||
.special { |
|
||||
color: #949699; |
|
||||
letter-spacing: 2rpx; |
|
||||
font-size: 30rpx; |
|
||||
|
|
||||
.time { |
|
||||
margin: 0 6rpx; |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
.confirm-button { |
|
||||
font-weight: 500; |
|
||||
font-size: 32rpx; |
|
||||
color: #ffffff; |
|
||||
margin-top: 46rpx; |
|
||||
line-height: 92rpx; |
|
||||
text-align: center; |
|
||||
width: 100%; |
|
||||
height: 92rpx; |
|
||||
background: #39d067; |
|
||||
border-radius: 16rpx; |
|
||||
} |
|
||||
|
|
||||
.date { |
|
||||
margin: 12rpx 36rpx 42rpx; |
|
||||
text-align: center; |
|
||||
color: #000000; |
|
||||
font-size: 26rpx; |
|
||||
font-family: PingFang SC; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -0,0 +1,293 @@ |
|||||
|
<template> |
||||
|
<view class="datePicker"> |
||||
|
<uni-popup ref="updateTreatment" :safe-area="false"> |
||||
|
<view class="popup-container"> |
||||
|
<view class="header"> |
||||
|
<view class="title PfScMedium">出生年份</view> |
||||
|
</view> |
||||
|
<view class="desc">请选择阳历出生年份</view> |
||||
|
|
||||
|
<view class="content-container"> |
||||
|
|
||||
|
<view class="datepicker-wrapper"> |
||||
|
<picker-view mask-class="datepicker-mask-class" :indicatorStyle="indicatorStyle" indicator-class="datepicker-custom-indicator" :value="dateValue" @change="onDateChange" @pickstart="pickstart" @pickend="pickend" class="datepicker-picker-view" v-if="visible"> |
||||
|
<picker-view-column v-show="showPickerColumn(0)"> |
||||
|
<view :class="getItemClass(0, index)+'item ft24'" v-for="(item, index) in years" :key="index">{{item}}</view> |
||||
|
</picker-view-column> |
||||
|
|
||||
|
<picker-view-column v-show="showPickerColumn(1)"> |
||||
|
<view :class="getItemClass(1, index)+'item ft24'" v-for="(item, index) in months" :key="index">{{item.toString().length==1?('0'+item):item}}</view> |
||||
|
</picker-view-column> |
||||
|
|
||||
|
<picker-view-column v-show="showPickerColumn(2)"> |
||||
|
<view :class="getItemClass(2, index)+'item ft24'" v-for="(item, index) in days" :key="index">{{item.toString().length==1?('0'+item):item}}</view> |
||||
|
</picker-view-column> |
||||
|
</picker-view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<view class="close-up-btn" @click="closePop"> |
||||
|
<img :src="((cssUrl+'pop_close_ic.svg').replace('/user/', '/'))" alt="" /> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view class="confirm-button-wrapper btPadding"> |
||||
|
<view class="confirm-button PfScMedium" @click="onUpdateTreatmentConfirmButtonClick"> |
||||
|
确认 |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</uni-popup> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name:'datePicker', |
||||
|
data() { |
||||
|
const date = new Date() |
||||
|
const years = [] |
||||
|
var year = date.getFullYear() |
||||
|
const months = [] |
||||
|
var month = date.getMonth() + 1 |
||||
|
const days = [] |
||||
|
var day = date.getDate() |
||||
|
for (let i = date.getFullYear()-100; i <= date.getFullYear(); i++) { |
||||
|
years.push(i) |
||||
|
} |
||||
|
for (let i = 1; i <= 12; i++) { |
||||
|
months.push(i) |
||||
|
} |
||||
|
for (let i = 1; i <= 31; i++) { |
||||
|
days.push(i) |
||||
|
} |
||||
|
|
||||
|
month = 1; |
||||
|
day = 1; |
||||
|
year = year - 10 |
||||
|
var datestr = year+'/'+(month.toString().length==1?('0'+month):month)+'/'+(day.toString().length==1?('0'+day):day) |
||||
|
|
||||
|
var dateValue = [years.indexOf(year), months.indexOf(month), days.indexOf(day)]; |
||||
|
return { |
||||
|
title: "datepicker-picker-view", |
||||
|
years, |
||||
|
year, |
||||
|
months, |
||||
|
month, |
||||
|
days, |
||||
|
day, |
||||
|
cssUrl:this.cssUrl, |
||||
|
dateValue, |
||||
|
date:datestr, |
||||
|
treatmentDateString:'', |
||||
|
indicatorStyle: 'height: '+uni.upx2px(68)+'px;', |
||||
|
visible: true, |
||||
|
timetimer:null, |
||||
|
dateChangeFlag:true |
||||
|
} |
||||
|
}, |
||||
|
props: { |
||||
|
defaultDate:{ |
||||
|
type:String, |
||||
|
default:'' |
||||
|
}, |
||||
|
format:{ |
||||
|
type:String, |
||||
|
default:'yyyy' |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
}, |
||||
|
methods: { |
||||
|
showPickerColumn(columnIndex) { |
||||
|
if (columnIndex === 0 && this.format.indexOf('yyyy') !== -1) return true |
||||
|
if (columnIndex === 1 && this.format.indexOf('mm')!== -1) return true |
||||
|
if (columnIndex === 2 && this.format.indexOf('dd')!== -1) return true |
||||
|
return false |
||||
|
}, |
||||
|
getItemClass(columnIndex, index) { |
||||
|
var curindex = this.dateValue[columnIndex] |
||||
|
if(index == curindex) return 'selected PfScMedium '; |
||||
|
var abs = Math.abs(index-curindex) |
||||
|
if(abs <= 3) return 'style'+abs+' '; |
||||
|
return ''; |
||||
|
}, |
||||
|
open(direction){ |
||||
|
this.visible = false; |
||||
|
this.$nextTick(() => { |
||||
|
this.visible = true; |
||||
|
this.$refs.updateTreatment.open(direction); |
||||
|
}); |
||||
|
}, |
||||
|
pickstart(e) { |
||||
|
this.dateChangeFlag = false |
||||
|
}, |
||||
|
pickend(e) { |
||||
|
this.dateChangeFlag = true |
||||
|
}, |
||||
|
onDateChange(e) { |
||||
|
var datainfo = e.detail.value |
||||
|
var year = this.years[datainfo[0]] |
||||
|
var month = this.months[datainfo[1]] |
||||
|
var day = this.days[datainfo[2]] |
||||
|
this.dateValue = [datainfo[0], datainfo[1], datainfo[2]]; |
||||
|
this.date = year+'/'+(month.toString().length==1?('0'+month):month)+'/'+(day.toString().length==1?('0'+day):day) |
||||
|
}, |
||||
|
closePop() { |
||||
|
this.$refs.updateTreatment.close(); |
||||
|
this.visible = false; |
||||
|
}, |
||||
|
onUpdateTreatmentConfirmButtonClick() { |
||||
|
if(!this.dateChangeFlag) return |
||||
|
|
||||
|
this.treatmentDateString = this.date; |
||||
|
this.$emit('getDateString', this.treatmentDateString); |
||||
|
this.$refs.updateTreatment.close(); |
||||
|
this.visible = false; |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.datePicker{ |
||||
|
.popup-container { |
||||
|
position: relative; |
||||
|
max-height: calc(100vh - 50rpx); |
||||
|
overflow-y: scroll; |
||||
|
background: #ffffff; |
||||
|
border-radius: 40rpx 40rpx 0px 0px; |
||||
|
padding: 42rpx 32rpx 0; |
||||
|
|
||||
|
.header { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
position: relative; |
||||
|
|
||||
|
.title { |
||||
|
font-size: 36rpx; |
||||
|
color: #000000; |
||||
|
height: 50px; |
||||
|
line-height: 50px; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
|
||||
|
.close-icon { |
||||
|
position: absolute; |
||||
|
z-index: 1; |
||||
|
top: 50%; |
||||
|
transform: translateY(-50%); |
||||
|
right: 0; |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
} |
||||
|
} |
||||
|
.desc{ |
||||
|
font-size: 28rpx; |
||||
|
font-weight: normal; |
||||
|
line-height: 38rpx; |
||||
|
height: 38rpx; |
||||
|
color: #666666; |
||||
|
text-align: center; |
||||
|
margin-top: 12rpx; |
||||
|
} |
||||
|
.content-container{ |
||||
|
width: 100%; |
||||
|
padding: 0 25rpx; |
||||
|
box-sizing: border-box; |
||||
|
margin-bottom: 42rpx; |
||||
|
background: #F7F7F7; |
||||
|
|
||||
|
.datepicker-wrapper{ |
||||
|
width: calc(100% - 80rpx); |
||||
|
margin: 0 auto; |
||||
|
} |
||||
|
.close-up-btn{ |
||||
|
position: absolute; |
||||
|
right: 44rpx; |
||||
|
top: 44rpx; |
||||
|
z-index: 9; |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
img{ |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
} |
||||
|
} |
||||
|
.item{ |
||||
|
line-height: 68rpx; |
||||
|
height: 68rpx; |
||||
|
color: #E5E5E5; |
||||
|
&.selected { |
||||
|
font-size: 28rpx !important; |
||||
|
color: #000000 !important; |
||||
|
} |
||||
|
&.style1 { |
||||
|
font-size: 26rpx !important; |
||||
|
|
||||
|
color: #999999 !important; |
||||
|
} |
||||
|
&.style2 { |
||||
|
color: #BEBEBE !important; |
||||
|
font-size: 24rpx !important; |
||||
|
} |
||||
|
&.style3 { |
||||
|
color: #E5E5E5 !important; |
||||
|
font-size: 24rpx !important; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.datepicker-picker-view { |
||||
|
margin-top: 46rpx; |
||||
|
width: 100%; |
||||
|
height: 470rpx; |
||||
|
background: #F7F7F7; |
||||
|
} |
||||
|
|
||||
|
.item { |
||||
|
line-height: 100rpx; |
||||
|
text-align: center; |
||||
|
} |
||||
|
|
||||
|
.confirm-button-wrapper{ |
||||
|
box-shadow: 0rpx -2rpx 6rpx 0rpx rgba(181,181,181,0.13); |
||||
|
height: 124rpx; |
||||
|
width: 750rpx; |
||||
|
margin-left: -32rpx; |
||||
|
background: #FFFFFF; |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
|
z-index: 888; |
||||
|
.confirm-button { |
||||
|
margin: 16rpx 54rpx; |
||||
|
height: 92rpx; |
||||
|
background: #39d067; |
||||
|
border-radius: 16rpx; |
||||
|
font-size: 32rpx; |
||||
|
color: #ffffff; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
|
<style> |
||||
|
>>> .datepicker-mask-class{ |
||||
|
background-image: none; |
||||
|
} |
||||
|
.datepicker-custom-indicatorr::before{ |
||||
|
border-top: 3rpx solid #D7D7D7 !important; |
||||
|
} |
||||
|
.datepicker-custom-indicatorr::after{ |
||||
|
border-bottom: 3rpx solid #D7D7D7 !important; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue