page_entbase/entbase-mobile/page_entbase_mobile/js/additionWord.js

$(function(){

    $('.knowBtn').on('click',function(){
        $(".problemPop").hide()
    })
    $(".problem").on('click',function(){
        $(".problemPop").css("display",'flex');
    })

    function hasWords () {
        // var showKeyWordLength = $(".showKeyWord ul").find('li').length;
        // if(showKeyWordLength === 0){
        //     $(".addkeyWord").show();
        // } else {
        //     $(".addkeyWord").hide();
        // }
        $(".enter").hide();
    }
    // 把所有的附加词添加到数组里面
    var additionArr = []
    // 获取地址栏参数
    var addkey = location.search
    console.log(addkey)
    // 获取关键词设置
    if(addkey == '?addkey'){
        $(".addKeyWord i").hide()
        sessionStorage.setItem('ismodify',0)
        // if(JSON.stringify(additionArr) == '[]'){
        //     sessionStorage.setItem('noaddition_key',JSON.stringify(additionArr))
        // }else{
        //     sessionStorage.setItem('noaddition_key',JSON.stringify(unique(additionArr)))
        // }
        if(sessionStorage.getItem('iconClick') == 1){
            if(sessionStorage.getItem('isadd') == 1){
                console.log(JSON.parse(sessionStorage.getItem('addition_key')))
                additionArr = JSON.parse(sessionStorage.getItem('addition_key'))
                if(JSON.stringify(additionArr) == '[]'|| additionArr == null){
                    $(".addKeyWord i").hide()
                }else{
                    hasWords()
                    $(".addKeyWord i").show()
                }
                var data = {
                    course:additionArr
                }
                var comHTML = template('appendKeyWords',data)
                $('.showKeyWord>ul').html(comHTML)
            }
        }else{
            if(sessionStorage.getItem('isadd') == 1){
                console.log(JSON.parse(sessionStorage.getItem('noaddition_key')))
                noadditionArr = JSON.parse(sessionStorage.getItem('noaddition_key'))
                if(JSON.stringify(noadditionArr) == '[]'|| noadditionArr == null){
                    $(".addKeyWord i").hide()
                }else{
                    hasWords()
                    $(".addKeyWord i").show()
                }
                var data = {
                    course:noadditionArr
                }
                var comHTML = template('appendKeyWords',data)
                $('.showKeyWord>ul').html(comHTML)
                additionArr = noadditionArr
            }else{
                console.log(JSON.parse(sessionStorage.getItem('noaddition_key')))
                noadditionArr = JSON.parse(sessionStorage.getItem('noaddition_key'))
                if(JSON.stringify(noadditionArr) == '[]'|| noadditionArr == null){
                    $(".addKeyWord i").hide()
                }else{
                    hasWords()
                    $(".addKeyWord i").show()
                }
                var data = {
                    course:noadditionArr
                }
                var comHTML = template('appendKeyWords',data)
                $('.showKeyWord>ul').html(comHTML)
                // additionArr = noadditionArr
            }
        }
    }else{
        sessionStorage.setItem('ismodify',1)
        if(sessionStorage.getItem('isadd') == 0){
            vTools.ajax({
                url:'/subscribe/key/get',
                type:'POST',
                data:{},
                success:function(res) {
                    console.log(res)
                    var classindex = sessionStorage.getItem('classindex')
                    if(res.data.data.length == classindex){
                        classindex = parseInt(classindex)-1
                    }else{
                        classindex = sessionStorage.getItem('classindex')
                    }
                    var indexclick = sessionStorage.getItem('indexclick')
                    console.log(res.data.data[classindex].a_key[indexclick].appendkey)
                    if(res.data.data[classindex].a_key[indexclick].appendkey == null){
                        res.data.data[classindex].a_key[indexclick].appendkey = []
                    }
                    additionArr = res.data.data[classindex].a_key[indexclick].appendkey
                    if(JSON.stringify(additionArr) == '[]'){
                        $(".addKeyWord i").hide()
                    }else{
                        hasWords()
                    }
                    var data = {
                        course:additionArr
                    }
                    var comHTML = template('appendKeyWords',data)
                    $('.showKeyWord>ul').html(comHTML)
                },
                error:function(err) {
                    console.log(err)
                }
            })
        }else{
            console.log(JSON.parse(sessionStorage.getItem('addition_key')))
            additionArr = JSON.parse(sessionStorage.getItem('addition_key'))
            if(JSON.stringify(additionArr) == '[]'){
                $(".addKeyWord i").hide()
            }else{
                hasWords()
            }
            var data = {
                course:additionArr
            }
            var comHTML = template('appendKeyWords',data)
            $('.showKeyWord>ul').html(comHTML)
        }
        
    }
    // 添加按钮
    $(".addKeyWord i").on('click',function(){
        $(".addkeyWord").show()
        $(this).hide()
        $(".addkeyWord input").focus()
        $('.showKeyWord').find('.one').show()
        $('.showKeyWord').find('.modify').hide()
    })
    // 输入框自适应高度
    $('textarea').each(function(i,dom){
        // console.log(i,dom)
        dom.style.height = dom.scrollHeight +'px';
    })
    $("textarea").on("input", function() {
        this.style.height = 'auto';
        this.style.height = this.scrollHeight + "px";
    })
    // 添加keyWords检查输入框内是否有文字，如果有才能点击添加按钮
    $('.addkeyWord input.enterOne').on('input', function() {
        if ($(this).val().length >= 100) {
            var s = $(this).val().slice(0,100)
            $(this).val(s)

            weui.toast('排除词不能超过100字', {
                duration: 2000,
                className: 'text-overflow100',
                callback: function(){ console.log('close') }
            });
            return
        }

        var buttonDOM = $(this).siblings().find('button')[0]
        if ($(this).val().length >= 1) {
            buttonDOM.style.opacity = 1
            buttonDOM.removeAttribute("disabled")
        } else {
            buttonDOM.style.opacity = .5
            buttonDOM.setAttribute("disabled", true)
        }
    })
    // 添加 按钮的点击事件
    $('.addkeyWord .btn button').on('click', function(){
        // var timestamp = new Date().getTime();//动态生成不同的id，因为id唯一不能重复，所以 用时间戳 代替  防止重复
        // console.log(timestamp)
        var keyWord = $('.addkeyWord input.enterOne').val()
        // 去空格
        keyWord = keyWord.replace(/\s+/g, ' ').trim();
        var html = `<li>
                        <div class="one">
                            <div>
                                <span>
                                    <p class="key">${ keyWord }</p>
                                </span>
                            </div>
                            <button class="editKeyWord"><i class="iconfont icon-xiugai"></i> 修改</button>
                        </div>
                        <div class="modify">
                            <textarea  name=""  rows="1"  placeholder="" maxlength="20">${ keyWord}</textarea>
                            <button class="deleteKey">删除</button>
                            <button class="ascertainKey">确定</button>
                        </div>
                    </li>`
        $('.showKeyWord > ul').prepend(html)
        
        // 隐藏
        $(".addkeyWord").hide();
        $('.showKeyWord').show();
        $(".addKeyWord i").show()
        $('.enter.addkeyWord > input').val('')
        var buttonDOM = $('.enter.addkeyWord .btn button')[0]
        buttonDOM.style.opacity = .5
        buttonDOM.setAttribute("disabled", true)
        console.log(sessionStorage.getItem('iconClick'))
        var iconClicks = sessionStorage.getItem('iconClick')
        if(addkey == '?addkey'){
            sessionStorage.setItem('ismodify', 0)
            if(iconClicks == 0){
                $('.showKeyWord>ul').find('li').find('.one').find('.key').each(function(index,value){
                    console.log(additionArr)
                    additionArr.push(value.innerHTML)
                    add_empty(additionArr)
                    sessionStorage.setItem('noaddition_key',JSON.stringify(unique(additionArr)))
                })
            }else{
                $('.showKeyWord>ul').find('li').find('.one').find('.key').each(function(index,value){
                    additionArr.push(value.innerHTML)
                    add_empty(additionArr)
                    sessionStorage.setItem('addition_key',JSON.stringify(unique(additionArr)))
                })
            }
        }else{
            sessionStorage.setItem('ismodify', 1)
            $('.showKeyWord>ul').find('li').find('.one').find('.key').each(function(index,value){
                additionArr.push(value.innerHTML)
                add_empty(additionArr)
                sessionStorage.setItem('addition_key',JSON.stringify(unique(additionArr)))
            })
        }
    })
    // 添加 取消按钮
    $('.addkeyWord .btn .cancel').on('click', function(){
        $(this).parents('.addkeyWord').hide()
        $(".addKeyWord i").show()
    })
    // 编辑
    _that = ''
     isClick = false
    $(".showKeyWord").on('click', '.editKeyWord',function(e){
        isClick = true
        _that = $(this)
        console.log(_that,isClick)
        $('.enter.addkeyWord').hide()
        $('.addKeyWord').hide()
        let oSpan = $(this).parent().siblings().children('textarea');
        console.log($(oSpan).val())
        let val = $(oSpan).val()
        $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
        $(oSpan).val('').focus().val(val) 
        $(this).parent().hide()
        $(this).parent().siblings().css('display','block')
    })

    // 编辑 删除
    $('.showKeyWord').on('click', '.deleteKey', function(e) {
        var jQueryDOM = $(this).parents('li')
        var $that = $(this)
        weui.confirm('确定删除附加词？', {
            buttons: [{
                label: '取消',
                type: 'default',
                onClick: function () { console.log('不删了') }
            }, {
                label: '确定',
                type: 'primary',
                onClick: function () {
                    console.log(JSON.parse(sessionStorage.getItem('addition_key')))
                    var thatval = $that.siblings('textarea').val()
                    console.log(thatval)
                    // var additionkeyArr =JSON.parse(sessionStorage.getItem('addition_key'))
                    console.log(additionArr)
                    for(var i=0;i<additionArr.length;i++){
                        console.log(additionArr[i])
                        if(additionArr[i]==thatval){
                            console.log(i)
                            if(additionArr.length == 1){
                                additionArr = []
                            }else{
                                additionArr.splice(i,1)
                            }
                            add_empty(additionArr)
                        }
                    }
                    console.log(additionArr)
                    if(addkey == '?addkey'){
                        sessionStorage.setItem('ismodify',0)
                        if(JSON.stringify(additionArr) == '[]'){
                            sessionStorage.setItem('noaddition_key',JSON.stringify(additionArr))
                        }else{
                            sessionStorage.setItem('noaddition_key',JSON.stringify(unique(additionArr)))
                        }
                        if(JSON.stringify(additionArr) == '[]'){
                            sessionStorage.setItem('addition_key',JSON.stringify(additionArr))
                        }else{
                            sessionStorage.setItem('addition_key',JSON.stringify(unique(additionArr)))
                        }
                        
                    }else{
                        sessionStorage.setItem('ismodify',1)
                        if(JSON.stringify(additionArr) == '[]'){
                            sessionStorage.setItem('addition_key',JSON.stringify(additionArr))
                        }else{
                            sessionStorage.setItem('addition_key',JSON.stringify(unique(additionArr)))
                        }
                        if(JSON.stringify(additionArr) == '[]'){
                            sessionStorage.setItem('noaddition_key',JSON.stringify(additionArr))
                        }else{
                            sessionStorage.setItem('noaddition_key',JSON.stringify(unique(additionArr)))
                        }
                        
                    }
                    jQueryDOM.remove()
                    hasWords()
                    $('.addKeyWord').show()
                }
            }]
        });
    })
    // 判断附加词是否为空
    function add_empty(arr){
        console.log(arr)
        if(arr.length==0){
            sessionStorage.setItem('add_length',0)
        }else{
            sessionStorage.removeItem('add_length')
        }
    }

    // 编辑 确定
    $('.showKeyWord').on('click', '.ascertainKey', function(e) {
        $('.addKeyWord').show()
        if(isClick == false){
            
        }else{
            var $index = 0
            console.log($(_that).parent().find('.key').text())
            console.log(additionArr)
            // 循环数组得到点击那个修改按钮的下标
            additionArr.forEach(function(value,index){
                console.log($(_that).parent().find('.key').text())
                if($(_that).parent().find('.key').text() == value){
                    console.log(index)
                    $index = index
                }
            })
            // 得到下标后替换掉数组中这个下标的值，存入sessionstroage
            var $this = $(this)
            console.log($this)
            var keyWord = $(this).siblings('textarea').val()
            // 去空格
            keyWord = keyWord.replace(/\s+/g, ' ').trim();
            if(keyWord.length > 20){
                weui.toast('关键词不能超过20字', {
                    duration: 2000,
                    className: 'custom-toast',
                    callback: function () { console.log('close') }
                });
            }else{  
                $this.parent().siblings().find('.key').text(keyWord)
                console.log($this)
                additionArr.splice($index,1,keyWord)
                console.log(additionArr)
                // 保存在本地一个值，点击返回上一级的时候进入关键词设置页面
                if(addkey == '?addkey'){
                    sessionStorage.setItem('ismodify',0)
                    sessionStorage.setItem('noaddition_key',JSON.stringify(unique(additionArr)))
                }else{
                    sessionStorage.setItem('ismodify',1)
                    sessionStorage.setItem('addition_key',JSON.stringify(unique(additionArr)))
                }
                $this.parent().hide().siblings().show()
                $('.addKeyWord').show()
            }
        }
    })
    // 数组去重
    function unique(arr) {
        let newArr = [arr[0]];
        for (let i = 1; i < arr.length; i++) {
            let repeat = false;
            for (let j = 0; j < newArr.length; j++) {
                if (arr[i] === newArr[j]) {
                    repeat = true;
                    break;
                }else{
                    
                }
            }
            if (!repeat) {
                newArr.push(arr[i]);
            }
        }
        return newArr;
    }

    //防止键盘把当前输入框给挡住
    $('input[type="text"],textarea').focus(function () {
        var target = this;
        setTimeout(function(){
            target.scrollIntoViewIfNeeded();
        },400);
    });
})