<!doctype html>
<html class="no-js">
<head>

  <include file="Common/head" />
  <style type="text/css">
    a.am-text-secondary:visited{color:#3bb4f2;}
    a.am-text-danger:visited{color:#dd514c;}
    .am-btn-default {background-color: #fff;}
    th {text-align:center;}
    tr td{text-align:center;}
    select{padding: 4px;border: 1px solid #ccc;}
    .am-popup-bd {background:#fff;}
    .am-popup-bd img {max-width: 100%}
    .am-u-sm-2 {border-top: 1px solid #ddd;margin-top: 10px;}
    .am-u-sm-10 {border-left: 1px solid #ddd;margin-top: 10px;}
    .am-table>tbody>tr>td.user-info {padding: 1px;text-align: left;}
    .am-table>tbody>tr>td.user-info img{height: 42px}
    myred{color:#dd514c;}
    mygreen {color:#1aad19;}
    mygery {color:#999;}
    .wxgreen {color:#1aad19;}
    .search-div.am-input-group .am-form-field{width:120px;float: right;}
    .search-div select {float: right;}
    .ttt-switch {margin: 0 auto;}
    .am-form select{
      font-size: 1.2rem;
      border-color: #e6e6e6;
      width: unset;
      padding: .5em 2em .5em 1em;
      margin: 0 auto;
    }
    .am-table>tbody>tr>td.td-img {
      padding: 1px;
      text-align: left;
      padding-left: 10px;
    }
    .am-table>tbody>tr>td.td-img img {
      height: 56px;width: 56px;
    }
    .am-table>tbody>tr>td.td-img a {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 13vw;
      cursor: pointer;
    }
    .am-table>thead>tr>th {
      border-bottom: 0;
    }
    .am-table>tbody>tr:first-child>td {
      border-top: 0;
    }
    .am-table>thead.am-thead-hide>tr>th {
      padding: 0;
    }
    p {
      margin: 0;
    }
    .am-table>tbody>tr>td {
      vertical-align: middle;
      font-size: 1.4rem;
      line-height: 1.6rem;
      color: #444;
      background-color: #fdfdfd;
    }
    .format-price>p {
      display: table;
      width: 100%;
      text-align: right;
    }
    .format-price>p>span {
      display: table-cell;
      width: 50%;
      text-align: right;
    }
    .am-filter>.am-input-group:not(:first-child) {
      padding-top: 1.25rem;
    }
    .am-input-group-label.toumin {
      background-color: rgba(0,0,0,0);
      border: 0;
    }
    input[type=datetime-local].am-form-field {
      height: 33px;
    }
    .am-btn {
      font-size: 1.4rem;
    }
  </style>
  <style type="text/css">
    .shade_div {
      width:100%;
      height:100%;
      background-color:#000;
      filter:alpha(opacity=50);
      -moz-opacity:0.5;
      opacity:0.5;
      position:absolute;
      left:0px;
      top:0px;
      display:none;
      z-index:1000;
    }
    .float_div {
      width:200px;
      height:400px;
      position:absolute;
      background-color: #FFF;
      top:200px;
      left:50%;
      margin-left:-140px;
      display:none;
      z-index:1500;
    }
  </style>
</head>
<body>
<include file="Common/header" />

<div class="am-cf admin">

  <include file="Common/sidebar" nav="$nav" navv="$nav"/>

  <div class="content-page" style="background: white;">

    <div class="content" style="background: white;">
      <div class="admin-content-body">
        <div class="am-cf am-padding">
          <div class="am-fl am-cf">
            <strong class="am-text-primary am-text-lg">Product management</strong> /
            <small>List of Product</small>
          </div>
        </div>
        <hr style="margin-top:0px;">

        <div class="am-g">
          <div class="am-u-sm-12 am-u-md-4">
            <div class="am-btn-toolbar">
              <div class="am-btn-group am-btn-group-xs">
                <a class="am-btn am-btn-secondary" href="{:U('goods_op')}">
                  <span class="am-icon-plus"> Add Product </span></a>
              </div>

            </div>
          </div>
          <form class="am-form-group am-u-sm-12 am-u-md-8">
            <div class="am-input-group am-input-group-sm search-div">
              <input type="text" class="am-form-field" name="title" placeholder="Name/Model" value="{$_GET['title']}">
              <select name="type" style="width:100px;float:right;">
                <option value="">All Product</option>
                <option value="1">Enable</option>
                <option value="2">Disable</option>
              </select>
              <span class="am-input-group-btn">
            <button class="am-btn am-btn-default" type="submit">Search</button>
          </span>
              <script type="text/javascript">
                  $(function(){
                      <?php if($_GET[type]) echo '$("select[name=type]").val("'.$_GET[type].'");';?>
                  });
              </script>
            </div>
          </form>
        </div>
        <div style="margin-left: 20px;">Total Product:<a style="color: red;">    <?php echo $count; ?></a></div>
        <div class="am-g">
          <div class="am-u-sm-12">
            <form class="am-form am-scrollable-horizontal">
              <table class="am-table table-main am-text-nowrap">
                <thead>
                <tr>
                  <th width="5%">Sort</th>
                  <th width="5%">Product ID</th>
                  <th width="5%">Category</th>
                  <th width="1%">Picture </th>
                  <th width="10%" style="text-align: left;">Name</th>
                  <th width="3%">Appear at Homescreen</th>
                  <th width="5%">Price</th>
                  <th width="5%">QTY Restriction</th>
                  <th width="5%">Status</th>
                  <th width="5%">Action</th>
                </tr>
                </thead>
                <tbody>
                <if condition="!$list">
                  <tr><td colspan="16" style="text-align:center;">There's nothing here</td></tr>
                </if>
                <volist name="list" id="vo" key="k">
                  <tr>
                    <td>{$vo.seat_no}</td>
                    <td>{$vo.id}</td>
                    <td>{$vo.cat_name}</td>
                    <td class="td-img" ><img src="{$vo.img}" style="width:80px;height: 60px;"></td>
                    <td style="text-align: left;">{$vo.title}</td>
                    <td>
                       <?php
                    if($vo['home_show']== 2){
                      echo "<mygreen>Yes</mygreen>";
                      }else echo "<mygery>No</mygery>";
                      ?>
                    </td>
                    <td>{$vo.price}</td>
                    <td>{$vo.max_buy}</td>
                    <td>
                      <?php
                    if($vo['status']==1){
                      echo "<mygreen>Enable</mygreen>";
                      }else echo "<mygery>Disable</mygery>";
                      ?>
                    <td style="padding:.45rem;">
                      <a href="{:U('goods_op')}?op=edit&id={$vo.id}" class="am-btn am-btn-default am-btn-xs">Edit</a>
                    </td>
                  </tr>
                </volist>
                </tbody>
              </table>
            </form>
            <div class="am-cf">
              <div class="am-fr">
                {$page}
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

</div>
<include file="Common/footer" />
</body>

</html>