class Info {
  constructor() {
    this.getInfo();
  }

  async getInfo() {
    var res = await indexServe.info({
      url: query("url")
    });

    $(".cpc_c1 h2").text(res.title)
    $(".cpc_c1 .time").text(res.posttime)
    res.Statistics.forEach(v => {
      $(".yyinfos").append(`
        <li>
          <span>${v.title}</span>
          <div class="jdw">
            <div class="jd" style="${v.proportion}"></div>
          </div>
        </li>
      `)
    });

    res.stepInfo.arr.forEach(v => {
      $(".cpargsw").append(`
       <li>
        <div class="i" style="background-position: 0px ${v.position}px;"></div>
        <span>${v.title}</span>
       </li>
      `)
    });

    $(".show_more .text").text(res.stepInfo.message)

    $(".more span").click(function () {
      $(".show_more").css({
        height: 'auto'
      })
      $(".more").css({
        display: 'none'
      })
    });

    res.material.main.forEach(v => {
      $(".zhuliao .list").append(`
       <li>
          <div class="list_title">${v.title}</div>
          <div class="list_nums">${v.nums}</div>
        </li>
      `)
    })

    res.material.accessories.forEach(v => {
      $(".fuliao .list").append(`
       <li>
          <div class="list_title">${v.title}</div>
          <div class="list_nums">${v.nums}</div>
        </li>
      `)
    });


    res.DetailedSteps.forEach(v => {
      $(".info_list").append(`
       <li>
         ${
            v.step_img == null
            ? `<div class="dddd">${v.step_title}</div>`
            :  `<div class="info_top ${Array.isArray(v.step_img)? 'aa':''}">
                <img src="${Array.isArray(v.step_img) ? v.step_img[0] : v.step_img}" alt="">
                  <div class="setp">${v.step_title}</div>
              </div>`
          }
         
          ${
            Array.isArray(v.step_img)
            ? `<div class="change_list">
                ${
                  v.step_img.map((v,i) => {
                    return `<img src="${v}" alt="" style="opacity: ${i == 0 ? 1 : 0.5}">`
                  }).toString().replaceAll(",","")
                }
              </div>`
            : `<p>${v.step_text}</p>`
          }
        </li>
      `)
    })

    $(".change_list img").click(function () {
      $(this).css({
        opacity: 1
      }).siblings().css({
        opacity: 0.5
      })
      $(".aa img").attr({
        src: $(this).attr("src")
      })

    })

  }
}

new Info()