mirror of
https://gitee.com/TSpecific/tuniao-ui.git
synced 2026-03-10 01:24:01 +08:00
Compare commits
5 Commits
d95276c469
...
master
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d355989fcf | ||
|
|
5b1e863066 | ||
|
|
9c161727ff | ||
|
|
71e58907a9 | ||
|
|
8629754e50 |
@@ -248,6 +248,7 @@
|
|||||||
return (index, type) => {
|
return (index, type) => {
|
||||||
let color = type === 'bg' ? '' : this.color
|
let color = type === 'bg' ? '' : this.color
|
||||||
let day = index + 1
|
let day = index + 1
|
||||||
|
|
||||||
let date = `${this.year}-${this.month}-${day}`
|
let date = `${this.year}-${this.month}-${day}`
|
||||||
let timestamp = new Date(date.replace(/\-/g,'/')).getTime()
|
let timestamp = new Date(date.replace(/\-/g,'/')).getTime()
|
||||||
let start = this.startDate.replace(/\-/g,'/')
|
let start = this.startDate.replace(/\-/g,'/')
|
||||||
@@ -487,8 +488,9 @@
|
|||||||
let daysArr = days.map((item) => {
|
let daysArr = days.map((item) => {
|
||||||
let bottomInfo = this.showLunar ? Calendar.solar2lunar(this.year, this.month, item).IDayCn : ''
|
let bottomInfo = this.showLunar ? Calendar.solar2lunar(this.year, this.month, item).IDayCn : ''
|
||||||
let color = this.showLunar ? this.lunarColor : this.activeColor
|
let color = this.showLunar ? this.lunarColor : this.activeColor
|
||||||
|
let date = `${this.year}-${this.month}-${item}`
|
||||||
if (
|
if (
|
||||||
(this.mode === 'date' && this.day == item) ||
|
(this.mode === 'date' && date == this.activeDate) ||
|
||||||
(this.mode === 'range' && (this.startDay == item || this.endDay == item))
|
(this.mode === 'range' && (this.startDay == item || this.endDay == item))
|
||||||
) {
|
) {
|
||||||
color = this.activeColor
|
color = this.activeColor
|
||||||
|
|||||||
@@ -45,7 +45,7 @@
|
|||||||
v-if="type === 'select'"
|
v-if="type === 'select'"
|
||||||
class="tn-input__text"
|
class="tn-input__text"
|
||||||
>
|
>
|
||||||
{{defaultValue}}
|
<text :class="defaultValue == undefined || defaultValue == '' ? 'tn-input__placeholder':''">{{defaultValue == undefined || defaultValue == '' ? placeholder : defaultValue }}</text>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<input
|
<input
|
||||||
@@ -337,28 +337,7 @@
|
|||||||
/**
|
/**
|
||||||
* input事件
|
* input事件
|
||||||
*/
|
*/
|
||||||
handleInput:debounceFun(function(event){
|
handleInput:()=>{},
|
||||||
let value = event.detail.value
|
|
||||||
// 是否需要去掉空格
|
|
||||||
if (this.trim) value = this.$tn.string.trim(value)
|
|
||||||
// 原生事件
|
|
||||||
this.$emit('input', value)
|
|
||||||
// model赋值
|
|
||||||
this.defaultValue = value
|
|
||||||
// 过一个生命周期再发送事件给tn-form-item,否则this.$emit('input')更新了父组件的值,但是微信小程序上
|
|
||||||
// 尚未更新到tn-form-item,导致获取的值为空,从而校验混论
|
|
||||||
// 这里不能延时时间太短,或者使用this.$nextTick,否则在头条上,会造成混乱
|
|
||||||
setTimeout(() => {
|
|
||||||
// 头条小程序由于自身bug,导致中文下,每按下一个键(尚未完成输入),都会触发一次@input,导致错误,这里进行判断处理
|
|
||||||
// #ifdef MP-TOUTIAO
|
|
||||||
if (this.$tn.string.trim(value) === this.lastValue) return
|
|
||||||
this.lastValue = value
|
|
||||||
// #endif
|
|
||||||
|
|
||||||
// 发送当前的值到form-item进行校验
|
|
||||||
this.dispatch('tn-form-item','on-form-change', value)
|
|
||||||
}, 40)
|
|
||||||
},this.blockTime),
|
|
||||||
/**
|
/**
|
||||||
* blur事件
|
* blur事件
|
||||||
*/
|
*/
|
||||||
@@ -407,7 +386,35 @@
|
|||||||
inputClick() {
|
inputClick() {
|
||||||
this.$emit('click')
|
this.$emit('click')
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
mounted() {
|
||||||
|
let that = this;
|
||||||
|
that.handleInput = debounceFun(function(event){
|
||||||
|
let value = event.detail.value
|
||||||
|
// 是否需要去掉空格
|
||||||
|
try {
|
||||||
|
if (that.trim) value = that.$tn.string.trim(value)
|
||||||
|
}catch (e){
|
||||||
|
}
|
||||||
|
// 原生事件
|
||||||
|
that.$emit('input', value)
|
||||||
|
// model赋值
|
||||||
|
that.defaultValue = value
|
||||||
|
// 过一个生命周期再发送事件给tn-form-item,否则this.$emit('input')更新了父组件的值,但是微信小程序上
|
||||||
|
// 尚未更新到tn-form-item,导致获取的值为空,从而校验混论
|
||||||
|
// 这里不能延时时间太短,或者使用this.$nextTick,否则在头条上,会造成混乱
|
||||||
|
setTimeout(() => {
|
||||||
|
// 头条小程序由于自身bug,导致中文下,每按下一个键(尚未完成输入),都会触发一次@input,导致错误,这里进行判断处理
|
||||||
|
// #ifdef MP-TOUTIAO
|
||||||
|
if (that.$tn.string.trim(value) === that.lastValue) return
|
||||||
|
that.lastValue = value
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// 发送当前的值到form-item进行校验
|
||||||
|
that.dispatch('tn-form-item','on-form-change', value)
|
||||||
|
}, 40)
|
||||||
|
},that.blockTime);
|
||||||
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -418,6 +425,10 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
|
&__placeholder{
|
||||||
|
color: $tn-font-sub-color;
|
||||||
|
}
|
||||||
|
|
||||||
&__input {
|
&__input {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
color: $tn-font-color;
|
color: $tn-font-color;
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<view
|
<view
|
||||||
class="tn-switch-class tn-switch"
|
class="tn-switch-class tn-switch"
|
||||||
:class="[
|
:class="[
|
||||||
value ? 'tn-switch--on' : '',
|
switchState ? 'tn-switch--on' : '',
|
||||||
disabled ? 'tn-switch--disabled' : '',
|
disabled ? 'tn-switch--disabled' : '',
|
||||||
`tn-switch--${shape}`
|
`tn-switch--${shape}`
|
||||||
]"
|
]"
|
||||||
@@ -22,7 +22,7 @@
|
|||||||
class="tn-switch__icon tn-switch__icon--left"
|
class="tn-switch__icon tn-switch__icon--left"
|
||||||
:class="[
|
:class="[
|
||||||
`tn-icon-${leftIcon}`,
|
`tn-icon-${leftIcon}`,
|
||||||
value ? 'tn-switch__icon--show' : ''
|
switchState ? 'tn-switch__icon--show' : ''
|
||||||
]"
|
]"
|
||||||
:style="[iconStyle]"></view>
|
:style="[iconStyle]"></view>
|
||||||
<!-- 右图标 -->
|
<!-- 右图标 -->
|
||||||
@@ -31,7 +31,7 @@
|
|||||||
class="tn-switch__icon tn-switch__icon--right"
|
class="tn-switch__icon tn-switch__icon--right"
|
||||||
:class="[
|
:class="[
|
||||||
`tn-icon-${rightIcon}`,
|
`tn-icon-${rightIcon}`,
|
||||||
!value ? 'tn-switch__icon--show' : ''
|
!switchState ? 'tn-switch__icon--show' : ''
|
||||||
]"
|
]"
|
||||||
:style="[iconStyle]"></view>
|
:style="[iconStyle]"></view>
|
||||||
</view>
|
</view>
|
||||||
@@ -42,7 +42,7 @@
|
|||||||
name: 'tn-switch',
|
name: 'tn-switch',
|
||||||
props: {
|
props: {
|
||||||
value: {
|
value: {
|
||||||
type: Boolean,
|
type: [Number, String, Boolean],
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
// 按钮的样式
|
// 按钮的样式
|
||||||
@@ -106,7 +106,7 @@
|
|||||||
switchStyle() {
|
switchStyle() {
|
||||||
let style = {}
|
let style = {}
|
||||||
style.fontSize = this.$tn.string.getLengthUnitValue(this.size)
|
style.fontSize = this.$tn.string.getLengthUnitValue(this.size)
|
||||||
style.backgroundColor = this.value ?
|
style.backgroundColor = this.switchState ?
|
||||||
this.activeColor ? this.activeColor : '#01BEFF' :
|
this.activeColor ? this.activeColor : '#01BEFF' :
|
||||||
this.inactiveColor ? this.inactiveColor : '#AAAAAA'
|
this.inactiveColor ? this.inactiveColor : '#AAAAAA'
|
||||||
return style
|
return style
|
||||||
@@ -124,22 +124,33 @@
|
|||||||
return style
|
return style
|
||||||
},
|
},
|
||||||
loadingColor() {
|
loadingColor() {
|
||||||
return this.value ? this.activeColor : ''
|
return this.switchState ? this.activeColor : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
value:{
|
||||||
|
handler(newVal,oldVal){
|
||||||
|
this.switchState = (this.value == this.activeValue);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
switchState:false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted() {
|
||||||
|
this.switchState = (this.value == this.activeValue);
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
click() {
|
click() {
|
||||||
|
this.switchState = !this.switchState;
|
||||||
if (!this.disabled && !this.loading) {
|
if (!this.disabled && !this.loading) {
|
||||||
if (this.vibrateShort) uni.vibrateShort()
|
if (this.vibrateShort) uni.vibrateShort()
|
||||||
this.$emit('input', !this.value)
|
this.$emit('input', this.switchState ? this.activeValue : this.inactiveValue)
|
||||||
// 放到下一个生命周期,因为双向绑定的value修改父组件状态需要时间,且是异步的
|
// 放到下一个生命周期,因为双向绑定的value修改父组件状态需要时间,且是异步的
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$emit('change', this.value ? this.activeValue : this.inactiveValue);
|
this.$emit('change', this.switchState ? this.activeValue : this.inactiveValue);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user