<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
  <meta name="screen-orientation" content="portrait">
  </meta>
  <meta name="x5-orientation" content="portrait">
  </meta>
  <title>意见调查详情</title>
  <style>
    body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } 
    h1, h2, h3, h4, h5, h6{ font-size:100%; } 
    address, cite, dfn, em, var { font-style:normal; } 
    code, kbd, pre, samp { font-family:couriernew, courier, monospace; } 
    small{ font-size:12px; } 
    ul, ol { list-style:none; } 
    a { text-decoration:none; } 
    a:hover { text-decoration:underline; } 
    sup { vertical-align:text-top; } 
    sub{ vertical-align:text-bottom; } 
    legend { color:#000; } 
    fieldset, img { border:0; } 
    button, input, select, textarea { font-size:100%; } 
    table { border-collapse:collapse; border-spacing:0; }
    *{
      color: #5b5653;
    }
    .main{
      padding: 1.5rem;
    }
    .tit{
      font-size: 2rem;
      text-align: center;
      margin-bottom: .5rem;
    }
    .sub_tit{
      font-size: 1.4rem;
      margin-bottom: .4rem;
    }
    .indet_2{
      text-indent: 2.4rem;
    }
    .tit_det{
      text-indent: 2.4rem;
      font-size: 1rem;
    }
    table{
      margin-top: 2.5rem;
      width: 100%;
    }
    tr td{
      padding: .5rem;
      border: 1px solid #5b5653;
      font-size: 1rem;
    }
    #LeaderName{
      /* width: 2rem; */
    }
    .qianming{
      margin-top: 2.5rem;
      display: flex;
      justify-content: space-between;
    }
    .qianming label{
      margin-right: .2rem;
    }
    .main{
      width: 720px;
      margin: 0 auto;
      margin-top: -50px;
    }
    #table td,.qianming span{
      color: #111;
    }
    #table td._name,.qianming label{
      color: #5d5d5d;
    }
    .top-img img{
      width: 100%;
    }
  </style>
</head>
<body>
  <div class="top-img">
    <img src="../images/invesDetails2-bg.png" alt="">
  </div>
  <div class="main">
    <p class="tit">印象旅游服务意见表</p>
    <div class="message-box">
      <p class="sub_tit">亲爱的旅客:</p>
      <div class="tit_det">
        <p>感谢与您同行,让我们的旅行更加圆满!</p>
        <p>我们十分珍视倾听您的声音。它将是我们改善服务的重要基础。</p>
        <p>最后,需要您花一点点时间填写此表。诚挚地感谢您!</p>
      </div>
    </div>
    <div class="">
      <table id="table">
        <tr>
          <td class="_name">线路:</td>
          <td id="LineName"></td>
          <td class="_name">出发时间:</td>
          <td id="StartDateStr"></td>
          <td class="_name">领队:</td>
          <td width="80" id="LeaderName">刘德华</td>
        </tr>
        <tr>
          <td class="_name">您的报名公司:</td>
          <td id="BranchName"></td>
          <td class="_name">报名接待员:</td>
          <td id="ContactName"></td>
          <td class="_name">专业度及服务评价:</td>
          <td></td>
        </tr>
        <tr>
          <td class="_name">旅客意见</td>
          <td class="_name">非常满意</td>
          <td class="_name">满意</td>
          <td class="_name">基本合格</td>
          <td class="_name">不满意</td>
          <td class="_name">评价</td>
        </tr>
      </table>
    </div>
    <div class="qianming">
      <label class="_name">旅客签名:<span id="name"></span></label>
      <label class="_name">手机:<span id="phone"></span></label>
      <label class="_name">日期:<span id="day"></span></label>
    </div>
  </div>
  <script type="text/javascript" src="../js/jquery-1.10.2.js"></script>
  <script type="text/javascript" src="../js/md5.js"></script>
  <script type="text/javascript" src="../js/layer/layer.js"></script>
  <script type="text/javascript" src="../js/mian.js"></script>
  <script>
    var str = location.href; //取得整个地址栏
    var param = str.substr(str.indexOf("?")+1);
    let html = '';
    param  = param.split('&')
    let ID = param[0].split('=')[1],
    name = decodeURI(param[1].split('=')[1]),
    phone = param[2].split('=')[1]; 
    $.ajax({  
      type: "POST",
      url: `${getApiUrl().urlPost}`,
      contentType: "application/json",
      data: getAjaxData('survey_post_GetGuestSurveyDetails', {SurveyID: ID}),
      async: false,
      success: function (res) {
        if (res.resultCode === 1) {
          let data = res.data;
          $("#LineName").text(data.obj.LineName)
          $("#StartDateStr").text(data.obj.StartDateStr)
          $("#LeaderName").text(data.obj.LeaderName ? data.obj.LeaderName : '')
          $("#BranchName").text(data.obj.ContactName.split('(')[0])
          $("#ContactName").text(data.obj.ContactName.split('(')[1].split(')')[0])
          $("#name").text(name)
          $("#phone").text(phone)
          $("#day").text(data.surverList[0].CreateDate.split('T')[0].replace(/-/g,'.'))
          let SurveyType1 = [],
          SurveyType2 = []
          for (let i = 0; i < data.surverList.length; i++) {
            if (data.surverList[i].SurveyType === 1) {
              SurveyType1.push(data.surverList[i])
            } else {
              SurveyType2.push(data.surverList[i])
            }
          }
          for (let i = 0; i < SurveyType1.length; i++) {
            html += `<tr>
        <td>${SurveyType1[i].Title}</td>
        <td>${SurveyType1[i].ScoreNum === 5 ? '√' : '' }</td>
        <td>${SurveyType1[i].ScoreNum === 4 ? '√' : '' }</td>
        <td>${SurveyType1[i].ScoreNum === 3 ? '√' : '' }</td>
        <td>${SurveyType1[i].ScoreNum === 2 || SurveyType1[i].ScoreNum === 1 ? '√' : '' }</td>
        <td>无</td>
      </tr>`
          }
          
          for (let i = 0; i < SurveyType2.length; i++) {
            if (SurveyType2[i].Title.indexOf('自费') !== -1) {
              html += `<tr>
        <td colspan="6">
          <p>您参加的自费项目有:</p>
          <p class="indet_2">${SurveyType2[i].TextContent}</p>
        </td>
      </tr>`
            }
            if (SurveyType2[i].Title.indexOf('建议') !== -1) {
              html += `<tr>
        <td colspan="6">
          <p>您给印象旅游的评价及建议:</p>
          <p class="indet_2">${SurveyType2[i].TextContent}</p>
        </td>
      </tr>`
            }
            if (SurveyType2[i].Title.indexOf('想去') !== -1) {
              html += `<tr>
        <td colspan="6">
          <p>您下次出游最想去哪里?</p>
          <p class="indet_2">${SurveyType2[i].TextContent}</p>
        </td>
      </tr>`
            }
            if (SurveyType2[i].Title.indexOf('优先考虑') !== -1) {
              html += `<tr>
        <td colspan="6">
          <p>下次出游是否优先考虑印象产品?</p>
          <p class="indet_2">${SurveyType2[i].TextContent}</p>
        </td>
      </tr>`
            }
          }
          html += `<tr>
        <td>
          <p>备注</p>
        </td>
        <td  colspan="5">
          本表是旅游团队服务的衡量标准。请妥善填写!谢谢合作!
        </td>
      </tr>`
          $("#table").append(html)
        }
      },
      error: function (res) {

      }
    });
  </script>
</body>
</html>