<extend name="Public/base" />

<block name="body">
  <link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
  <link rel="stylesheet" type="text/css" href="__CSS__/admin_table.css" media="all">
  <link rel="stylesheet" type="text/css" href="__STATIC__/webuploader/webuploader.css" media="all">
  <script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
  <script type="text/javascript" src="__STATIC__/provincecityarea/AreaData_min.js"></script>
  <script src="__STATIC__/layer/layer.js"></script>
  <script type="text/javascript" src="__JS__/select2.min.js"></script>
  <script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>

  <style>
    .tabcon1711 input.time {
      width: 150px;
    }
    #form .txt_area1 {
      width: 300px;
      height: 150px;
    }
    .tabcon1711 .form_unit {
      margin-left: 2px;
    }
    .tabcon1711 .mustmark {
      margin-left:-7px;
    }
    .select2-container--default .select2-selection--single .select2-selection__rendered {
      color: #000;
      line-height: 30px;
    }
    .select2-container--default .select2-selection--single {
      border-radius: 4px;
      height: 30px;
    }
    .select2-container--default .select2-selection--single .select2-selection__arrow {
       height: 30px;
    }
    .tabcon1711 input[type=text]:read-only {
      background: #CCCCCC;
    }
    .tabcon1711 .span-btn {
      float: left;
      margin-left: 30px;
      height: 30px;
      line-height: 30px;
      color: #fff;
      background-color: #3d96c8;
      border: 0;
      border-radius: 3px;
      cursor: pointer;
      align-content: center;
      padding-left: 10px;
      padding-right: 10px;
    }
    .tabcon1711 .edit-btn {
      background-color: #3d96c8;
    }
    .tabcon1711 .cancel-btn {
      background-color: #999;
      display: none;
    }
    .tabcon1711 .edit-btn:hover {
      background-color: #589dc8;
    }
    .tabcon1711 .cancel-btn {
      background-color: #ababab;
    }
  </style>
  <div class="cf main-place top_nav_list navtab_list">
    <h3 class="page_title">{$meta_title}</h3>
    <!--    <p class="description_text">说明：此功是创建推广员时所需填写信息</p>-->
  </div>

  <!-- 标签页导航 -->
  <div class="tab-wrap">
    <div class="tab-content tabcon1711">
      <!-- 表单 -->
      <form id="form" action="{:U('certification?model='.$model['id'])}" method="post" class="form-horizontal">
        <!-- 基础文档模型 -->
        <div id="tab1" class="tab-pane in tab1">
          <table  border="0" cellspacing="0" cellpadding="0">
            <tbody>
            <tr>
              <td class="l">会长账号：</td>
              <td class="r">
                <input type="text" class="txt" disabled="disabled" style="background: #CCCCCC;" value="{$records['account']|default=''}">
                <span class="notice-text">通过推广员后台注册申请或者管理后台创建的账号</span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>真实姓名：</td>
              <td class="r">
                <empty name="records['real_name']">
                  <input type="text" class="txt" name="real_name" value="{$records['real_name']|default=''}">
                  <else/>
                  <input type="text" class="txt" name="real_name" value="{$records['real_name']|default=''}" readonly="readonly">
                  <span class="span-btn edit-btn">修改</span>
                  <span class="span-btn cancel-btn">取消</span>
                </empty>
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>身份证号码：</td>
              <td class="r">
                <empty name="records['real_name']">
                  <input type="text" class="txt" name="idcard" value="{$records['idcard']|default=''}">
                  <else/>
                  <input type="text" class="txt" name="idcard" value="{$records['idcard']|default=''}" readonly="readonly">
                  <span class="span-btn edit-btn">修改</span>
                  <span class="span-btn cancel-btn">取消</span>
                </empty>
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr class="picbox">
              <td class="l noticeinfo"><i class="mustmark">*</i>身份证照：</td>
              <td class="r">
                    <span class="table_btn table_upload" style="float: none;">
                        <input type="hidden" name="idcarpic" value="{$records['idcarpic']}" />
                        <div id="uploadImg" class="wu-example">
                            <div class="btns">
                                <div id="idcarpic">上传图片</div>
                            </div>
                          <!--用来存放文件信息-->
                            <div id="idcarpic_thelist" class="uploader-list" style="display: flex;">

                            </div>
                        </div>
                    </span>
                <span class="notice-text">请上传身份证正反面，图片为jpg、png格式(不超过2M)</span>
              </td>
            </tr>
            <tr class="picbox">
              <td class="l noticeinfo">营业执照：</td>
              <td class="r">
                    <span class="table_btn table_upload" style="float: none;">
                        <input type="hidden" name="businesspic" value="{$records['businesspic']}" />
                        <div id="uploadImg" class="wu-example">
                            <div class="btns">
                                <div id="businesspic">上传图片</div>
                            </div>
                          <!--用来存放文件信息-->
                            <div id="businesspic_thelist" class="uploader-list" style="display: flex;">

                            </div>
                        </div>
                    </span>
                <span class="notice-text">如果是公司请上传营业执照</span>
              </td>
            </tr>
            <tr class="picbox">
              <td class="l noticeinfo">合作合同：</td>
              <td class="r">
                    <span class="table_btn table_upload" style="float: none;">
                        <input type="hidden" name="agreementpic" value="{$records['agreementpic']}" />
                        <div id="uploadImg" class="wu-example">
                            <div class="btns">
                                <div id="agreementpic">上传图片</div>
                            </div>
                          <!--用来存放文件信息-->
                            <div id="agreementpic_thelist" class="uploader-list" style="display: flex;">

                            </div>
                        </div>
                    </span>
                <span class="notice-text">须上传平台与贵公司(工作室)签署的合作合同</span>
              </td>
            </tr>
            <tr class="picbox">
              <td class="l noticeinfo">补充认证：</td>
              <td class="r">
                    <span class="table_btn table_upload" style="float: none;">
                        <input type="hidden" name="anothpic" value="{$records['anothpic']}" />
                        <div id="uploadImg" class="wu-example">
                            <div class="btns">
                                <div id="anothpic">上传图片</div>
                            </div>
                          <!--用来存放文件信息-->
                            <div id="anothpic_thelist" class="uploader-list" style="display: flex;">

                            </div>
                        </div>
                    </span>
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>电话：</td>
              <td class="r">
                <empty name="records['real_name']">
                  <input type="text" class="txt" name="mobile_phone" value="{$records['mobile_phone']|default=''}">
                  <else/>
                  <input type="text" class="txt" name="mobile_phone" value="{$records['mobile_phone']|default=''}" readonly="readonly">
                  <span class="span-btn edit-btn">修改</span>
                  <span class="span-btn cancel-btn">取消</span>
                </empty>
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>联系地址</td>
              <td class="r1 table_select3">
                <div class="info">
                  <div style="display: flex;">
                    <select id="s_province" name="s_province" class="select_gallery"></select>  
                    <select id="s_city" name="s_city" class="select_gallery" style="margin-left: 10px;"></select>  
                    <select id="s_county" name="s_county" class="select_gallery" style="margin-left: 10px;"></select>
                    <input type="text" class="txt" name="s_address" style="margin-left: 10px;width: 300px;" value="{$records['address'][1][0]|default=''}" placeholder="详细地址">

                    <script class="resources library" src="__STATIC__/provincecityarea/area1.js" type="text/javascript"></script>
                    <script type="text/javascript">
                        var pro ="{$records['address'][0]['0']|default=''}";
                        var city ="{$records['address'][0]['1']|default=''}";
                        var are ="{$records['address'][0]['2']|default=''}";
                        _init_area(pro, city, are);
                    </script>
                  </div>
                  <div id="show"></div>
                </div>
                <script type="text/javascript">
                    var showArea = function() {
                        $('#show').innerHTML = "<h3>省" + $('#s_province').value + " - 市" +
                            $('#s_city').value + " - 县/区" +
                            $('#s_county').value + "</h3>"
                    }
                    $('#s_county').attr('onchange', 'showArea()');
                </script>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>邮箱：</td>
              <td class="r">
                <input type="text" class="txt" name="email" value="{$records['email']|default=''}">
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>账户类型：</td>
              <td class="r table_radio">
                        <span class="form_radio table_btn">
                            <label>
                                <input type="radio"  value="1" name="account_type" <eq name="records['account_type']" value="1">checked="checked"</eq>>公司
                            </label >
                            <label>
                                <input type="radio"  value="2" name="account_type" <eq name="records['account_type']" value="2">checked="checked"</eq>>个人
                            </label>
                        </span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>开户银行：</td>
              <td class="r">
                <input type="text" class="txt" name="bank_name" value="{$records['bank_name']|default=''}">
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>银行户名：</td>
              <td class="r">
                <input type="text" class="txt" name="bank_account" value="{$records['bank_account']|default=''}">
                <span class="notice-text"></span>
              </td>
            </tr>
            <tr>
              <td class="l"><i class="mustmark">*</i>银行账号：</td>
              <td class="r">
                <input type="text" class="txt" name="bank_card" value="{$records['bank_card']|default=''}">
                <span class="notice-text"></span>
              </td>
            </tr>
            </tbody>
          </table>
        </div>
        <input type="hidden" name="id" id="id" value="{$records['id']|default=''}" />

        <div class="form-item cf">
          <button class="submit_btn ajax-post mlspacing" id="submit" type="submit" target-form="form-horizontal">
            审核
          </button>
          <a class="submit_btn " alt="返回上一页" title="返回上一页" href="javascript:window.history.back();" >
            返回
          </a>
        </div>
      </form>
    </div>
  </div>

  <div class="common_settings">
    <span class="plus_icon"><span><img src="__IMG__/zwmimages/icon_jia.png"></span></span>
    <form class="addShortcutIcon">
      <input type="hidden" name="title" value="{$m_title}">
      <input type="hidden" name="url" value="Promote/lists/type/1">
    </form>
    <a class="ajax-post add-butn <notempty name='commonset'>addSIsetted</notempty>" href="javascript:;" target-form="addShortcutIcon" url="{:U('Think/addShortcutIcon')}"><img src="__IMG__/zwmimages/icon_jia.png"><span><notempty name='commonset'>已添加<else />添加至常用设置</notempty></span></a>
  </div>

</block>

<block name="script">
  <link href="__STATIC__/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
  <php>if(C('COLOR_STYLE')=='blue_color') echo '<link href="__STATIC__/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">';</php>
  <link href="__STATIC__/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
  <script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
  <script type="text/javascript" src="__STATIC__/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
  <script type="text/javascript">
      //导航高亮
      highlight_subnav("{:U('Promote/lists')}");
      $(".select_gallery").select2();

      $(function() {
          showTab();

          $('.edit-btn').click(function () {
              var thisInput = $(this).prev();
              thisInput.val('');
              thisInput.removeAttr('readonly');
              thisInput.focus();
              $(this).hide();
              $(this).next().show();
          });

          $('.cancel-btn').click(function () {
              var thisInput = $(this).parent().children('input');
              switch (thisInput.attr('name')) {
                  case 'real_name':
                      thisInput.val("{$records['real_name']}");
                      break;
                  case 'idcard':
                      thisInput.val("{$records['idcard']}");
                      break;
                  case 'mobile_phone':
                      thisInput.val("{$records['mobile_phone']}");
                      break;
              }

              thisInput.attr('readonly', 'readonly');
              $(this).hide();
              $(this).prev().show();
          });
      });

      var userInfo = {userId:"kazaff", md5:"",icon:1};   //用户会话信息
  </script>
  <script>
      var uploaderIdCarPic = WebUploader.create({
          // 选完文件后，是否自动上传。
          auto: true,
          // swf文件路径
          swf: '__STATIC__/webuploader/Uploader.swf',
          // 文件接收服务端。
          server: "{:U('File/uploadPictureNotLimit', array('session_id'=>session_id(), 'flag'=>true))}",
          // 选择文件的按钮。可选。
          // 内部根据当前运行是创建，可能是input元素，也可能是flash.
          pick: {
              id:'#idcarpic',
              multiple:true
          },
          paste: document.body,
          accept: {
              title: '图片',
              extensions: 'png,gif,jpg,jpeg,bmp',
              mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
          },
          // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
          resize: false,
          disableGlobalDnd: true,
          fileNumLimit:2,
          threads:5,
          thumb:true,
          compress:false,
          prepareNextFile: true,
          formData: function(){return $.extend(true, {}, userInfo);},
          chunked:false,
          duplicate: true
      });

      var imgIdCarPicData = [];
      var imgIdCarPicList = $("#idcarpic_thelist");
      uploaderIdCarPic.on( 'fileQueued', function( file ) {
          var html = '';
          html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info">' + file.name + '</h4>';
          html += '<p class="state">等待上传...</p>';
          html += '</div>';

          imgIdCarPicList.append(html);
          imgIdCarPicList.css('margin-top','10px');

          var img2 = imgIdCarPicList.children('#'+file.id).find('img');
          uploaderIdCarPic.makeThumb(file, function (error, src) {
              if (error) {
                  return;
              }
              img2.attr('src', src);
          }, 300, 300);
      });

      // 文件上传过程中创建进度条实时显示。
      uploaderIdCarPic.on( 'uploadProgress', function( file, percentage ) {
          var $li = $( '#'+file.id ),
              $percent = $li.find('.progress .progress-bar');
          // 避免重复创建
          if ( !$percent.length ) {
              $percent = $('<div class="progress progress-striped active">' +
                  '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                  '</div>' +
                  '</div>').appendTo( $li ).find('.progress-bar');
          }

          $li.find('p.state').text('上传中');
          $percent.css( 'width', percentage * 100 + '%' );
          $percent.text( (percentage * 100).toFixed(0) + '%' );
      });

      uploaderIdCarPic.on( 'uploadSuccess', function( file , response) {
          imgIdCarPicData.push(Number(response.id));
          setIconVal();
          console.log(response)

          $( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
          //alert(JSON.stringify(response));
          $('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
          $('#'+file.id).find('.jsdelzip').on('click',function() {
              uploaderIdCarPic.removeFile( file.id );
              $('#'+file.id).remove();

              $.each(imgIdCarPicData,function(index, item) {
                  if (response.id == item) {
                      imgIdCarPicData.splice(index,1);
                      return false;
                  }
              });
              setIconVal();

              return false;
          });

          if (response.status == 1001) {
              return false;
              alert('图片大小不得超过2M');
              $('#idcarpic_thelist').children().last().remove();
              location.reload()
          }
      });

      function setIconVal()
      {
          var icon = '';
          $.each(imgIdCarPicData,function(index, item) {
              icon += item + ',';
          });
          icon = icon.substring(0, icon.length - 1);
          $('input[name=idcarpic]').val(icon);
      }

      <?php if (!empty($records['idcarpic_array'])) :?>
      var html = '';
      $('#idcarpic_thelist').css('margin-top','10px');
      <?php foreach ($records['idcarpic_array'] as $value3) { ?>
      <?php $value3 = (int)$value3; ?>
          imgIdCarPicData.push(<?=$value3?>);

          html += '<div id="' + <?=$value3?> + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="<?=get_cover($value3,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info" style="text-align: center;">';
          html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value3?> + '">删除</a>';
          html += '</h4>';
          html += '<div class="progress progress-striped active" style="display: none;">';
          html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
          html += '</div>';
          html += '</div>';
      <?php }?>
      $('#idcarpic_thelist').html(html);

      $('#idcarpic_thelist').children().children('h4').children('.jsdelzip').on('click', function() {
          var thisId = $(this).attr('img-id');
          $(this).parent().parent().remove();

          $.each(imgIdCarPicData,function(index, item) {
              if (thisId == item) {
                  imgIdCarPicData.splice(index,1);
                  return false;
              }
          });

          setIconVal();
      });
      <?php endif ;?>
  </script>
  <script>
      var uploaderImgbusinesspic = WebUploader.create({
          // 选完文件后，是否自动上传。
          auto: true,
          // swf文件路径
          swf: '__STATIC__/webuploader/Uploader.swf',
          // 文件接收服务端。
          server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
          // 选择文件的按钮。可选。
          // 内部根据当前运行是创建，可能是input元素，也可能是flash.
          pick: {
              id:'#businesspic',
              multiple:true
          },
          // dnd: false,
          paste: document.body,
          accept: {
              title: '图片',
              extensions: 'png,gif,jpg,jpeg,bmp',
              mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
          },
          // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
          resize: false,
          disableGlobalDnd: true,
          fileNumLimit:5,
          threads:5,
          thumb:true,
          compress:false,
          prepareNextFile: true,
          formData: function(){return $.extend(true, {}, userInfo);},
          chunked:false,
          duplicate: true
      });

      var imgListbusinesspicData = [];
      var thisIndex1 = 0;
      var imgbusinesspicList = $("#businesspic_thelist");
      uploaderImgbusinesspic.on( 'fileQueued', function( file ) {
          var html = '';
          html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info">' + file.name + '</h4>';
          html += '<p class="state">等待上传...</p>';
          html += '</div>';

          imgbusinesspicList.append(html);
          imgbusinesspicList.css('margin-top','10px');

          var img1 = imgbusinesspicList.children('#'+file.id).find('img');
          uploaderImgbusinesspic.makeThumb(file, function (error, src) {
              if (error) {
                  return;
              }
              img1.attr('src', src);
          }, 300, 300);
      });

      // 文件上传过程中创建进度条实时显示。
      uploaderImgbusinesspic.on( 'uploadProgress', function( file, percentage ) {
          var $li = $( '#'+file.id ),
              $percent = $li.find('.progress .progress-bar');
          // 避免重复创建
          if ( !$percent.length ) {
              $percent = $('<div class="progress progress-striped active">' +
                  '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                  '</div>' +
                  '</div>').appendTo( $li ).find('.progress-bar');
          }

          $li.find('p.state').text('上传中');
          $percent.css( 'width', percentage * 100 + '%' );
          $percent.text( (percentage * 100).toFixed(0) + '%' );
      });

      uploaderImgbusinesspic.on( 'uploadSuccess', function( file , response) {
          imgListbusinesspicData.push(Number(response.id));
          setbusinesspicVal();
          console.log(response)

          $( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
          //alert(JSON.stringify(response));
          $('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
          $('#'+file.id).find('.jsdelzip').on('click',function() {
              uploaderImgbusinesspic.removeFile( file.id );
              $('#'+file.id).remove();

              $.each(imgListbusinesspicData,function(index, item) {
                  if (response.id == item) {
                      imgListbusinesspicData.splice(index,1);
                      return false;
                  }
              });
              setbusinesspicVal();

              return false;
          });
      });

      function setbusinesspicVal()
      {
          var businesspic = '';
          $.each(imgListbusinesspicData,function(index, item) {
              businesspic += item + ',';
          });
          businesspic = businesspic.substring(0, businesspic.length - 1);
          $('input[name=businesspic]').val(businesspic);
      }

      <?php if (!empty($records['businesspic_array'])) :?>
      var html = '';
      $('#businesspic_thelist').css('margin-top','10px');
      <?php foreach ($records['businesspic_array'] as $value1) { ?>
      <?php $value1 = (int)$value1; ?>
          imgListbusinesspicData.push(<?=$value1?>);

          html += '<div id="' + <?=$value1?> + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="<?=get_cover($value1,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info" style="text-align: center;">';
          html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value1?> + '">删除</a>';
          html += '</h4>';
          html += '<div class="progress progress-striped active" style="display: none;">';
          html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
          html += '</div>';
          html += '</div>';
      <?php }?>
      $('#businesspic_thelist').html(html);

      $('#businesspic_thelist').children().children('h4').children('.jsdelzip').on('click', function() {
          var thisId = $(this).attr('img-id');
          $(this).parent().parent().remove();

          $.each(imgListbusinesspicData,function(index, item) {
              if (thisId == item) {
                  imgListbusinesspicData.splice(index,1);
                  return false;
              }
          });
          setbusinesspicVal();
      });
      <?php endif ;?>
  </script>
  <script>
      var uploaderImgagreementpic = WebUploader.create({
          // 选完文件后，是否自动上传。
          auto: true,
          // swf文件路径
          swf: '__STATIC__/webuploader/Uploader.swf',
          // 文件接收服务端。
          server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
          // 选择文件的按钮。可选。
          // 内部根据当前运行是创建，可能是input元素，也可能是flash.
          pick: {
              id:'#agreementpic',
              multiple:true
          },
          // dnd: false,
          paste: document.body,
          accept: {
              title: '图片',
              extensions: 'png,gif,jpg,jpeg,bmp',
              mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
          },
          // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
          resize: false,
          disableGlobalDnd: true,
          fileNumLimit:5,
          threads:5,
          thumb:true,
          compress:false,
          prepareNextFile: true,
          formData: function(){return $.extend(true, {}, userInfo);},
          chunked:false,
          duplicate: true
      });

      var imgListagreementpicData = [];
      var thisIndex1 = 0;
      var imgagreementpicList = $("#agreementpic_thelist");
      uploaderImgagreementpic.on( 'fileQueued', function( file ) {
          var html = '';
          html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info">' + file.name + '</h4>';
          html += '<p class="state">等待上传...</p>';
          html += '</div>';

          imgagreementpicList.append(html);
          imgagreementpicList.css('margin-top','10px');

          var img1 = imgagreementpicList.children('#'+file.id).find('img');
          uploaderImgagreementpic.makeThumb(file, function (error, src) {
              if (error) {
                  return;
              }
              img1.attr('src', src);
          }, 300, 300);
      });

      // 文件上传过程中创建进度条实时显示。
      uploaderImgagreementpic.on( 'uploadProgress', function( file, percentage ) {
          var $li = $( '#'+file.id ),
              $percent = $li.find('.progress .progress-bar');
          // 避免重复创建
          if ( !$percent.length ) {
              $percent = $('<div class="progress progress-striped active">' +
                  '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                  '</div>' +
                  '</div>').appendTo( $li ).find('.progress-bar');
          }

          $li.find('p.state').text('上传中');
          $percent.css( 'width', percentage * 100 + '%' );
          $percent.text( (percentage * 100).toFixed(0) + '%' );
      });

      uploaderImgagreementpic.on( 'uploadSuccess', function( file , response) {
          imgListagreementpicData.push(Number(response.id));
          setagreementpicVal();
          console.log(response);

          $( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
          //alert(JSON.stringify(response));
          $('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
          $('#'+file.id).find('.jsdelzip').on('click',function() {
              uploaderImgagreementpic.removeFile( file.id );
              $('#'+file.id).remove();

              $.each(imgListagreementpicData,function(index, item) {
                  if (response.id == item) {
                      imgListagreementpicData.splice(index,1);
                      return false;
                  }
              });
              setagreementpicVal();

              return false;
          });
      });

      function setagreementpicVal()
      {
          var agreementpic = '';
          $.each(imgListagreementpicData,function(index, item) {
              agreementpic += item + ',';
          });
          agreementpic = agreementpic.substring(0, agreementpic.length - 1);
          $('input[name=agreementpic]').val(agreementpic);
      }

      <?php if (!empty($records['agreementpic_array'])) :?>
      var html = '';
      $('#agreementpic_thelist').css('margin-top','10px');
      <?php foreach ($records['agreementpic_array'] as $value1) { ?>
      <?php $value1 = (int)$value1; ?>
          imgListagreementpicData.push(<?=$value1?>);

          html += '<div id="' + <?=$value1?> + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="<?=get_cover($value1,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info" style="text-align: center;">';
          html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value1?> + '">删除</a>';
          html += '</h4>';
          html += '<div class="progress progress-striped active" style="display: none;">';
          html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
          html += '</div>';
          html += '</div>';
      <?php }?>
      $('#agreementpic_thelist').html(html);

      $('#agreementpic_thelist').children().children('h4').children('.jsdelzip').on('click', function() {
          var thisId = $(this).attr('img-id');
          $(this).parent().parent().remove();

          $.each(imgListagreementpicData,function(index, item) {
              if (thisId == item) {
                  imgListagreementpicData.splice(index,1);
                  return false;
              }
          });
          setagreementpicVal();
      });
      <?php endif ;?>
  </script>
  <script>
      var uploaderImganothpic = WebUploader.create({
          // 选完文件后，是否自动上传。
          auto: true,
          // swf文件路径
          swf: '__STATIC__/webuploader/Uploader.swf',
          // 文件接收服务端。
          server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
          // 选择文件的按钮。可选。
          // 内部根据当前运行是创建，可能是input元素，也可能是flash.
          pick: {
              id:'#anothpic',
              multiple:true
          },
          // dnd: false,
          paste: document.body,
          accept: {
              title: '图片',
              extensions: 'png,gif,jpg,jpeg,bmp',
              mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
          },
          // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
          resize: false,
          disableGlobalDnd: true,
          fileNumLimit:5,
          threads:5,
          thumb:true,
          compress:false,
          prepareNextFile: true,
          formData: function(){return $.extend(true, {}, userInfo);},
          chunked:false,
          duplicate: true
      });

      var imgListanothpicData = [];
      var thisIndex1 = 0;
      var imganothpicList = $("#anothpic_thelist");
      uploaderImganothpic.on( 'fileQueued', function( file ) {
          var html = '';
          html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info">' + file.name + '</h4>';
          html += '<p class="state">等待上传...</p>';
          html += '</div>';

          imganothpicList.append(html);
          imganothpicList.css('margin-top','10px');

          var img1 = imganothpicList.children('#'+file.id).find('img');
          uploaderImganothpic.makeThumb(file, function (error, src) {
              if (error) {
                  return;
              }
              img1.attr('src', src);
          }, 300, 300);
      });

      // 文件上传过程中创建进度条实时显示。
      uploaderImganothpic.on( 'uploadProgress', function( file, percentage ) {
          var $li = $( '#'+file.id ),
              $percent = $li.find('.progress .progress-bar');
          // 避免重复创建
          if ( !$percent.length ) {
              $percent = $('<div class="progress progress-striped active">' +
                  '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                  '</div>' +
                  '</div>').appendTo( $li ).find('.progress-bar');
          }

          $li.find('p.state').text('上传中');
          $percent.css( 'width', percentage * 100 + '%' );
          $percent.text( (percentage * 100).toFixed(0) + '%' );
      });

      uploaderImganothpic.on( 'uploadSuccess', function( file , response) {
          imgListanothpicData.push(Number(response.id));
          setanothpicVal();
          console.log(response);

          $( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
          //alert(JSON.stringify(response));
          $('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
          $('#'+file.id).find('.jsdelzip').on('click',function() {
              uploaderImganothpic.removeFile( file.id );
              $('#'+file.id).remove();

              $.each(imgListanothpicData,function(index, item) {
                  if (response.id == item) {
                      imgListanothpicData.splice(index,1);
                      return false;
                  }
              });
              setanothpicVal();

              return false;
          });
      });

      function setanothpicVal()
      {
          var anothpic = '';
          $.each(imgListanothpicData,function(index, item) {
              anothpic += item + ',';
          });
          anothpic = anothpic.substring(0, anothpic.length - 1);
          $('input[name=anothpic]').val(anothpic);
      }

      <?php if (!empty($records['anothpic_array'])) :?>
      var html = '';
      $('#anothpic_thelist').css('margin-top','10px');
      <?php foreach ($records['anothpic_array'] as $value1) { ?>
      <?php $value1 = (int)$value1; ?>
          imgListanothpicData.push(<?=$value1?>);

          html += '<div id="' + <?=$value1?> + '" class="item" style="margin-right: 10px;">';
          html += '<a href="javascript:;"><img src="<?=get_cover($value1,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
          html += '<h4 class="info" style="text-align: center;">';
          html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value1?> + '">删除</a>';
          html += '</h4>';
          html += '<div class="progress progress-striped active" style="display: none;">';
          html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
          html += '</div>';
          html += '</div>';
      <?php }?>
      $('#anothpic_thelist').html(html);

      $('#anothpic_thelist').children().children('h4').children('.jsdelzip').on('click', function() {
          var thisId = $(this).attr('img-id');
          $(this).parent().parent().remove();

          $.each(imgListanothpicData,function(index, item) {
              if (thisId == item) {
                  imgListanothpicData.splice(index,1);
                  return false;
              }
          });
          setanothpicVal();
      });
      <?php endif ;?>
  </script>
</block>