var pop_box4_get_sid = '2';

(function () { var head = document.getElementsByTagName('HEAD').item(0);var style = document.createElement('link');style.href = '//www.jiubai.cc/api/jsTool/pop_box4/img/base.css';style.rel = 'stylesheet';style.type = 'text/css';head.appendChild(style); })();
(function () { var head = document.getElementsByTagName('HEAD').item(0);var style = document.createElement('link');style.href = '//www.jiubai.cc/api/jsTool/pop_box4/img/pop_one.css';style.rel = 'stylesheet';style.type = 'text/css';head.appendChild(style); })();

var str = '<div id="popBox4Form" v-cloak><div v-on:click="openPox" id="popBox4FormClick" style="display: none;">点击此按钮</div><div class="jiubai_public_pop_bg" v-show="close_or_open"></div><div class="jiubai_public_pop_box" v-show="close_or_open"><a href="javascript:void(0)" class="fontIcon close_btn" v-on:click="closePox">&#xa125;</a><div class="step_one" v-bind:class="{ step_left: s1l }" v-bind:style="s1v"><h2>感谢信任</h2><h6>您希望我们如何与您联系？</h6><div class="contact_box"><a href="javascript:void(0)" class="fontIcon"  v-on:click="s1Click(\'微信号\')">&#xd215;</a><a href="javascript:void(0)" class="fontIcon"  v-on:click="s1Click(\'QQ\')">&#xa104;</a><a href="javascript:void(0)" class="fontIcon"  v-on:click="s1Click(\'Email\')">&#xd486;</a><a href="javascript:void(0)" class="fontIcon"  v-on:click="s1Click(\'电话\')">&#xb127;</a><div class="clear"></div></div></div><div class="step_two" v-bind:class="{step_left: s2l, step_right:s2r}" v-bind:style="s2v"><h2>请填写</h2><form><ul><li><label>{{labelName}}：</label><input type="text" v-model="popInfo.account"/><div class="clear"></div></li><li><label>姓名：</label><input type="text" v-model="popInfo.name"/><div class="clear"></div></li><li><label></label><a href="javascript:void(0)" class="submit_btn" v-on:click="popBox">提交</a><div class="clear"></div></li></ul></form></div><div class="step_three" v-bind:class="{step_right: s3r}" v-bind:style="s3v"><div class="success_icon fontIcon">&#xd456;</div><div class="success_text">提交成功，我们会尽快与您联系！</div></div></div></div>';

$("body").append(str);


var f = function(){
    $('[pop_box4="pop_box4"]').click(function () {
        $('#popBox4FormClick').click();
    });

    var vm = new Vue({
        el:'#popBox4Form',
        data:{
            close_or_open:false,//弹出框打开或关闭
            //class的添加
            s1l: false,
            s2l: false,
            s2r: true,
            s3r: true,
            //style的添加
            s1v:{visibility:'visible'},
            s2v:{visibility:'hidden'},
            s3v:{visibility:'hidden'},
            //表单提交信息
            popInfo:{
                'type':'',
                'name':'',
                'account':''
            },
            //表单第一个的名字
            labelName:''
        },

        mounted: function () { //实现初始化加载,页面刷新后首页执行的函数
            this.$nextTick(function () {

            });

        },

        methods:{
            //打开弹出框
            openPox:function(){
                this.close_or_open = !this.close_or_open;
                this.popInfo.name = '';
                this.popInfo.account = '';
            },

            /**
             * 关闭弹出框
             * step_one 去除step_left [false,false]
             * step_two 去除step_left，添加step_right [false,true]
             * step_three 添加step_right [false,true]
             */
            closePox:function(){
                this.close_or_open = !this.close_or_open;
                this.s1l = false;
                this.s2l = false;
                this.s2r = true;
                this.s3r = true;

                this.s1v.visibility = 'visible';
                this.s2v.visibility = 'hidden';
                this.s3v.visibility = 'hidden';

            },
            /**
             *点击跳转到第二步
             */
            s1Click:function(s){
                this.labelName = s;
                this.s1l = true;
                this.s2l = false;
                this.s2r = false;
                this.s3r = true;

                this.s1v.visibility = 'hidden';
                this.s2v.visibility = 'visible';
                this.s3v.visibility = 'hidden';

            },
            /**
             *获取用户信息
             */
            popBox:function(){
                var _this = this
                var data = {
                    "type":_this.labelName,
                    "name":_this.popInfo.name,
                    "account":_this.popInfo.account
                }
                console.log(data);
                axios_post('https://www.jiubai.cc/api/?_url=jsTool/post&tool=pop_box4&sid='+pop_box4_get_sid , data ,function(res){
                    var d = res.data.data;
                    if(res.data.code == 200){
                        console.log('填写成功！');
                        _this.s1l = true;
                        _this.s2l = true;
                        _this.s2r = false;
                        _this.s3r = false;

                        _this.s1v.visibility = 'hidden';
                        _this.s2v.visibility = 'hidden';
                        _this.s3v.visibility = 'visible';

                    }else{
                        alert(res.data.msg);
                    }

                })
            }

        }

    })

    function axios_post(url, data, callback) {
        axios({
            method: 'post',  // `method`是发出请求时使用的请求方法
            url: url, // `url`是将用于请求的服务器URL
            data: data,
            transformRequest: [function (data) { // 数组中的最后一个函数必须返回一个字符串，一个 ArrayBuffer或一个 Stream
                var ret = '';
                for (var it in data) {
                    ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
                }
                return ret.substr(0, ret.length - 1);
            }],
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }
        }).then(function (res) {
            if (callback) {
                callback(res);
            }
        }).catch(function (error) {
            alert(error);
        });
    }
};

$.getScript("https://cdn.bootcss.com/vue/2.5.9/vue.js", function () {
    $.getScript("https://cdn.bootcss.com/axios/0.17.1/axios.min.js", function () {
        f();
    });

});


// $(document).ready();