<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
    />
    <meta
      name="format-detection"
      content="telephone=no,email=no,date=no,address=no"
    />
    <title></title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" href="../../css/projeck.css" />
    <style>
      body,
      html {
        /*background: #F3F3F3;*/
        background: rgba(243, 243, 243, 1);
        position: relative;
      }

      .api_layout {
        /*border-top: 1px solid #37b0e9;*/
        padding: 13px 10px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
      }
      /*车辆总数 和地下车辆总数*/

      .header_car_number {
        color: #fff;
        font-size: 16px;
        font-weight: 700;
      }

      .header_car_number ul {
        display: flex;
        justify-content: space-between;
      }

      .header_car_number ul li {
        border-radius: 10px;
        text-align: center;
        width: 48%;
        padding: 12px 8px;
      }

      .header_car_number ul li:first-child {
        background: rgba(230, 126, 34, 1);
      }

      .header_car_number ul li:last-child {
        background: rgba(39, 174, 96, 1);
      }
      /*车辆数据列表*/

      .car_list {
        background: rgba(255, 255, 255, 1);
        border-radius: 10px;
        margin: 10px 0 10px 0;
      }
      /*头部车辆图片 车牌号 速度等信息*/

      .header_container {
        display: flex;
        justify-content: space-between;
        border-bottom: solid 1px #ecf0f1;
      }

      .header_container_item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 7px 5px 5px 11px;
        /*padding: 7px 12px;*/
      }

      .car_image {
        width: 38px;
        height: 38px;
      }

      .registration_number {
        padding-left: 9px;
        font-size: 16px;
        font-weight: 700;
        color: rgba(35, 38, 39, 1);
      }

      .speed_image {
        width: 22px;
        height: 22px;
      }

      .speed {
        font-weight: bold;
        color: rgba(46, 204, 113, 1);
        padding-left: 5px;
      }

      .right_arrow {
        width: 12px;
        height: 22px;
        margin-left: 10px;
        display: flex;
        align-items: center;
      }
      /*巷口信息*/

      .center_container {
        display: flex;
        background: rgba(0, 159, 232, 1);
        align-items: center;
        border-radius: 37px;
        margin: 12px;
        color: #fff;
      }

      .center_container ul {
        padding: 7px 0 7px 12px;
        display: flex;
      }

      .position_img {
        display: flex;
        align-items: center;
        width: 22px;
        height: 22px;
      }
      /*车辆具体信息*/

      .footer_container {
        margin: 12px;
      }

      .footer_container ul {
        display: flex;
        justify-content: space-between;
      }

      .footer_container ul:last-child {
        padding: 12px 0;
      }

      .footer_container ul li {
        display: flex;
        font-size: 14px;
        color: rgba(108, 111, 116, 1);
      }
      /*一键叫车*/

      .One_click_call {
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        bottom: -85%;
        left: 0;
        right: 0;
        top: 0;
        margin: auto;
        height: 37px;
        width: 120px;
        padding: 0 12px;
        background: rgba(46, 204, 113, 1);
        border-radius: 47px;
        color: #ffffff;
        z-index: 100;
      }

      .One_click_call_container {
        width: 17px;
        height: 21px;
      }
    </style>
  </head>

  <body>
    <div class="api_layout">
      <div id="rubberTyredcarContainer"></div>
    </div>
    <div class="One_click_call" onclick="Oneclickcall()">
      <div class="One_click_call_container">
        <img src="../../image/Oneclickcall.png" alt="" />
      </div>
      <div>一键叫车</div>
    </div>
  </body>
</html>
<!-- 仓库页面 -->
<script id="rubberTyredcarView" type="text/template">
  <div class="header_car_number">
      <ul>
          <li>
              <div>地面总车辆数</div>
              <div>{{=it.groundCarCount}}辆</div>
          </li>
          <li>
              <div>井下总车辆数</div>
              <div>{{=it.pitCarCount}}辆</div>
          </li>
      </ul>
  </div>

  {{ for (var i=0; i
  <it.carList.length; i++) { }} <div class="car_list" onclick="openDetails('{{=it.carList[i].CarUserNo}}','{{=it.carList[i].InterzoneNo}}','{{=it.carList[i].Pageid}}')">
      <div class="header_container">
          <div class="header_container_item">
              {{? it.carList[i].CarType == '人车'}}
              <div class="car_image"><img src="../../image/ManCar.png" alt=""></div>
              {{?? it.carList[i].CarType == '特种车'}}
              <div class="car_image"><img src="../../image/SpecialCar.png" alt=""></div>
              {{?? it.carList[i].CarType == '防爆指挥车'}}
              <div class="car_image"><img src="../../image/ExplosionproofCar.png" alt=""></div>
              {{?? it.carList[i].CarType == '货车'}}
              <div class="car_image"><img src="../../image/TruckCar.png" alt=""></div>
              {{?? it.carList[i].CarType == '低污染皮卡车'}}
              <div class="car_image"><img src="../../image/LowpollutionCar.png" alt=""></div>
              {{?}}
              <div class="registration_number">{{=it.carList[i].CarUserNo}}</div>
          </div>
          <div class="header_container_item">
              <div class="speed_image"><img src="../../image/speed.png" alt=""></div>
              <div class="speed">{{=it.carList[i].AvgSpeed}}km/h</div>
              <div class="right_arrow"><img src="../../image/more.png" alt=""></div>
          </div>
      </div>
      <div class="center_container">
          <ul>
              <li class="position_img"><img src="../../image/position.png" alt=""></li>
              <li class="alley_name">{{=it.carList[i].InterzoneName}}</li>
          </ul>
      </div>
      <div class="footer_container">
          <ul>
              <li>
                  <div>车辆型号：</div>
                  <div> {{=it.carList[i].CarModel}} </div>
              </li>
              <li>
                  <div>设备类型：</div>
                  <div>{{=it.carList[i].DeviceType}}</div>
              </li>
          </ul>
          <ul>
              <li>
                  <div>车辆类型：</div>
                  <div>{{=it.carList[i].CarType}}</div>
              </li>
              <li>
                  <div>平均速度：</div>
                  <div>{{=it.carList[i].AvgSpeed}}</div>
              </li>
          </ul>
      </div>
      </div>
      {{ } }}
</script>

<script type="text/javascript" src="../../script/api.js"></script>
<script src="../../script/doT.min.js" charset="utf-8"></script>
<script src="../../script/config.js" charset="utf-8"></script>
<script type="text/javascript"></script>

<script>
  var toast = new auiToast();
  apiready = function () {
    getrubberTyredCarList();
  };

  function getrubberTyredCarList() {
    $http.fnReuestDataNologing(
      zaoquanUrlRouter.rubberTyredCarList,
      '',
      'get',
      '',
      function (ret, err) {
        // console.log(JSON.stringify());
        if (ret.code == 0) {
          $apis.html(rubberTyredcarContainer, '#rubberTyredcarView', ret.data);
        }
      }
    );
  }

  function openDetails(CarUserNo, InterzoneNo, Pageid) {
    const pageParams = {
      CarUserNo: CarUserNo,
      InterzoneNo: InterzoneNo,
      Pageid: Pageid,
    };
    $event.openTabLayout(
      'rubberTypedCarDetails',
      '../productionData/rubberTypedCarDetails',
      CarUserNo,
      pageParams
    );
  }

  function Oneclickcall() {
    api.call({
      type: 'tel_prompt',
      number: '8811',
    });
  }
</script>
