供应商商铺首页init

src/main/java/com/caimei/www/controller/InstrumentController.java

@@ -36,7 +36,7 @@ public class InstrumentController extends BaseController {
     /**
      * 项目仪器搜索结果页
      */
-    @GetMapping("/instrument/search.html")
+    @GetMapping("/instrument/list.html")
     public String search() {
         return INSTRUMENT_SEARCH_PATH;
     }

src/main/java/com/caimei/www/controller/ProductController.java

@@ -33,20 +33,10 @@ public class ProductController extends BaseController {
     }
 
     /**
-     * 商品分类列表页
+     * 商品分类列表/搜索结果 页面
      */
     @GetMapping("/product/list.html")
-    public String list(final Model model) {
-        model.addAttribute("searchFlag", "0");
-        return PRODUCT_LIST_PATH;
-    }
-
-    /**
-     * 商品搜索结果页
-     */
-    @GetMapping("/product/search.html")
-    public String search(final Model model) {
-        model.addAttribute("searchFlag", "1");
+    public String list() {
         return PRODUCT_LIST_PATH;
     }
 

src/main/java/com/caimei/www/controller/SupplierController.java

@@ -1,9 +1,17 @@
 package com.caimei.www.controller;
 
+import com.caimei.www.pojo.JsonModel;
+import com.caimei.www.pojo.content.ProductList;
+import com.caimei.www.pojo.content.SupplierDetail;
+import com.caimei.www.service.SupplierService;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.ResponseBody;
+
+import java.util.List;
 
 /**
  * 供应商（supplier）
@@ -14,31 +22,52 @@ import org.springframework.web.bind.annotation.RequestParam;
 @Controller
 public class SupplierController extends BaseController {
 
-	private static final String SUPPLIER_SEARCH_PATH = "supplier/search";
-	private static final String SUPPLIER_HOME_PATH = "supplier/home";
+	private static final String SUPPLIER_LIST_PATH = "supplier/list";
+	private static final String SUPPLIER_INDEX_PATH = "supplier/index";
 
-//    private SupplierService supplierService;
-//    @Autowired
-//    public void setSupplierService(SupplierService supplierService) {
-//        this.supplierService = supplierService;
-//    }
+    private SupplierService supplierService;
+    @Autowired
+    public void setSupplierService(SupplierService supplierService) {
+        this.supplierService = supplierService;
+    }
 
     /**
      * 供应商搜索结果页
      */
-    @GetMapping("/supplier/search.html")
+    @GetMapping("/supplier/list.html")
     public String search() {
-        return SUPPLIER_SEARCH_PATH;
+        return SUPPLIER_LIST_PATH;
     }
 
     /**
-     * 供应商详情页
+     * 供应商首页
      */
-    @GetMapping("/supplier/home.html")
+    @GetMapping("/supplier/index.html")
     public String home(final Model model, @RequestParam("id") Integer supplierId) {
-        /*SupplierDetail detail = supplierService.getSupplierById(supplierId);
-        model.addAttribute("supplier", detail);*/
-        return SUPPLIER_HOME_PATH;
+        SupplierDetail detail = supplierService.getSupplierById(supplierId);
+        model.addAttribute("supplier", detail);
+        return SUPPLIER_INDEX_PATH;
+    }
+
+    /**
+     * 供应商-轮播图片
+     * @return
+     */
+    @GetMapping("/supplier/images")
+    @ResponseBody
+    public JsonModel<List<String>> getSupplierDetailImages(Integer supplierId) {
+        return supplierService.getSupplierDetailImages(supplierId);
     }
 
+    /**
+     * 供应商-主推商品
+     * @return
+     */
+    @GetMapping("/supplier/products")
+    @ResponseBody
+    public JsonModel<List<ProductList>> getSupplierMainProducts(Integer supplierId) {
+        return supplierService.getSupplierMainProducts(supplierId);
+    }
+
+
 }

src/main/java/com/caimei/www/mapper/SupplierDao.java

@@ -0,0 +1,37 @@
+package com.caimei.www.mapper;
+
+import com.caimei.www.pojo.content.ProductList;
+import com.caimei.www.pojo.content.SupplierDetail;
+import org.apache.ibatis.annotations.Mapper;
+
+import java.util.List;
+
+/**
+ * Description
+ *
+ * @author : Charles
+ * @date : 2020/7/22
+ */
+@Mapper
+public interface SupplierDao {
+    /**
+     * 供应商详情
+     * @param supplierId
+     * @return
+     */
+    SupplierDetail getSupplierById(Integer supplierId);
+
+    /**
+     * 供应商-轮播图片
+     * @param supplierId
+     * @return
+     */
+    List<String> getSupplierDetailImages(Integer supplierId);
+
+    /**
+     * 供应商-主推商品
+     * @param supplierId
+     * @return
+     */
+    List<ProductList> getSupplierMainProducts(Integer supplierId);
+}

src/main/java/com/caimei/www/pojo/content/SupplierDetail.java

@@ -0,0 +1,42 @@
+package com.caimei.www.pojo.content;
+
+import lombok.Data;
+
+import java.io.Serializable;
+
+/**
+ * Description
+ *
+ * @author : Charles
+ * @date : 2020/7/22
+ */
+@Data
+public class SupplierDetail implements Serializable {
+    private Integer id;
+    /** 对应的userId */
+    private Integer userId;
+    /** 供应商名称 */
+    private String name;
+    /** 供应商公司简称 */
+    private String abbr;
+    /** 公司LOGO */
+    private String logo;
+    /** 所在地区 */
+    private String address;
+    /** 经营范围 */
+    private String businessScope;
+    /** 营业执照 */
+    private String businessLicense;
+    /** 税务登记证 */
+    private String taxCertificate;
+    /** 供应商授权采美代理证书 */
+    private String certificate;
+    /** 介绍 */
+    private String info;
+    /** 主打产品说明 */
+    private String productDesc;
+    /** 网站 */
+    private String site;
+
+    private static final long serialVersionUID = 1L;
+}

src/main/java/com/caimei/www/service/SupplierService.java

@@ -0,0 +1,36 @@
+package com.caimei.www.service;
+
+import com.caimei.www.pojo.JsonModel;
+import com.caimei.www.pojo.content.ProductList;
+import com.caimei.www.pojo.content.SupplierDetail;
+
+import java.util.List;
+
+/**
+ * Description
+ *
+ * @author : Charles
+ * @date : 2020/7/22
+ */
+public interface SupplierService {
+    /**
+     * 供应商详情
+     * @param supplierId
+     * @return
+     */
+    SupplierDetail getSupplierById(Integer supplierId);
+
+    /**
+     * 供应商-轮播图片
+     * @param supplierId
+     * @return
+     */
+    JsonModel<List<String>> getSupplierDetailImages(Integer supplierId);
+
+    /**
+     * 供应商-主推商品
+     * @param supplierId
+     * @return
+     */
+    JsonModel<List<ProductList>> getSupplierMainProducts(Integer supplierId);
+}

src/main/java/com/caimei/www/service/impl/SupplierServiceImpl.java

@@ -0,0 +1,69 @@
+package com.caimei.www.service.impl;
+
+import com.caimei.www.mapper.SupplierDao;
+import com.caimei.www.pojo.JsonModel;
+import com.caimei.www.pojo.content.ProductList;
+import com.caimei.www.pojo.content.SupplierDetail;
+import com.caimei.www.service.SupplierService;
+import com.caimei.www.utils.ImageUtil;
+import com.caimei.www.utils.PriceUtil;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.Resource;
+import java.util.List;
+
+/**
+ * Description
+ *
+ * @author : Charles
+ * @date : 2020/7/22
+ */
+@Service
+public class SupplierServiceImpl implements SupplierService {
+    @Value("${caimei.wwwDomain}")
+    private String domain;
+    @Resource
+    private SupplierDao supplierDao;
+
+    /**
+     * 供应商详情
+     *
+     * @param supplierId
+     * @return
+     */
+    @Override
+    public SupplierDetail getSupplierById(Integer supplierId) {
+        return supplierDao.getSupplierById(supplierId);
+    }
+
+    /**
+     * 供应商-轮播图片
+     *
+     * @param supplierId
+     * @return
+     */
+    @Override
+    public JsonModel<List<String>> getSupplierDetailImages(Integer supplierId) {
+        List<String> images = supplierDao.getSupplierDetailImages(supplierId);
+        return JsonModel.success(images);
+    }
+
+    /**
+     * 供应商-主推商品
+     *
+     * @param supplierId
+     * @return
+     */
+    @Override
+    public JsonModel<List<ProductList>> getSupplierMainProducts(Integer supplierId) {
+        List<ProductList> list = supplierDao.getSupplierMainProducts(supplierId);
+        // 设置价格等级 及 老图片路径
+        list.forEach(product -> {
+             product.setPricegrade(PriceUtil.getPriceGrade(product.getPrice()));
+             product.setPrice(0d);
+             product.setImage(ImageUtil.getImageURL("product", product.getImage(), 0, domain));
+        });
+        return JsonModel.success(list);
+    }
+}

src/main/resources/mapper/SupplierMapper.xml

@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="com.caimei.www.mapper.SupplierDao">
+    <select id="getSupplierById" resultType="com.caimei.www.pojo.content.SupplierDetail">
+        select
+            s.shopID as id,
+            s.userID as userId,
+            s.name,
+            s.sname as abbr,
+            s.logo,
+            s.address,
+            s.businessScope,
+            s.businessLicenseImage as businessLicense,
+            s.taxCertificateImage as taxCertificate,
+            s.authorizationCertificateImage as certificate,
+            s.info,
+            s.productDesc,
+            s.site
+        from shop s
+        where shopID = #{supplierId}
+    </select>
+    <select id="getSupplierDetailImages" resultType="java.lang.String">
+        select image
+        from shopbanner
+        where shopID = #{supplierId}
+    </select>
+    <select id="getSupplierMainProducts" resultType="com.caimei.www.pojo.content.ProductList">
+		select
+			p.productID as pid,
+			p.`name` as `name`,
+			p.mainImage as image,
+			p.price1 as price,
+			p.unit as unit,
+			p.price1TextFlag as priceflag
+		from product p
+        where p.shopID = #{supplierId}
+        and p.validFlag = 2 and p.featuredFlag=1
+        order by p.productID desc limit 4
+    </select>
+</mapper>

src/main/resources/static/css/base/base.h5.css

@@ -6,6 +6,10 @@
 .baseHeadCenter,#container,.footMain{width:100%;overflow:hidden;}
 .pcOnly,.jqSelect .pc,.baseHeadTop,.baseHeadCenter .headCart,.baseHeadCenter .hotword,.baseTopNav>.wrap{display:none!important;}
 .mIcon:before{content:'';display:inline-block;font-size:0;background:url(/img/base/icon_m.png) no-repeat;background-size:75vw auto;transition:all .5s}
+.icon.shop,.icon.heart{vertical-align:middle;display:inline-block;height:5.5vw;line-height:5.5vw}
+.icon.shop:before{width:7.5vw;height:6vw;background-position:-1% 60%}
+.icon.heart:before{width:5.5vw;height:5.5vw;background-position:0% 36.5%}
+.icon.shop .tips{display:none;}
 .mf{display:-ms-flexbox;display:-webkit-flex;display:flex;}
 .mfbt{display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;}
 .mfc{display:-ms-flexbox;display:-webkit-flex;display:flex;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center}

src/main/resources/static/css/base/base.pc.css

@@ -18,6 +18,14 @@ body{min-width:1184px;}
 .jqSelect ul li:hover{background:#FEF6F3;color:#E15616}
 .wrap{width:1184px;margin:0 auto;}
 .icon:before,.baseTopNav .nav:after{content:'';display:inline-block;background:url(/img/base/icon.png) no-repeat;font-size:0;}
+.icon.shop,.icon.heart{vertical-align:middle;display:inline-block;height:25px;line-height:25px;}
+.icon.shop:before{width:30px;height:25px;background-position:5px -297px}
+.icon.heart:before{width:25px;height:25px;background-position:-35px -297px}
+.icon.shop{position:relative;cursor:pointer}
+.icon.shop .tips{position:absolute;top:-30px;left:0;white-space:nowrap;background-color:#666;border-radius:2px;line-height:30px;font-size:12px;color:#FFF;text-align:center;display:inline-block;opacity:0;transition:all 1s;padding:0 10px;font-style:normal}
+.icon.shop .tips:before{content:"";width:10px;height:10px;background:#666;position:absolute;bottom:-3px;left:17px;transform:rotate(45deg)}
+.icon.shop:hover .tips{opacity:1}
+
 /* 头部 */
 .baseHeadTop{width:100%;font-size:14px;background:#FBFBFB}
 .baseHeadTop ul{height:40px;line-height:40px}

src/main/resources/static/css/product/detail.h5.css

@@ -47,9 +47,6 @@ li{list-style:none}
 .mShopBox span{display:block;white-space:nowrap;color:#93979F}
 .mShopBox span em{white-space:normal;font-style:normal;line-height:4.5vw;display:inline-block;vertical-align:top;box-sizing:border-box;padding:1.5vw 0;width:76vw}
 .mShopBox span:first-child em{margin-right:2vw;}
-.mShopBox .shop,.shopBox .heart{vertical-align:text-top}
-.mShopBox .shop:before{width:7.5vw;height:6vw;background-position:-1% 60%;margin-top:-1vw;}
-.mShopBox .heart:before{width:5.5vw;height:5.5vw;background-position:0% 36.5%}
 .mShopBox .name:after{content:'\276F';float:right;font-size:4vw;color:#707070}
 
 .productInfo{background:#FFF;margin-bottom: 2.7vw;}

src/main/resources/static/css/product/detail.pc.css

@@ -61,6 +61,7 @@ li{list-style:none;}
 #productRecommend li .item a{display:block;width:100%;height:100%;color:#93979F}
 #productRecommend li .item a:hover{color:#E15616}
 #productRecommend li .item img{display:block;width:153px;height:153px}
+#productRecommend li .item span{max-height:44px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
 #productRecommend .swiper-wrapper{height:205px;}
 #productRecommend .swiper-pagination{width:100%;height:14px;z-index:1;text-align:center;font-size:0;}
 #productRecommend .swiper-pagination span{display:inline-block;width:14px;height:4px;border:5px solid transparent;cursor:pointer;opacity:.2;}
@@ -85,9 +86,6 @@ li{list-style:none;}
 .shopBox{margin-bottom:16px;background:#FFF}
 .shopBox .bd{padding:0 16px 16px}
 .shopBox .bd .name{line-height:20px;padding: 10px 0;font-weight:bold;color:#4A4F58;font-size:14px;border-bottom:1px solid #F7F7F7}
-.shopBox .shop,.shopBox .heart{vertical-align:middle;display:inline-block;width:25px;}
-.shopBox .shop:before{width:30px;height:25px;background-position:5px -297px}
-.shopBox .bd .heart:before{width:25px;height:25px;background-position:-35px -297px}
 .shopBox .bd .tit{line-height:30px;font-weight:bold;color:#4A4F58;font-size:14px}
 .shopBox .bd .con{line-height:20px;color:#93979F;font-size:12px;margin-bottom:12px}
 .shopBox .bd .btn{display:block;width:100%;height:36px;line-height:36px;text-align:center;box-sizing:border-box;border-radius:2px;border:1px solid #E15616;font-size:14px;color:#E15616;margin-top:12px}

src/main/resources/static/css/supplier/index.css

@@ -0,0 +1,102 @@
+@charset "utf-8";
+li{list-style:none}
+/**
+ * PC端
+ */
+@media screen and (min-width:768px){
+#supplierBanner{width:100%;height:358px;margin-top:10px;background:#FFF;overflow:hidden;position:relative}
+#supplierBanner .swiper-wrapper{position:relative;height:100%;z-index:0}
+#supplierBanner .swiper-wrapper li{position:relative;zoom:1;vertical-align:middle;width:100%;overflow:hidden}
+#supplierBanner .swiper-wrapper img{width:100%;height:358px;display:block;margin-left:50%;-o-transform:translateX(-50%);-ms-transform:translateX(-50%);-moz-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%)}
+#supplierBanner .swiper-button-prev,#supplierBanner .swiper-button-next{position:absolute;top:50%;margin-top:-25px;width:30px;height:50px;line-height:50px;background:rgba(255,230,220,.2);color:#FFF;font-size:30px;text-align:center;border-radius:2px}
+#supplierBanner .swiper-button-prev{left:0;right:auto}
+#supplierBanner .swiper-button-next{left:auto;right:0}
+#supplierBanner .swiper-button-prev:after{content:"\276C"}
+#supplierBanner .swiper-button-next:after{content:"\276D"}
+#supplierBanner .swiper-button-prev:hover,#supplierBanner .swiper-button-next:hover{background:rgba(255,230,220,.6)}
+#supplierBanner .swiper-pagination{width:100%;height:14px;position:absolute;left:0;bottom:10px;z-index:1;text-align:center;font-size:0}
+#supplierBanner .swiper-pagination span{display:inline-block;border:5px solid transparent;cursor:pointer}
+#supplierBanner .swiper-pagination span:before{content:"";display:inline-block;width:14px;height:4px;background:rgba(255,255,255,.4);border-radius:2px}
+#supplierBanner .swiper-pagination span.on:before{width:28px;background:#fff}
+.supplierTit{width:1184px;margin:0 auto;background:#FFF;position:relative}
+.supplierTit .title{box-sizing:border-box;min-height:100px;padding:5px 16px}
+.supplierTit .title img{display:inline-block;height:90px;margin-right:10px;vertical-align:middle}
+.supplierTit .title h1{display:inline-block;max-width:542px;line-height:36px;vertical-align:middle;font-size:24px;font-weight:bold}
+.supplierTit .search{width:490px;height:44px;line-height:44px;box-sizing:border-box;border:1px solid #FFE6DC;position:absolute;bottom:27px;right:16px}
+.supplierTit .search input{width:100%;height:42px;line-height:42px;text-indent:15px;position:absolute;right:0;top:0;border:none;outline:none}
+.supplierTit .search .searchBtn{position:absolute;right:0;top:0;font-size:0;padding:7px 12px;height:30px;line-height:30px}
+.supplierTit .search .searchBtn:before{width:30px;height:30px;background-position:4px 4px}
+.supplierInfo{width:1184px;margin:0 auto;}
+.supplierInfo .tabTit{width:100%;height:40px;line-height:40px;margin:16px auto;background:#FFF;border-bottom:1px solid #E15621;font-size:16px;color:#93979F}
+.supplierInfo .tabTit span{display:inline-block;box-sizing:border-box;min-width:130px;text-align:center;height:100%;padding:0 32px;cursor:pointer}
+.supplierInfo .tabTit span:hover{color:#E15621}
+.supplierInfo .tabTit span.on,.supplierInfo .tabTit span.on:hover{background:#E15621;color:#FFF}
+.supplierInfo .tabCon{width:100%;background:#FFF;}
+.supplierInfo .infoBox{
+    box-sizing: border-box;
+    padding:16px;
+    font-size: 16px;
+    line-height: 22px;
+    color: #4A4F58;
+}
+.supplierInfo .infoBox .part{margin-top:30px;}
+.supplierInfo .infoBox .part:first-child{margin-top:0;}
+.supplierInfo .infoBox .title{height:24px;line-height:24px;padding-left:10px;border-left:4px solid #E15616;font-size:24px;color:#4A4F58;font-weight:bold;text-align:left;margin-bottom:20px;}
+.supplierInfo .infoBox .cont{text-indent: 2em;}
+.supplierInfo .infoBox .photo img{
+    width:240px;
+    height:180px;
+}
+.supplierInfo .infoBox p{
+    margin:5px 0;
+}
+
+
+
+
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+#supplierBanner{width:93.4vw;height:28.2vw;overflow:hidden;position:relative;margin:0 auto}
+#supplierBanner .swiper-wrapper{position:relative;height:100%;z-index:0}
+#supplierBanner .swiper-wrapper .swiper-slide{position:relative;zoom:1;vertical-align:middle;width:100%;overflow:hidden;text-align:center;background:#fff}
+#supplierBanner .swiper-wrapper img{width:100%;height:28.2vw;display:block}
+#supplierBanner .swiper-button-prev,#supplierBanner .swiper-button-next{display:none}
+#supplierBanner .swiper-pagination{width:100%;height:2.6vw;z-index:1;text-align:center;font-size:0;position:absolute;bottom:1.5vw;left:0}
+#supplierBanner .swiper-pagination .swiper-pagination-bullet{display:block;width:2vw;border-width:1vw 1px;border-color:transparent;cursor:pointer;background:none;font-size:0;opacity:.2}
+#supplierBanner .swiper-pagination .swiper-pagination-bullet:before{content:"";display:block;width:100%;height:.6vw;background:#FFF;border-radius:.3vw}
+#supplierBanner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:3.8vw;opacity:1}
+.supplierTit{width:100%;background:#FFF;position:relative;box-sizing:border-box;padding:13.4vw 3.3vw 2vw 3.3vw;border-top:1px solid #F5F5F5;}
+.supplierTit .title{box-sizing:border-box;min-height:13.4vw;padding:2.2vw 0;position:absolute;top:0;left:3.3vw}
+.supplierTit .title img{display:inline-block;height:9vw;margin-right:1vw;vertical-align:middle}
+.supplierTit .title h1{display:inline-block;max-width:70vw;max-height:9vw;overflow:hidden;line-height:4.5vw;vertical-align:middle;font-size:3.7vw;font-weight:bold}
+.supplierTit .search{width:93.4vw;height:9.6vw;margin:2vw auto 0 auto;border:1px solid #FFE6DC;border-radius:2px;position:relative;overflow:hidden}
+.supplierTit .search input{border:none;outline:none;width:100%;height:9.6vw;line-height:9.2vw;font-size:3.7vw;color:#4A4F58;text-indent:2.6vw}
+.supplierTit .searchBtn{position:absolute;right:1.2vw;top:0}
+.supplierTit .searchBtn:before{content:'';display:block;width:9.6vw;height:9.6vw;background-position:33% -1%}
+
+.supplierInfo{background:#FFF;margin-bottom: 2.7vw;}
+.supplierInfo .tabTit{padding:1.5vw 3.3vw;position:relative;}
+.supplierInfo .tabTit span{display:inline-block;height:7.5vw;line-height:7.5vw;border-bottom:2px solid transparent;color:#93979F;font-size:3.4vw;margin-left:8vw;}
+.supplierInfo .tabTit span.on{color:#E15621;border-color:#E15621}
+.supplierInfo .tabTit span:first-child{margin-left:0;}
+.supplierInfo .showSearch{
+    position: absolute;
+    right: 3.3vw;
+    bottom: 1.5vw;
+    padding: 0 2vw;
+    height: 7.5vw;
+    line-height: 7.5vw;
+    background: #E15621;
+    color: #FFF;
+    font-weight: normal;
+    font-size: 3.1vw;
+    border-radius: 2px;
+}
+.supplierInfo .tabCon{padding:1.2vw 3.3vw 3.3vw;text-align:center;font-size:3.4vw;}
+
+
+}

src/main/resources/static/css/supplier/search.css → src/main/resources/static/css/supplier/list.css

@@ -19,9 +19,6 @@ li{list-style:none}
     .supplierItem .left h5 span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inline-block;vertical-align: middle;max-width:84%;}
     .supplierItem .left p{line-height:26px;font-size:14px;color:#93979F;white-space:nowrap}
     .supplierItem .left p>span{white-space:normal;height:auto;display:inline-block;vertical-align:top;max-width:82%}
-    .supplierItem .left .shop,.supplierItem .left .heart{vertical-align:middle;display:inline-block;height:25px}
-    .supplierItem .left .shop:before{width:30px;height:25px;background-position:5px -297px}
-    .supplierItem .left .heart:before{width:25px;height:25px;background-position:-35px -297px}
     .supplierItem .left .tag{display:inline-block;height:20px;line-height:20px;font-style:normal;background:#86B2FB;color:#FFF;border-radius:2px;margin-right:10px;padding:0 5px}
     .supplierItem .products{position:relative;height:124px}
     .supplierItem .products li{float:left;width:100px;min-height:100px;background:url(/img/base/placeholder.png) no-repeat center center;background-size:80%;margin-right:16px}
@@ -37,7 +34,6 @@ li{list-style:none}
 * 移动端
 */
 @media screen and (max-width:768px){
-    /*footer{display:none!important}*/
     .loading{box-sizing:border-box;padding:20vw 0;text-align:center}
     .empty{box-sizing:border-box;padding:15vw 0;text-align:center;color:#4A4F58;line-height:8vw;font-size:3.4vw}
     .empty img{width:40vw;height:40vw}
@@ -52,9 +48,6 @@ li{list-style:none}
     .supplierItem .left p{line-height:6vw;font-size:3.4vw;color:#93979F;white-space:nowrap}
     .supplierItem .left p>span{white-space:normal;height:auto;display:inline-block;vertical-align:top;max-width:82%}
     .supplierItem .left .tag{display:inline-block;height:4.4vw;line-height:4.4vw;font-size:2.6vw;font-style:normal;background:#86B2FB;color:#FFF;border-radius:2px;margin-right:2.2vw;padding:0 1vw}
-    .supplierItem .left .shop,.supplierItem .left .heart{vertical-align:middle;display:inline-block;height:5.5vw}
-    .supplierItem .left .shop:before{width:7.5vw;height:6vw;background-position:-1% 60%;margin-top:-1vw}
-    .supplierItem .left .heart:before{width:5.5vw;height:5.5vw;background-position:0% 36.5%}
     .supplierItem .products{position:relative;margin-top:2.6vw}
     .supplierItem .products li{width:29.4vw;min-height:29.4vw;background:url(/img/base/placeholder.png) no-repeat center center;background-size:80%;margin:0 1.3vw}
     .supplierItem .products li img{width:29.4vw;height:29.4vw}

src/main/resources/static/js/product/list.js

@@ -158,7 +158,6 @@ var productList = new Vue({
         }
     },
     created: function () {
-        this.searchFlag = $('#searchFlag').val() * 1 === 1;
         if(isPC){
             this.params.size = getUrlParam("pageSize") ? getUrlParam("pageSize") * 1 : 20;
             this.params.num = getUrlParam("pageNum") ? getUrlParam("pageNum") * 1 : 1;
@@ -169,6 +168,7 @@ var productList = new Vue({
         this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
         this.params.sortField = getUrlParam("sortField") ? getUrlParam("sortField") : "";
         this.params.sortType = getUrlParam("sortType") ? getUrlParam("sortType") * 1 : 1;
+        this.searchFlag = (this.params.keyword !== "");
         var userInfo = localStorage.getItem('userInfo');
         if(userInfo){
             this.userId = JSON.parse(userInfo).userId;

src/main/resources/static/js/supplier/index.js

@@ -0,0 +1,67 @@
+var supplierHome = new Vue({
+    el: "#supplierHome",
+    data: {
+        supplierId: 0,
+        supplierBanner: []
+    },
+    computed: {
+
+    },
+    methods: {
+        getBanners: function(){
+            var _self = this;
+            if(this.supplierId === 0) {return false;}
+            $.getJSON("/supplier/images",{supplierId: this.supplierId}).done(function (r) {
+                if (r.code === 0 && r.data) {
+                    _self.supplierBanner = r.data;
+                    setTimeout(function(){
+                        if (isPC) {
+                            $('#supplierBanner').slide({
+                                mainCell:".swiper-wrapper"
+                                ,titCell:".swiper-pagination span"
+                                ,effect: "leftLoop"
+                                ,prevCell:".swiper-button-prev"
+		                        ,nextCell:".swiper-button-next"
+                                ,interTime: 2000
+                                ,autoPlay: true
+                                ,autoPage: false
+                                ,trigger: "mouseover"
+                            });
+                        } else {
+                            var swiper = new Swiper('#supplierBanner', {
+                                loop : true,
+                                autoplay: {
+                                    delay: 2000,
+                                    disableOnInteraction: false
+                                },
+                                navigation: {
+                                    nextEl: '.swiper-button-next',
+                                    prevEl: '.swiper-button-prev'
+                                },
+                                pagination: {
+                                    el: '.swiper-pagination',
+                                    clickable :true
+                                }
+                            });
+                        }
+                    },500);
+                }
+            });
+        }
+    },
+    created: function () {
+        this.supplierId = getUrlParam("id") ? getUrlParam("id") * 1 : 0;
+        this.getBanners();
+    },
+    mounted: function () {
+        var _self = this;
+        $('.supplierInfo').slide({
+            mainCell:".tabCon"
+            ,titCell:".tabTit span"
+            ,trigger: "click"
+        });
+        $('body').on("click", '.showSearch', function(){
+            $('.supplierTit .search').show();
+        })
+    }
+});

src/main/resources/templates/components/header.html

@@ -63,7 +63,7 @@
                 <div class="hotword">
                     <span th:each="word,wordStat: ${searchHotWord}">
                         <i th:if="${wordStat.index}>0">/</i>
-                        <a th:href="@{/product/search.html( keyword=${word} )}" target="_blank" th:text="${word}"></a>
+                        <a th:href="@{/product/list.html( keyword=${word} )}" target="_blank" th:text="${word}"></a>
                     </span>
                 </div>
             </div>

src/main/resources/templates/instrument/search.html → src/main/resources/templates/instrument/list.html

@@ -4,7 +4,7 @@
 <head>
     <title>采美365网-项目列表</title>
     <template th:replace="components/headLink"></template>
-    <link th:href="@{/css/instrument/search.css(v=${version})}" rel="stylesheet" type="text/css">
+    <link th:href="@{/css/instrument/list.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>
 <!-- 引用头部 -->
@@ -54,6 +54,6 @@
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>
 <template th:replace="components/footLink"></template>
-<script charset="utf-8" type="text/javascript" th:src="@{/js/instrument/search.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/instrument/list.js(v=${version})}"></script>
 </body>
 </html>

src/main/resources/templates/product/list.html

@@ -12,8 +12,7 @@
 
 <!-- 商品列表 -->
 <div id="productList">
-    <input type="hidden" id="searchFlag" th:value="${searchFlag}">
-    <template v-if="isPC">
+    <template v-if="isPC && listData && listData.length>0">
         <!-- 面包屑 -->
         <div v-if="searchFlag" class="crumbs">
             <span>搜索结果</span>
@@ -38,7 +37,7 @@
             </template>
         </div>
         <!--分类-->
-        <div v-if="!searchFlag" id="listClassify" class="classifyBox">
+        <div v-if="(!searchFlag)" id="listClassify" class="classifyBox">
             <div class="clsTab">
                 <template v-for="(big,i) in classify">
                     <a :class="{'on': params.bid==big.bigTypeID}" v-if="big.validFlag==1" href="javascript:void(0);" v-text="big.name"></a>
@@ -60,33 +59,6 @@
             </div>
         </div>
     </template>
-    <!--排序-->
-    <div class="sortBox">
-        <ul class="mfc">
-            <li :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
-            <template>
-                <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
-                    @click="toSortList('sales',0)"><span>销量</span></li>
-                <li v-else-if="params.sortField == 'sales' && params.sortType == 0" class="up"
-                    @click="toSortList('sales',1)"><span>销量</span></li>
-                <li v-else @click="toSortList('sales',0)"><span>销量</span></li>
-            </template>
-            <template>
-                <li v-if="params.sortField == 'favorite' && params.sortType == 1" class="down"
-                    @click="toSortList('favorite',0)"><span>人气</span></li>
-                <li v-else-if="params.sortField == 'favorite' && params.sortType == 0" class="up"
-                    @click="toSortList('favorite',1)"><span>人气</span></li>
-                <li v-else @click="toSortList('favorite',0)"><span>人气</span></li>
-            </template>
-            <template>
-                <li v-if="params.sortField == 'price' && params.sortType == 1" class="down"
-                    @click="toSortList('price',0)"><span>价格</span></li>
-                <li v-else-if="params.sortField == 'price' && params.sortType == 0" class="up"
-                    @click="toSortList('price',1)"><span>价格</span></li>
-                <li v-else @click="toSortList('price',0)"><span>价格</span></li>
-            </template>
-        </ul>
-    </div>
     <!--loading-->
     <div v-if="listLoading" class="loading">
         <img src="/img/base/loading.gif">
@@ -99,40 +71,69 @@
             <p><a href="/">点这里吧</a>，采美还你一片绿洲~</p>
         </div>
     </div>
-    <!--商品列表-->
-    <ul v-else class="productList clear mfw">
-        <li class="productItem mfc" v-for="p in listData">
-            <div class="item">
-                <a class="image" :href="'/product/detail.html?id='+p.pid" target="_blank">
-                    <img :src="p.image" :alt="p.name">
-                    <span v-if="p.acttype==1||p.acttype==2" :class="p.acttype==1?'icon mIcon hot':'icon mIcon new'"></span>
-                </a>
-                <a class="name" :href="'/product/detail.html?id='+p.pid" target="_blank">
-                    <span v-html="p.name"></span>
-                </a>
-                <div class="price mfhc">
-                    <template v-if="userId && userId>0">
-                        <em v-if="p.priceflag==1">未公开价格</em>
+    <template v-else>
+        <!--排序-->
+        <div class="sortBox">
+            <ul class="mfc">
+                <li :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
+                <template>
+                    <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
+                        @click="toSortList('sales',0)"><span>销量</span></li>
+                    <li v-else-if="params.sortField == 'sales' && params.sortType == 0" class="up"
+                        @click="toSortList('sales',1)"><span>销量</span></li>
+                    <li v-else @click="toSortList('sales',0)"><span>销量</span></li>
+                </template>
+                <template>
+                    <li v-if="params.sortField == 'favorite' && params.sortType == 1" class="down"
+                        @click="toSortList('favorite',0)"><span>人气</span></li>
+                    <li v-else-if="params.sortField == 'favorite' && params.sortType == 0" class="up"
+                        @click="toSortList('favorite',1)"><span>人气</span></li>
+                    <li v-else @click="toSortList('favorite',0)"><span>人气</span></li>
+                </template>
+                <template>
+                    <li v-if="params.sortField == 'price' && params.sortType == 1" class="down"
+                        @click="toSortList('price',0)"><span>价格</span></li>
+                    <li v-else-if="params.sortField == 'price' && params.sortType == 0" class="up"
+                        @click="toSortList('price',1)"><span>价格</span></li>
+                    <li v-else @click="toSortList('price',0)"><span>价格</span></li>
+                </template>
+            </ul>
+        </div>
+        <!--商品列表-->
+        <ul class="productList clear mfw">
+            <li class="productItem mfc" v-for="p in listData">
+                <div class="item">
+                    <a class="image" :href="'/product/detail.html?id='+p.pid" target="_blank">
+                        <img :src="p.image" :alt="p.name">
+                        <span v-if="p.acttype==1||p.acttype==2" :class="p.acttype==1?'icon mIcon hot':'icon mIcon new'"></span>
+                    </a>
+                    <a class="name" :href="'/product/detail.html?id='+p.pid" target="_blank">
+                        <span v-html="p.name"></span>
+                    </a>
+                    <div class="price mfhc">
+                        <template v-if="userId && userId>0">
+                            <em v-if="p.priceflag==1">未公开价格</em>
+                            <template v-else>
+                                <em v-if="priceLoading">正在获取价格...</em>
+                                <em v-else-if="p.priceflag==2 && p.userIdentity!=2">价格仅会员可见</em>
+                                <em v-else class="p" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
+                                <div class="btnBox">
+                                    <a v-if="p.priceflag==2 && p.userIdentity!=2" href="javascript:void(0)" class="btn">升级成为会员</a>
+                                    <a v-else-if="p.priceflag!=1" href="javascript:void(0)" class="btn add">加入购物车</a>
+                                </div>
+                            </template>
+                        </template>
                         <template v-else>
-                            <em v-if="priceLoading">正在获取价格...</em>
-                            <em v-else-if="p.priceflag==2 && p.userIdentity!=2">价格仅会员可见</em>
-                            <em v-else class="p" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
-                            <div class="btnBox">
-                                <a v-if="p.priceflag==2 && p.userIdentity!=2" href="javascript:void(0)" class="btn">升级成为会员</a>
-                                <a v-else-if="p.priceflag!=1" href="javascript:void(0)" class="btn add">加入购物车</a>
-                            </div>
+                            <em>价格：<i class="icon mIcon" v-for="i in 5">
+                                    <i v-if="i==1||p.pricegrade>=i" class="icon mIcon on"></i>
+                            </i></em>
+                            <div class="btnBox"><a href="javascript:void(0)" class="btn add toLogin">加入购物车</a></div>
                         </template>
-                    </template>
-                    <template v-else>
-                        <em>价格：<i class="icon mIcon" v-for="i in 5">
-                                <i v-if="i==1||p.pricegrade>=i" class="icon mIcon on"></i>
-                        </i></em>
-                        <div class="btnBox"><a href="javascript:void(0)" class="btn add toLogin">加入购物车</a></div>
-                    </template>
+                    </div>
                 </div>
-            </div>
-        </li>
-    </ul>
+            </li>
+        </ul>
+    </template>
     <!--分页-->
     <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
     <div v-if="isPC && pageTotal>1" class="pageWrap clear">

src/main/resources/templates/supplier/index.html

@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:schemaLocation="https://www.thymeleaf.org ">
+<head>
+    <title>采美365网-供应商列表</title>
+    <template th:replace="components/headLink"></template>
+    <link th:href="@{/css/supplier/index.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<!-- 引用头部 -->
+<template th:replace="components/header"></template>
+
+<!-- 供应商首页 -->
+<div id="supplierHome">
+    <div class="supplierTit">
+        <!--首页图片轮播-->
+        <div id="supplierBanner" class="swiper-container">
+            <ul class="swiper-wrapper">
+                <li class="swiper-slide mfc" v-for="imgUrl in supplierBanner">
+                    <img :src="imgUrl">
+                </li>
+            </ul>
+            <div class="swiper-pagination mfc"><span v-if="isPC" v-for="i in supplierBanner.length"></span></div>
+            <a class="swiper-button-prev" href="javascript:void(0)"></a>
+            <a class="swiper-button-next" href="javascript:void(0)"></a>
+        </div>
+        <div class="title">
+            <img th:src="${supplier.logo}">
+            <h1 th:text="${supplier.name}"></h1>
+            <a href="javascript:void(0);"><i class="icon mIcon shop"><em class="tips">点击查看授权牌照</em></i></a>
+        </div>
+        <div class="search">
+            <input class="keyword" type="text" placeholder="请输入商品名称（商铺内商品）">
+            <a class="searchBtn icon mIcon" href="javascript:void(0);"></a>
+        </div>
+    </div>
+
+    <div class="supplierInfo">
+        <div class="tabTit">
+            <span class="on">产品展示</span>
+            <span>公司介绍</span>
+            <a v-if="!isPC" class="showSearch" href="javascript:void(0);">商铺内搜索</a>
+        </div>
+        <div class="tabCon">
+            <div class="item">1111</div>
+            <div class="item infoBox">
+                <div class="part">
+                    <div class="title">公司基本信息</div>
+                    <p>公司：<span th:text="${supplier.name}"></span></p>
+                    <p>满意度：<span><i v-for="i in 5" class="icon mIcon heart"></i></span></p>
+                    <p>经营范围：<span><em class="tag" th:text="${supplier.businessScope}"></em></span></p>
+                </div>
+                <div class="part">
+                    <div class="title">公司介绍</div>
+                    <div class="cont" th:utext="${supplier.info}"></div>
+                </div>
+                <div class="part">
+                    <div class="title">主打系列产品说明</div>
+                    <div class="cont" th:utext="${supplier.productDesc}"></div>
+                </div>
+                <div class="part">
+                    <div class="title">营业执照</div>
+                    <div class="photo">
+                        <a th:href="${supplier.businessLicense}" target="_blank">
+                            <img th:src="${supplier.businessLicense}">
+                        </a>
+                    </div>
+                </div>
+                <div class="part">
+                    <div class="title">公司资质</div>
+                    <div class="photo">
+                        <a th:href="${supplier.taxCertificate}" target="_blank">
+                            <img th:src="${supplier.taxCertificate}">
+                        </a>
+                    </div>
+                </div>
+                <div class="part" th:if="not${#strings.isEmpty(supplier.certificate)}">
+                    <div class="title">授权牌照</div>
+                    <div class="photo">
+                        <a th:href="${supplier.certificate}" target="_blank">
+                            <img th:src="${supplier.certificate}">
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</div>
+
+<!-- 引入底部 -->
+<template th:replace="components/footer"></template>
+<template th:replace="components/footLink"></template>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/supplier/index.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/supplier/search.html → src/main/resources/templates/supplier/list.html

@@ -4,7 +4,7 @@
 <head>
     <title>采美365网-供应商列表</title>
     <template th:replace="components/headLink"></template>
-    <link th:href="@{/css/supplier/search.css(v=${version})}" rel="stylesheet" type="text/css">
+    <link th:href="@{/css/supplier/list.css(v=${version})}" rel="stylesheet" type="text/css">
 </head>
 <body>
 <!-- 引用头部 -->
@@ -75,6 +75,6 @@
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>
 <template th:replace="components/footLink"></template>
-<script charset="utf-8" type="text/javascript" th:src="@{/js/supplier/search.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/supplier/list.js(v=${version})}"></script>
 </body>
 </html>