/* $(function() {

    var step= $("#myStep").step();
    
    $("#preBtn").click(function(event) {
      var yes=step.preStep();//上一步
    });
    $("#nextBtn").click(function(event) {
      var yes=step.nextStep();
    });
    $("#goBtn").click(function(event) {
			var yes=step.goStep(3);//到指定步
		});
  });*/


  
(function (factory) {
    "use strict";
    if (typeof define === 'function') {
        // using CMD; register as anon module
      define.cmd&&define('jquery-step', ['jquery'], function (require, exports, moudles) {
            var $=require("jquery");
            factory($);
            return $;
        });
      define.amd&&define(['jquery'], factory);
    } else {
        // no CMD; invoke directly
        factory( (typeof(jQuery) != 'undefined') ? jQuery : window.Zepto );
    }
}

(function($){
  $.fn.step = function(options) { 
      var opts = $.extend({}, $.fn.step.defaults, options);
      var size=this.find(".step_header li").length;
      var barWidth=opts.initStep<size?100/(2*size)+100*(opts.initStep-1)/size : 100;
      var curPage=opts.initStep;

      this.find(".step_header").prepend("<div class=\"step_bar\"><div class=\"step_bar_active\"></div></div>");
      this.find(".step_list").eq(opts.initStep-1).show();
      if (size<opts.initStep) {
        opts.initStep=size;
      }
      if (opts.animate==false) {
        opts.speed=0;
      }
      this.find(".step_header li").each(function (i, li) {
        if (i<opts.initStep){
          $(li).addClass("step_active");
        }
        $(li).prepend("<span>"+(i+1)+"</span>");
        // $(li).append("<span>"+(i+1)+"</span>");
    });
    this.find(".step_header li").css({
      "width": 100/size+"%"
    });
    this.find(".step_header").show();
    this.find(".step_bar_active").animate({
        "width": barWidth+"%"},
        opts.speed, function() {
        
    });

      this.nextStep=function() {
        if (curPage>=size) {
          return false;
        }

        if (curPage == 0) {
          $("#disagree").hide();
        }else if (curPage == 1) {
          var contentHtml = "<div class='main_content' style='width:900px;'>"+
                            "<span>系统平台已根据您发布的需求自动为您匹配以下服务机构。请您选出5家最适合贵公司的服务机构。网络后台会自动发信息至这5家服务机构联系人手机上，请保持通讯畅通。</span>"+
                            "<div>"+
                            "<ul>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>江苏邦驰茂元安全技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>消防 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>南京时态环保科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>千藤（南京）环保科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>南京鸿雁容器技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news' style='border-bottom:1px solid #e6e6e6;'>"+
                            "<span class='company_name'>江苏粤佳安全技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "</ul>"+
                            "</div>"+
                            "</div>";
          $(".main_content").replaceWith($(contentHtml));
          $("#disagree").hide();
          $(".title").replaceWith("<div class='title'><span>首页 > </span><span>项目中心 > </span><span>筛选服务机构</span></div>");
          return this.goStep(curPage+1);
        }else if(curPage == 2){
          var contentHtml = "<div class='main_content' style='width:900px;'>"+
                            "<span>请确定其中一家服务机构作为贵公司的合作机构。</span>"+
                            "<ul>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>江苏邦驰茂元安全技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>消防 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>南京时态环保科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>千藤（南京）环保科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news'>"+
                            "<span class='company_name'>南京鸿雁容器技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "<li>"+
                            "<input type='radio' style='margin-top:38px;' onclick='setSelect(this)'/>"+
                            "<img src='images/touxiang.png'/>"+
                            "<div class='company_news' style='border-bottom:1px solid #e6e6e6;'>"+
                            "<span class='company_name'>江苏粤佳安全技术科技有限公司</span>"+
                            "<img src='images/field.png' />"+
                            "<span style='font-size:12px;color:#d3d4d5;'>服务领域</span>"+
                            "<span style='margin-left:10px;'>环保 安全</span>"+
                            "<img src='images/area.png' style='margin-top:50px;margin-left:-136px;'/>"+
                            "<span style='font-size:12px;color:#d3d4d5;position:absolute;margin-top:20px;'>所在地区</span>"+
                            "<span style='position:absolute;margin-left:58px;margin-top:20px;'>江苏 南京</span>"+
                            "<span style='float:right;margin-right:10px;color:#ef840d;'>025-4750896</span>"+
                            "</div>"+
                            "</li>"+
                            "</ul>"+
                            "</div>";
          $(".main_content").replaceWith($(contentHtml));
          $("#disagree").hide();
          $(".title").replaceWith("<div class='title'><span>首页 > </span><span>项目中心 > </span><span>选中服务机构</span></div>");
          return this.goStep(curPage+1);
        }else if(curPage == 3){
          var contentHtml=  "<div class='main_content'>"+
                            "<span>企业名称：</span>"+
                            "<span>江苏邦驰茂元安全技术科技有限公司</span>"+
                            "<div>"+
                            "<span>成交金额：</span>"+
                            "<span>50万</span>"+
                            "</div>"+
                            "<div>"+
                            "<span>支付方式：</span>"+
                            "<select style='width:220px;border:1px solid #e6e6e6;'>"+
                            "<option value='线上支付'>线上支付</option>"+
                            "<option value='2'>2</option>"+
                            "<option value='3'>3</option>"+
                            "</select>"+
                            "</div>"+
                            "<div>"+
                            "<span>预付金额：</span>"+
                            "<span>10万</span>"+
                            "</div>"+
                            "</div>";
          $(".main_content").replaceWith($(contentHtml));  
          $("#disagree").hide();  
          $(".title").replaceWith("<div class='title'><span>首页 > </span><span>项目中心 > </span><span>填写合同信息</span></div>");
          $("#nextBtn").click(function(){
            var contentHtml=  "<div class='main_content'>"+
                            "<span>项目名称：</span>"+
                            "<span>南京河西CBD大楼安全检测</span>"+
                            "<div>"+
                            "<span>成交金额：</span>"+
                            "<input type='text' placeholder='50' disabled='true' style='border:1px solid #e6e6e6;'/>万"+
                            "</div>"+
                            "<div>"+
                            "<span>已付金额：</span>"+
                            "<input type='text' placeholder='15' disabled='true' style='border:1px solid #e6e6e6;'/>万"+
                            "</div>"+
                            "<div>"+
                            "<span>预付金额：</span>"+
                            "<input type='text' value='15' style='border:1px solid #e6e6e6;'/>万"+
                            "</div>"+
                            "</div>";
            $(".main_content").replaceWith($(contentHtml));
            $(".title").replaceWith("<div class='title'><span>首页 > </span><span>项目中心 > </span><span>预付项目款</span></div>");
            $(".step_image").replaceWith("<img src='images/pay.png' class='step_image'/>");
            $(".step_title").replaceWith("<span class='step_title'>预付项目款</span>");
            $("#disagree").hide();

            $("#nextBtn").click(function(){
            var contentHtml=  "<div class='main_content'>"+
                            "<span>项目名称：</span>"+
                            "<span>南京河西CBD大楼安全检测</span>"+
                            "<div>"+
                            "<span>成交金额：</span>"+
                            "<span>50万</span>"+
                            "</div>"+
                            "<div>"+
                            "<span>已付金额：</span>"+
                            "<span>15万</span>"+
                            "</div>"+
                            "<div>"+
                            "<span>预付金额：</span>"+
                            "<span>15万</span>"+
                            "</div>"+
                            "<div>"+
                            "<span>备注说明：</span>"+
                            "<span>王工，请在9月20号之前审批下来项目款，我们好早日开工。</span>"+
                            "</div>";
            $(".main_content").replaceWith($(contentHtml));
            $(".title").replaceWith("<div class='title'><span>首页 > </span><span>项目中心 > </span><span>请款审批</span></div>");
            $(".step_image").replaceWith("<img src='images/approval.png' class='step_image'/>");
            $(".step_title").replaceWith("<span class='step_title'>请款审批</span>");
            $("#button_title").replaceWith("<span>同意付款</span>");
            $("#disagree").show();

            $("#nextBtn").click(function(){
              window.location.href="pay.shtml";
            });
          });
          });
          return this.goStep(curPage+1);
        }else if(curPage == 3){
          var contentHtml=  "<div class='main_content'>"+
                            "<span>企业名称：</span>"+
                            "<span>江苏邦驰茂元安全技术科技有限公司</span>"+
                            "<div>"+
                            "<span>成交金额：</span>"+
                            "<span>50万</span>"+
                            "</div>"+
                            "<div>"+
                            "<span>支付方式：</span>"+
                            "<select style='width:220px;border:1px solid #e6e6e6;'>"+
                            "<option value='线上支付'>线上支付</option>"+
                            "<option value='2'>2</option>"+
                            "<option value='3'>3</option>"+
                            "</select>"+
                            "</div>"+
                            "<div>"+
                            "<span>预付金额：</span>"+
                            "<span>10万</span>"+
                            "</div>"+
                            "</div>";
          $(".main_content").replaceWith($(contentHtml));
          $("#nextBtn_title").replaceWith("<span>确认</span>");
          $("#little_title").replaceWith("<span style='width:100px;'>选中服务机构</span>");
        };
        
      }

      this.preStep=function() {
        if (curPage<=1) {
          return false;
        }
        return this.goStep(curPage-1);
      }

      this.goStep=function(page) {
        if (page ==undefined || isNaN(page) || page<0) {
          if(window.console&&window.console.error){
            console.error('the method goStep has a error,page:'+page);
          }
        return false;
        }
        curPage=page;
        this.find(".step_list").hide();
        this.find(".step_list").eq(curPage-1).show();
        this.find(".step_header li").each(function (i, li) {
          $li=$(li);
          $li.removeClass('step_active');
          if (i<page){
            $li.addClass('step_active');
            if(opts.scrollTop){
             $('html,body').animate({scrollTop:0}, 'slow');
            }
        }
      });
      barWidth=page<size?100/(2*size)+100*(page-1)/size : 100;
        this.find(".step_bar_active").animate({
          "width": barWidth+"%"},
          opts.speed, function() {
            
        });
        return true;
      }
      return this;
  };
   
  $.fn.step.defaults = {
      animate:true,
      speed:500,
      initStep:1,
      scrollTop:true
  };

}));

function setSelect(radioObj){
  var radioCheck = $(radioObj).val();
  if ("1" == radioCheck) {
    $(radioObj).attr("checked",false);
    $(radioObj).val("0"); 
  } else{
    $(radioObj).val("1");
  };
};