master

分支 (1)

管理

管理

master

StarPage
/
list.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>搜索结果页</title>
  <link rel="shortcut icon" href="./images/favicon.ico" type="image/x-icon" />
  <link rel="stylesheet" type="text/css" href="./css/index.css" />
  <link rel="stylesheet" type="text/css" href="./css/message.css" />
  <link rel="stylesheet" type="text/css" href="./css/list.css" />
  <link rel="stylesheet" type="text/css" href="./css/iconfont.css" />
  <link rel="stylesheet" type="text/css" href="./css/theme-chalk/index.css" />
  <link rel="stylesheet" type="text/css" href="https://unpkg.com/browse/element-ui@2.10.1/lib/theme-chalk/fonts/element-icons.ttf"/>
  <link rel="stylesheet" type="text/css" href="https://unpkg.com/browse/element-ui@2.10.1/lib/theme-chalk/fonts/element-icons.woff"/>


  <script type="text/javascript" src="./js/jQuery/jquery-3.1.1.js"></script>

  <script type="text/javascript" src='./js/vue.js'></script>
  <script type="text/javascript" src='./js/element-ui/index.js'></script>
  <script type='text/javascript' src='./js/axios.min.js'></script>


</head>

<body>
  <div id='app_list'>
    <!--头部菜单-->
    <div id="top-menu">
      <div id="top">
        <!--右部菜单-->
        <ul id="top-left">

          <li class="space"></li>

          <li class="left-li3">
            <a style="color: #5E5E5E;" href="./login.html">登录</a>
            <a style="color: #5E5E5E;" href="./login.html">注册</a>
          </li>
        </ul>

        <!--左部菜单-->
        <ul id="top-right">
          <li class="right-li1">
            <a href="">我的订单</a>
          </li>

          <li class="gome-space"></li>
          <li class="right-li3">
            <a href="javascript: void(0);" @click='personZX'>个人中心</a>
          </li>


        </ul>

      </div>
    </div>
    <!--头部菜单-->


    <!--搜索框-->
    <div class="gome-head">
      <div class="logo">
        <a href="javascript: void(0);">newstar</a>
      </div>


      <div id="top-search">
        <div class="searchbox">
          <!-- <form id="searchForm" action="" method="post"> -->
          <input v-model="key" type="text" placeholder="哈士奇" />
          <button class="search-btn" @click='getGoodsListAll'>搜索</button>
          <!-- </form> -->
          <a href="javascript: void(0);">
            <div class="voice-search"></div>
          </a>
        </div>
        <div class="hotkeyword">
          <a v-for='item in recommandGoosList2' href="javascript: void(0);"
            @click='searchGoods(item.name)'>{{item.name}}</a>
        </div>
      </div>
      <div class="mygome">
        <ul class="topmenu">
          <li>
            <span class="m-span">
              <a href="javascript:void(0)" onclick="vm.MyCat()" class="cartlink">
                <em class="i-cart">
                  <span class="shopnum">
                    <span>{{UserCarList.length}}</span>
                    <i></i>
                  </span>
                </em>
                <span v-if='this.UserCarList.length==0' class="carttext">购物车空了</span>
                <span v-else class="carttext">亲!这里有{{UserCarList.length}}个宠物了哦!</span>
                <b></b>
              </a>
            </span>
            <div class="menuhide">
              <div class="aside">
                <!-- <a href="javascript: void(0);">购物车</a>中还没有商品，赶紧选购吧！ -->
                <!-- 购物车表格 -->
                <el-table :data="UserCarList" style="width: 100%" :show-header='false' :border='true' fit>
                  <el-table-column prop="url" label="图片" width="60px">
                    <template slot-scope="scope">
                      <!-- <el-image
                          style="width: 100px; height: 80px"
                          :src="scope.row.logo"
                      fit="fill"></el-image>-->
                      <img :src="scope.row.url" style="width: 100px; height: 80px" />
                    </template>
                  </el-table-column>
                  <el-table-column prop="goodsName" label="名称">
                    <template slot-scope="scope">
                      <!-- <el-image
                          style="width: 100px; height: 80px"
                          :src="scope.row.logo"
                      fit="fill"></el-image>-->
                      <el-link type="success">{{scope.row.goodsName}}</el-link>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </li>

        </ul>
      </div>
    </div>
    <!--搜索框-->

    <!--分类-->
    <div class="category-box" style="border-bottom: 2px solid #d7000f;">
      <div class="category">
        <div class="sidecategory">
          <h2 class="on">
            <a href="javascript: void(0);">全部宠物分类</a>
          </h2>
          <div class="navBox">
            <div class="lisbg"></div>
            <ul class="lisbg-ul">
              <li v-for="(goodsTypeOne,index) in goodsTypeList" v-if="`${index+1}==1`" class="edit-mode nav-item">
                <h3>
                  <a href="javascript: void(0);">
                    {{goodsTypeOne.typeName}}
                  </a>
                </h3>
              </li>
            </ul>
            <div v-for="(goodsTypeOne,index) in goodsTypeList">
              <div :class="`subnav l${index+1}`">
                <div class="loading">
                  <div class="fullcategory">
                    <div class="fullcategory-left">
                      <div class="fullcategory-title">
                        <div v-for="(goodsTypeTwo,index) in goodsTypeOne.children">
                          <a href="javascript: void(0);">
                            <!-- 二级分类 -->
                            {{goodsTypeTwo.typeName}}
                            <i></i>
                          </a>
                        </div>
                      </div>
                      <!-- 二级分类 -->
                      <div class="fullcategory-content-box">
                        <div v-for="(goodsTypeTwo,index) in goodsTypeOne.children" class="fullcategory-content">
                          <ul class="fullcategory-list">
                            <div class="title">{{goodsTypeTwo.typeName}}</div>
                            <div class="list">
                              <a v-for="(goodsTypeThree,index) in goodsTypeTwo.children" href="javascript: void(0);">
                                {{goodsTypeThree.typeName}}
                              </a>
                            </div>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>

          </div>

          <ul class="mainnav">
            <li class="cur">
              <a href="javascript: void(0);" @click='ReturnFirstPage'>
                <span>首页</span>
              </a>
            </li>
            <li class="cur">
              <a href="javascript: void(0);">
                <span>领养</span>
              </a>
            </li>
          </ul>

        </div>
      </div>
    </div>
    <!--分类-->

    <!--搜索结果的数量	头部-->
    <div class="nSearchWarp">
      <div class="nSearch-crumb nSearch-crumb-search clearfix">
        <span class="nSearch-crumb-keyWord">
          <b class="nFont14"></b>
        </span>
        <span class="nSearch-crumb-searchNum">
          共
          <em id="searchTotalNumber">{{goodsListAll.length}}</em>
          个宠物
        </span>
        <div class="nSearch-crumb-facetsCurrent-warp">
          <ul class="nSearch-crumb-facetsCurrent"></ul>
          <a href="javascript: void(0);" class="facetsCurrent-prev fc-btn"></a>
          <a href="javascript: void(0);" class="facetsCurrent-next fc-btn"></a>
        </div>
      </div>
    </div>
    <!--搜索结果的数量	头部-->

    <!--搜索结果的数量	内容-->
    <div class="nSearchWarp nSearch-facets searchFacet">

      <div class="facets-category facets-category-common facets-hot clearfix">
        <span class="fc-key facets-hot-itemfir">品种：</span>
        <div class="fc-content">
          <div class="category-normal">
            <ul class="clearfix">
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">博美</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">金毛</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">柴犬</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">泰迪</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">萨摩耶</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">哈士奇</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">斗牛犬</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">柯基</a>
              </li>
            </ul>
          </div>
          <div class="fc-btn-box">

          </div>
        </div>
      </div>
      <div class="facets-category facets-category-common  clearfix">

        <span class="fc-key fir">性别：</span>
        <div class="fc-content">
          <div class="category-normal">
            <ul class="clearfix">
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">公</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">母</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">未知</a>
              </li>

            </ul>
          </div>
          <div class="fc-btn-box">

          </div>
        </div>
      </div>
      <div class="facets-category facets-category-common  clearfix">

        <span class="fc-key fir">年龄：</span>
        <div class="fc-content">
          <div class="category-normal">
            <ul class="clearfix">
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">0-3个月</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">3-6个月</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">6-12个月</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">一岁</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">两岁</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">三岁</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">四岁</a>
              </li>
              <li>
                <a href="javascript: void(0);" class="facet facets-hot-item">五岁以上</a>
              </li>

            </ul>
          </div>
          <div class="fc-btn-box">

          </div>
        </div>
      </div>
      <div class="facets-category facets-category-common  clearfix">

        <span class="fc-key fir">地区：</span>
        <div class="fc-content">
          <div class="category-normal">
            <ul class="clearfix">
              <li v-for='item in goodsListAll'>
                <a href="javascript: void(0);" @click='search_item(item.address)'
                  class="facet facets-hot-item">{{item.address}}</a>
              </li>
            </ul>
          </div>
          <div class="fc-btn-box">

          </div>
        </div>
      </div>


      <div class="facets-category facets-category-syn clearfix">
        <span class="fc-key">高级筛选：</span>
        <div class="fc-content">
          <dl class="category-syn">
            <dt class="category-syn-tit">
              性格
              <i></i>
            </dt>
            <dd class="category-syn-con">
              <ul class="category-syn-list clearfix">
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    温和友善
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    外向活跃
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    聪明伶俐
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    黏人依赖
                  </a>
                </li>


                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    其它
                  </a>
                </li>
              </ul>
              <p class="category-syn-btn">
                <a href="javascript: void(0);" class="fc-btn-ok  fc-disable">确定</a>
                <a href="javascript: void(0);" class="fc-btn-cancel">取消</a>
              </p>
            </dd>
          </dl>
          <dl class="category-syn">
            <dt class="category-syn-tit">
              颜色
              <i></i>
            </dt>
            <dd class="category-syn-con">
              <ul class="category-syn-list clearfix">

                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    白色
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    黑色
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    金色
                  </a>
                </li>

                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    棕色
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    其他
                  </a>
                </li>
              </ul>
              <p class="category-syn-btn">
                <a href="javascript: void(0);" class="fc-btn-ok  fc-disable">确定</a>
                <a href="javascript: void(0);" class="fc-btn-cancel">取消</a>
              </p>
            </dd>
          </dl>
          <dl class="category-syn">
            <dt class="category-syn-tit">
              相关分类
              <i></i>
            </dt>
            <dd class="category-syn-con">
              <ul class="category-syn-list clearfix">
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    猫
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    鱼
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    兔
                  </a>
                </li>
                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    鸟
                  </a>
                </li>

                <li>
                  <a href="javascript: void(0);" class="facet">
                    <i></i>
                    其他
                  </a>
                </li>

              </ul>
              <p class="category-syn-btn">
                <a href="javascript: void(0);" class="fc-btn-ok  fc-disable">确定</a>
                <a href="javascript: void(0);" class="fc-btn-cancel">取消</a>
              </p>
            </dd>
          </dl>
        </div>
      </div>
    </div>
    <div class="nSearchWarp">
      <div class="nSearchWarp-main clearfix">
        <div class="gm-title">
          <h2>搜索结果</h2>
          <div class="change-btn">
            <a href="javascript: void(0);" class="prev" @click='prev'></a>
            <a href="javascript: void(0);" class="nex" @click='nex'></a>
          </div>
        </div>
        <div class="product-right-box">
          <div id="prdRight-1">
            <div class="prd-right-normal">
              <h3 class="hd">
                <i class="dsp-tuiguangIdentifi"></i>
                猜你喜欢
              </h3>
              <ul class="bd" id="dsp_tuiguang">
                <li v-for="RecommendGoods in RecommendUserGoodsList.slice(0,5)" class="buy-items">
                  <div class="pic">
                    <a href="javascript: void(0);" @click='gotoPet(RecommendGoods.goodsNumber)'>
                      <img :src="RecommendGoods.url" />
                    </a>
                  </div>
                  <div class="price">
                    <span>{{RecommendGoods.goodsName}}</span>
                  </div>
                </li>
              </ul>
            </div>
          </div>


        </div>
        <div class="product-left-list" id="product-left">
          <div class="product-box">

            <ul class="product-lists clearfix">
              <li v-for='goods in goodsListAll' class="product-item">
                <ul class="arbitrage clearfix"></ul>
                <div class="item-tab-warp">
                  <p class="item-pic">
                    <a href="javascript: void(0);" @click='gotoPet(goods.goodsNumber)' class="emcodeItem item-link">
                      <img :src="goods.url" style="width: 220px;
									  height: 210px;
									  text-align: center;
                    position: relative;">
                    </a>
                  </p>
                  <div class="item-price-info">
                    <div class="item-price">
                      <span class="price">{{goods.petName}}</span>
                    </div>
                  </div>
                  <p class="item-name">
                    <a href="./message.html" class="emcodeItem item-link">
                      {{goods.beizhu}}
                    </a>
                  </p>
                  <p class="item-option clearfix">
                    <span class="add-collection" @click='insertCollect(userInfo.username,goods.goodsNumber)'>收藏</span>
                    <span class="add-cart addTo-cart"
                      @click='insertShappingCar(userInfo.username,goods.goodsNumber)'>加入购物车</span>
                  </p>
                </div>
              </li>
            </ul>
          </div>
        </div>
      </div>
      <div class="searchBox-bottom">
        <ul class="related-list clearfix">
          <li class="related-title">您是不是要找：</li>
          <li class="related-key">
            <a href="javascript: void(0);">金毛</a>
          </li>
          <li class="related-key">
            <a href="javascript: void(0);">柯基</a>
          </li>
          <li class="related-key">
            <a href="javascript: void(0);">哈士奇</a>
          </li>
          <li class="related-key">
            <a href="javascript: void(0);">萨摩耶</a>
          </li>


        </ul>
        <div class="search-box clearfix">
          <input v-model='key' type="text" name="" class="search-box-input" placeholder="哈士奇" />
          <a href="javascript: void(0);" @click='getGoodsListAll' class="search-box-btn">搜索</a>
        </div>
      </div>
    </div>
    <!--搜索结果的数量	内容-->


    <!--品质，低价，速达-->
    <div class="gome-help">
      <ul>
        <li>
          <a href="javascript: void(0);">
            <i class="icon-pz"></i>
            领养
          </a>
          <span class="foot-titlt-dot"></span>
          <a class="sec-title" href="javascript: void(0);">高效匹配 精准推荐</a>
        </li>
        <li>
          <a href="javascript: void(0);">
            <i class="icon-dj"></i>
            送养
          </a>
          <span class="foot-titlt-dot"></span>
          <a class="sec-title" href="javascript: void(0);">跟进反馈 安全保障</a>
        </li>
        <li>
          <a href="javascript: void(0);">
            <i class="icon-sd"></i>
            服务
          </a>
          <span class="foot-titlt-dot"></span>
          <a class="sec-title" href="javascript: void(0);">精准定位 品质至上</a>
        </li>
      </ul>
      <div class="gome-help-box">
        <dl>
          <dt>物流配送</dt>
          <dd>
            <ul>
              <li>
                <a href="javascript: void(0);">配送查询</a>
              </li>
              <li>
                <a href="javascript: void(0);">配送服务</a>
              </li>
              <li>
                <a href="javascript: void(0);">配送费用</a>
              </li>
              <li>
                <a href="javascript: void(0);">配送时效</a>
              </li>
              <li>
                <a href="javascript: void(0);">签收与验货</a>
              </li>
            </ul>
          </dd>
        </dl>
        <dl>
          <dt>支付与账户</dt>
          <dd>
            <ul>
              <li>
                <a href="javascript: void(0);">货到付款</a>
              </li>
              <li>
                <a href="javascript: void(0);">在线支付</a>
              </li>
              <li>
                <a href="javascript: void(0);">分期付款</a>
              </li>
              <li>
                <a href="javascript: void(0);">门店支付</a>
              </li>
              <li>
                <a href="javascript: void(0);">账户安全</a>
              </li>
            </ul>
          </dd>
        </dl>
        <dl>
          <dt>售后服务</dt>
          <dd>
            <ul>
              <li>
                <a href="javascript: void(0);">退换货服务</a>
              </li>
              <li>
                <a href="javascript: void(0);">退款说明</a>
              </li>
              <li>
                <a href="javascript: void(0);">专业维修</a>
              </li>
              <li>
                <a href="javascript: void(0);">延保服务</a>
              </li>
              <li>
                <a href="javascript: void(0);">家电回收</a>
              </li>
            </ul>
          </dd>
        </dl>
        <dl>
          <dt>会员专区</dt>
          <dd>
            <ul>
              <li>
                <a href="javascript: void(0);">会员介绍</a>
              </li>
              <li>
                <a href="javascript: void(0);">优惠券说明</a>
              </li>
              <li>
                <a href="javascript: void(0);">美豆说明</a>
              </li>
              <li>
                <a href="javascript: void(0);">国美社区</a>
              </li>
              <li>
                <a href="javascript: void(0);">商品评价</a>
              </li>
            </ul>
          </dd>
        </dl>
        <dl>
          <dt>购物帮助</dt>
          <dd>
            <ul>
              <li>
                <a href="javascript: void(0);">购物保障</a>
              </li>
              <li>
                <a href="javascript: void(0);">购物流程</a>
              </li>
              <li>
                <a href="javascript: void(0);">促销优惠</a>
              </li>
              <li>
                <a href="javascript: void(0);">焦点问题</a>
              </li>
              <li>
                <a href="javascript: void(0);">联系我们</a>
              </li>
            </ul>
          </dd>
        </dl>
      </div>
    </div>
    <!--品质，低价，速达-->
  </div>
  <!-- <script type="text/javascript" src="./js/s_index.js"></script> -->
  <!-- <script type="text/javascript" src="./js/message.js"></script> -->
  <script type="text/javascript" src="./js/list.js"></script>
</body>

</html>