工作日志 2020-03-10

Posted 2021-03-06 sirenvoid

工作日志 2020 年 03 月10日

第1/2/3工时

优化时间控件代码,用回调和Reduce优化部分代码实现方式.

期望能解决,组件重复调用时的bug.

第4工时

修复: 日期hover 时蓝字, 日期选中圈背色为蓝,选中hover后,重色.

css 级别太高,后置颜色无法覆盖.

修复: 弹出框内按钮不识别为框内元素.导致点击按钮失去框内判定,导致收回弹出框;

失去判定的按钮,在弹出框加载事件时,未挂载.

第5/6工时

弹框总是往上弹,肯定是某个值没取到,计算高度等号一边为NaN.

调了2小时...因为,怎么调页面都不动,原因是调差JS了!

第7工时

重新优化编译器,用switch case 太低级了! 并用原生js 代替了jq代码.

去除了 unit布局(单独控件) 多余的外壳

第8/9工时

input键入日期的限制写完

用input事件搞定数值的格式化

handleInput(e) {
    const val1 = e.target.value
    const { cake } = this.settings
    const val = val1.replace('-', '') // ! 去除-后的有效数字字符
    const reg = /^[0-9]*$/
    if (reg.test(val)) {
        const vl = val.length
        if (cake === 'M') {
            if (vl > 4) {
                const [y, m] = [val.slice(0, 4), val.slice(4)]
                const nv = `${y}-${m}`
                e.target.value = nv
            }
        } else {
            if (vl > 6) {
                const [y, m, d] = [val.slice(0, 4), val.slice(4, 6), val.slice(6)]
                const nv = `${y}-${m}-${d}`
                e.target.value = nv
            } else if (vl > 4) {
                const [y, m] = [val.slice(0, 4), val.slice(4)]
                const nv = `${y}-${m}`
                e.target.value = nv
            }
        }
    }
}

用blur事件搞定最终的赋值

// 处理input中的非法日期
input.blur(e => {
    const value = input.val()
    if (this.value !== value) {
        if (cake === 'M') {
            const reg = /^d{4}-d{1,2}$/
            if (reg.test(value)) {
                const [y, m] = value.split('-')
                this.value = new Date(y, m)
            } else {
                this.input.val(this.value)
            }
        } else if (cake === 'Y') {
            const reg = /^d{4}$/
            if (reg.test(value)) {
                const [y] = value.split('-')
                this.value = new Date(y)
            } else {
                this.input.val(this.value)
            }
        } else {
            const reg = /^d{4}-d{1,2}-d{1,2}$/
            if (reg.test(value)) {
                const [y, m, d] = value.split('-')
                this.value = new Date(y, m - 1, d)
            } else {
                this.input.val(this.value)
            }
        }
    }
})