updated:服务商入驻

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

@@ -1,444 +1,469 @@
-package com.caimei.www.controller.unlimited;
-
-import com.alibaba.fastjson.JSONArray;
-import com.alibaba.fastjson.JSONObject;
-import com.caimei.www.controller.BaseController;
-import com.caimei.www.pojo.page.Parameter;
-import com.caimei.www.pojo.page.ProductDetail;
-import com.caimei.www.pojo.page.ProductList;
-import com.caimei.www.service.page.ProductService;
-import com.caimei.www.service.page.SinglePageService;
-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.PathVariable;
-import org.thymeleaf.util.StringUtils;
-
-import java.util.*;
-import java.util.concurrent.atomic.AtomicReference;
-
-/**
- * 商品（product）
- *
- * @author : Charles
- * @date : 2020/6/12
- */
-@Controller
-public class ProductController extends BaseController {
-
-    private static final String PRODUCT_LIST_PATH = "product/list";
-    private static final String PRODUCT_HOT_PATH = "product/product-hot";
-    private static final String PRODUCT_DETAIL_PATH = "product/detail";
-    private static final String PRODUCT_SUPPORTING_PATH = "product/product-supporting";
-    private static final String PROMOTIONS_LIST_PATH = "product/promotions";
-    private static final String INSTRUMENT_PAGE_PATH = "product/instrument";
-    private static final String TEMPORARY_PAGE_PATH = "product/temporary";
-    private static final String INSTRUMENT_LIST_PATH = "product/instruelist";
-    // private static final String QUALITY_AUTHORRIZE_PATH = "product/qualityauthorize";
-    /**
-     * 新正品联盟页面
-     */
-    private static final String QUALITY_AUTHORRIZE_PATH = "product/alliance-page";
-    private static final String ACTIVITY_TOP_PATH = "activity/activityTopic";
-    private static final String CLOUD_BEAUTY_PATH = "activity/beautyTopic";
-    private static final String ACTIVITY_COUPON_EXP = "activity/couponExp";
-    private static final String ACTIVITY_ATTESTAION = "activity/attestation-new";
-    private static final String ACTIVITY_ATTESTAION_NEW = "activity/attestation";
-    private static final String ACTIVITY_APPROVE_IFRAME = "activity/approveIframe.html";
-    /**
-     * 优惠券活动商品列表
-     */
-    private static final String PRODUCT_COUPON = "product/product-coupon";
-    /**
-     * 美博会专题页
-     */
-    private static final String BEAUTY_TOP_PATH = "product/beautytopic";
-
-    /**
-     * 快捷运营
-     */
-    private static final String QUICK_OPERATION = "quickOperation/index";
-
-    /**
-     * 商品详情文件预览
-     */
-    private static final String PRODUCT_FILE_PREVIEW = "product/filePreview";
-
-    private ProductService productService;
-
-    private SinglePageService singlePageService;
-
-    @Autowired
-    public void setProductService(ProductService productService) {
-        this.productService = productService;
-    }
-
-    @Autowired
-    public void setSinglePageService(SinglePageService singlePageService) {
-        this.singlePageService = singlePageService;
-    }
-
-    /**
-     * 搜索结果 页面
-     */
-    @GetMapping("/product/list.html")
-    public String list() {
-        return PRODUCT_LIST_PATH;
-    }
-
-    /**
-     * 搜索结果 页面
-     */
-    @GetMapping("/product/hot.html")
-    public String hot() {
-        return PRODUCT_HOT_PATH;
-    }
-
-    /**
-     * 优惠券活动商品列表
-     */
-    @GetMapping("/product/product-coupon.html")
-    public String productCoupon() {
-        return PRODUCT_COUPON;
-    }
-
-    /**
-     * 促销活动商品列表
-     */
-    @GetMapping("/product/promotions.html")
-    public String promotions() {
-        return PROMOTIONS_LIST_PATH;
-    }
-
-    /**
-     * 商品详情页
-     */
-    @GetMapping("/product-{id}.html")
-    public String detail(final Model model, @PathVariable("id") String product) {
-        Integer productId = null;
-        Integer typeId = 0;
-        if (product.contains("-")) {
-            String[] split = product.split("-");
-            productId = Integer.valueOf(split[0]);
-            typeId = Integer.valueOf(split[1]);
-        } else {
-            productId = Integer.valueOf(product);
-        }
-        ProductDetail detail = productService.getProductDetailById(productId);
-        if (detail == null || detail.getValidFlag() == 0 || detail.getValidFlag() == 9) {
-            return super.errorPath();
-        }
-        List<String> images = productService.getImages(productId);
-        List<Parameter> params = productService.getParams(productId);
-        List<ProductList> productLists = productService.getProductLists(productId);
-        model.addAttribute("lists", productLists);
-        model.addAttribute("params", params);
-        model.addAttribute("images", images);
-        model.addAttribute("productId", productId);
-        model.addAttribute("product", detail);
-        model.addAttribute("typeId", typeId);
-        return PRODUCT_DETAIL_PATH;
-    }
-
-    /**
-     * 商品详情资料预览
-     */
-    @GetMapping("/product/filePreview.html")
-    public String productFilePreview() {
-        return PRODUCT_FILE_PREVIEW;
-    };
-
-    /**
-     * 仪器页
-     */
-    @GetMapping("/product/type-{id}.html")
-    public String instrument(final Model model, @PathVariable("id") Integer id) {
-        Integer pageId = singlePageService.getInstrumentPageIdById(id);
-        if (pageId == null) {
-            return super.errorPath();
-        }
-        String title = singlePageService.getPageTitleById(id);
-        model.addAttribute("pageId", id);
-        model.addAttribute("pageTitle", title);
-        Integer typeSort = singlePageService.getPageTypeSort(pageId);
-        model.addAttribute("typeSort", typeSort);
-        // 产品仪器一级分类
-        JSONArray bigTypeArr = productService.getTypeClassifyJson(typeSort);
-        // 产品仪器楼层数据
-        Map<String, Object> floorMap = productService.getTypeFloorJson(pageId);
-        model.addAttribute("bigTypeJson", bigTypeArr);
-        model.addAttribute("typeFloorJson", floorMap);
-        return INSTRUMENT_PAGE_PATH;
-    }
-
-    /**
-     * 商品分类列表页面
-     */
-    @GetMapping("/product/classify-{ids}.html")
-    public String instruelist(final Model model, @PathVariable("ids") String ids, String bpn, Integer pro, Integer newg) {
-        String[] split = ids.split("-");
-        // 分类类型：1产品，2仪器，0全部
-        Integer typeSort = split.length >= 1 ? Integer.valueOf(split[0]) : 0;
-        model.addAttribute("typeSort", typeSort);
-        // 一级分类Id
-        Integer bigTypeId = split.length >= 2 ? Integer.valueOf(split[1]) : 0;
-        model.addAttribute("bigTypeId", bigTypeId);
-        // 二级分类Id
-        Integer smallTypeId = split.length >= 3 ? Integer.valueOf(split[2]) : 0;
-        model.addAttribute("smallTypeId", smallTypeId);
-        // 三级级分类Id
-        Integer tinyTypeId = split.length >= 4 ? Integer.valueOf(split[3]) : 0;
-        model.addAttribute("tinyTypeId", tinyTypeId);
-        // 页码
-        Integer pageNum = split.length >= 5 ? Integer.valueOf(split[4]) : 1;
-        // 每页数量
-        Integer pageSize = split.length >= 6 ? Integer.valueOf(split[5]) : 24;
-        // 排序字段：价格price，销量sales，人气favorite
-        String sortField = split.length >= 7 ? split[6] : "";
-        // 排序规则：1降序，其他升序
-        Integer sortType = split.length >= 8 ? Integer.valueOf(split[7]) : 1;
-        /*
-         * 获取一级分类
-         */
-        JSONArray bigTypeArr = productService.getBigTypeJson(typeSort);
-        model.addAttribute("bigTypeJson", bigTypeArr);
-        AtomicReference<String> bigTypeName = new AtomicReference<>("");
-        bigTypeArr.forEach(temp -> {
-            JSONObject bigType = (JSONObject) temp;
-            if (null != bigType && bigTypeId.equals(bigType.getInteger("bigTypeId"))) {
-                bigTypeName.set(bigType.getString("name"));
-            }
-        });
-        model.addAttribute("bigTypeName", bigTypeName.get());
-        /*
-         * 获取二级分类
-         */
-        JSONArray smallTypeArr = productService.getSmallTypeJson(bigTypeId);
-        model.addAttribute("smallTypeJson", smallTypeArr);
-        AtomicReference<String> smallTypeName = new AtomicReference<>("");
-        smallTypeArr.forEach(temp -> {
-            JSONObject smallType = (JSONObject) temp;
-            if (null != smallType && smallTypeId.equals(smallType.getInteger("smallTypeId"))) {
-                smallTypeName.set(smallType.getString("name"));
-            }
-        });
-        model.addAttribute("smallTypeName", smallTypeName.get());
-        /*
-         * 获取三级分类
-         */
-        JSONArray tinyTypeArr = productService.getTinyTypeJson(smallTypeId);
-        model.addAttribute("tinyTypeJson", tinyTypeArr);
-        AtomicReference<String> tinyTypeName = new AtomicReference<>("");
-        tinyTypeArr.forEach(temp -> {
-            JSONObject tinyType = (JSONObject) temp;
-            if (null != tinyType && tinyTypeId.equals(tinyType.getInteger("tinyTypeId"))) {
-                tinyTypeName.set(tinyType.getString("name"));
-            }
-        });
-        model.addAttribute("tinyTypeName", tinyTypeName.get());
-        /*
-         * 获取商品信息
-         */
-        StringBuilder productParams = new StringBuilder();
-        if (tinyTypeId > 0) {
-            productParams.append("?id=").append(tinyTypeId).append("&idType=3");
-        } else if (smallTypeId > 0) {
-            productParams.append("?id=").append(smallTypeId).append("&idType=2");
-        } else {
-            productParams.append("?id=").append(bigTypeId).append("&idType=1");
-        }
-        productParams.append("&pageNum=").append(pageNum).append("&pageSize=").append(pageSize).append("&sortField=").append(sortField).append("&sortType=").append(sortType);
-        if (newg != null) {
-            productParams.append("&newFlag=").append(newg);
-        }
-        if (pro != null) {
-            productParams.append("&promotionFlag=").append(pro);
-        }
-        if (!StringUtils.isEmpty(bpn)) {
-            productParams.append("&brandIds=").append(bpn);
-        }
-        JSONObject productObj = productService.getProductListJson(productParams.toString());
-        Integer totalCount = 0;
-        JSONArray productList = new JSONArray();
-        if (null != productObj) {
-            totalCount = productObj.getInteger("total");
-            productList = (JSONArray) productObj.get("items");
-        }
-        model.addAttribute("productCount", totalCount);
-        model.addAttribute("productListJson", productList);
-
-        int totalPage = (int) Math.ceil((double) totalCount / pageSize);
-        totalPage = totalPage > 0 ? totalPage : 1;
-        int[] arr = null;
-        if (totalPage <= 6) {
-            int[] tmp = new int[]{1, 2, 3, 4, 5, 6};
-            arr = Arrays.copyOf(tmp, totalPage);
-        } else if (pageNum <= 3) {
-            arr = new int[]{1, 2, 3, 4, 5, 0, totalPage};
-        } else if (pageNum >= totalPage - 2) {
-            arr = new int[]{1, 0, totalPage - 4, totalPage - 3, totalPage - 2, totalPage - 1, totalPage};
-        } else {
-            arr = new int[]{1, 0, pageNum - 2, pageNum - 1, pageNum, pageNum + 1, pageNum + 2, 0, totalPage};
-        }
-
-        List<Map<String, Object>> arrPath = new ArrayList<>();
-
-        final String basePath = "/product/classify-" + typeSort + "-" + bigTypeId + "-" + smallTypeId + "-" + tinyTypeId;
-        if (pageNum > 1) {
-            StringBuilder prevPath = new StringBuilder(basePath);
-            prevPath.append("-").append(pageNum - 1).append("-").append(pageSize);
-            if (!StringUtils.isEmpty(sortField)) {
-                prevPath.append("-").append(sortField).append("-").append(sortType).append(".html");
-            } else {
-                prevPath.append(".html");
-            }
-            Map<String, Object> tempPath = new HashMap<>();
-            tempPath.put("btn", -1);
-            tempPath.put("path", prevPath);
-            arrPath.add(tempPath);
-        }
-        for (int j : arr) {
-            Map<String, Object> tempPath = new HashMap<>();
-            tempPath.put("btn", j);
-            if (j > 0) {
-                StringBuilder btnPath = new StringBuilder(basePath);
-                btnPath.append("-").append(j).append("-").append(pageSize);
-                if (!StringUtils.isEmpty(sortField)) {
-                    btnPath.append("-").append(sortField).append("-").append(sortType).append(".html");
-                } else {
-                    btnPath.append(".html");
-                }
-                tempPath.put("path", btnPath);
-            } else {
-                tempPath.put("path", "");
-            }
-            arrPath.add(tempPath);
-        }
-        if (pageNum < totalPage) {
-            StringBuilder nextPath = new StringBuilder(basePath);
-            nextPath.append("-").append(pageNum + 1).append("-").append(pageSize);
-            if (!StringUtils.isEmpty(sortField)) {
-                nextPath.append("-").append(sortField).append("-").append(sortType).append(".html");
-            } else {
-                nextPath.append(".html");
-            }
-            Map<String, Object> tempPath = new HashMap<>();
-            tempPath.put("btn", -2);
-            tempPath.put("path", nextPath);
-            arrPath.add(tempPath);
-        }
-        model.addAttribute("pageBtnNum", pageNum);
-        model.addAttribute("pageBtnList", arrPath);
-
-        return INSTRUMENT_LIST_PATH;
-    }
-
-    /**
-     * 美博会专题页
-     */
-    @GetMapping("/product/beauty.html")
-    public String beautytopic() {
-        return BEAUTY_TOP_PATH;
-    }
-
-    /**
-     * 正品联盟品牌授权商品详情页
-     */
-    @GetMapping("/product/auth/product-{id}.html")
-    public String authorization(final Model model, @PathVariable("id") Integer productId) {
-        model.addAttribute("productId", productId);
-        return QUALITY_AUTHORRIZE_PATH;
-    }
-
-    /**
-     * 活动专题页
-     */
-    @GetMapping("/product/activity-{id}.html")
-    public String activityTopic(final Model model, @PathVariable("id") Integer id) {
-        Integer pageId = null;
-        if (id == 301) {
-            // 美体节活动页
-            pageId = singlePageService.getInstrumentPageIdById(id);
-            if (pageId == null) {
-                return super.errorPath();
-            }
-            return TEMPORARY_PAGE_PATH;
-        }
-        // 活动专题页
-        pageId = singlePageService.getActivityPageIdById(id);
-        if (pageId == null) {
-            return super.errorPath();
-        }
-        model.addAttribute("pageId", id);
-        return ACTIVITY_TOP_PATH;
-    }
-
-    /**
-     * 云上美博会
-     */
-    @GetMapping("/product/beauty-{id}.html")
-    public String getCloudBeautyPath(final Model model, @PathVariable("id") Integer id) {
-        // 活动专题页
-        Integer pageId = singlePageService.getBeautyPageIdById(id);
-        if (pageId == null) {
-            return super.errorPath();
-        }
-        model.addAttribute("pageId", id);
-        return CLOUD_BEAUTY_PATH;
-    }
-
-    /**
-     * 优惠券说明页
-     */
-    @GetMapping("/product/couponExp.html")
-    public String getCouponExpPath() {
-        return ACTIVITY_COUPON_EXP;
-    }
-
-    /**
-     * 认证通页面
-     */
-    @GetMapping("/attestation.html")
-    public String getAttestationPath() {
-        return ACTIVITY_ATTESTAION;
-    }
-
-    /**
-     *
-     */
-    @GetMapping("/attestation-new.html")
-    public String getAttestationNewPath() {
-        return ACTIVITY_ATTESTAION_NEW;
-    }
-
-    /**
-     * H5配套商品页
-     */
-    @GetMapping("/product/product-supporting.html")
-    public String getProductSupporting() {
-        return PRODUCT_SUPPORTING_PATH;
-    }
-
-    /**
-     * H5配套商品页
-     */
-    @GetMapping("/approve-iframe.html")
-    public String getActivityApproveIframe() {
-        return ACTIVITY_APPROVE_IFRAME;
-    }
-
-    /**
-     * 快捷运营
-     */
-    @GetMapping("/quickOperation/operation-{id}.html")
-    public String getQuickOperation(final Model model, @PathVariable("id") Integer id) {
-        // 活动专题页
-        Integer pageId = singlePageService.getBeautyPageIdById(id);
-        if (pageId == null) {
-            return super.errorPath();
-        }
-        model.addAttribute("pageId", id);
-        return QUICK_OPERATION;
-    }
-}
+package com.caimei.www.controller.unlimited;
+
+import com.alibaba.fastjson.JSONArray;
+import com.alibaba.fastjson.JSONObject;
+import com.caimei.www.controller.BaseController;
+import com.caimei.www.pojo.page.Parameter;
+import com.caimei.www.pojo.page.ProductDetail;
+import com.caimei.www.pojo.page.ProductList;
+import com.caimei.www.service.page.ProductService;
+import com.caimei.www.service.page.SinglePageService;
+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.PathVariable;
+import org.thymeleaf.util.StringUtils;
+
+import java.util.*;
+import java.util.concurrent.atomic.AtomicReference;
+
+/**
+ * 商品（product）
+ *
+ * @author : Charles
+ * @date : 2020/6/12
+ */
+@Controller
+public class ProductController extends BaseController {
+
+    private static final String PRODUCT_LIST_PATH = "product/list";
+    private static final String PRODUCT_HOT_PATH = "product/product-hot";
+    private static final String PRODUCT_DETAIL_PATH = "product/detail";
+    private static final String PRODUCT_SUPPORTING_PATH = "product/product-supporting";
+    private static final String PROMOTIONS_LIST_PATH = "product/promotions";
+    private static final String INSTRUMENT_PAGE_PATH = "product/instrument";
+    private static final String TEMPORARY_PAGE_PATH = "product/temporary";
+    private static final String INSTRUMENT_LIST_PATH = "product/instruelist";
+    // private static final String QUALITY_AUTHORRIZE_PATH = "product/qualityauthorize";
+    /**
+     * 新正品联盟页面
+     */
+    private static final String QUALITY_AUTHORRIZE_PATH = "product/alliance-page";
+    private static final String ACTIVITY_TOP_PATH = "activity/activityTopic";
+    private static final String CLOUD_BEAUTY_PATH = "activity/beautyTopic";
+    private static final String ACTIVITY_COUPON_EXP = "activity/couponExp";
+    private static final String ACTIVITY_ATTESTAION = "activity/attestation-new";
+    private static final String ACTIVITY_ATTESTAION_NEW = "activity/attestation";
+    private static final String ACTIVITY_APPROVE_IFRAME = "activity/approveIframe.html";
+    // 服务商入驻
+    private static final String SERVICE_SETTLEMENT_INDEX = "service-settlement/index.html";
+    private static final String SERVICE_SETTLEMENT_INFO = "service-settlement/info.html";
+    private static final String SERVICE_SEARCH_INDEX = "service-settlement/search.html";
+    /**
+     * 优惠券活动商品列表
+     */
+    private static final String PRODUCT_COUPON = "product/product-coupon";
+    /**
+     * 美博会专题页
+     */
+    private static final String BEAUTY_TOP_PATH = "product/beautytopic";
+
+    /**
+     * 快捷运营
+     */
+    private static final String QUICK_OPERATION = "quickOperation/index";
+
+    /**
+     * 商品详情文件预览
+     */
+    private static final String PRODUCT_FILE_PREVIEW = "product/filePreview";
+
+    private ProductService productService;
+
+    private SinglePageService singlePageService;
+
+    @Autowired
+    public void setProductService(ProductService productService) {
+        this.productService = productService;
+    }
+
+    @Autowired
+    public void setSinglePageService(SinglePageService singlePageService) {
+        this.singlePageService = singlePageService;
+    }
+
+    /**
+     * 搜索结果 页面
+     */
+    @GetMapping("/product/list.html")
+    public String list() {
+        return PRODUCT_LIST_PATH;
+    }
+
+    /**
+     * 搜索结果 页面
+     */
+    @GetMapping("/product/hot.html")
+    public String hot() {
+        return PRODUCT_HOT_PATH;
+    }
+
+    /**
+     * 优惠券活动商品列表
+     */
+    @GetMapping("/product/product-coupon.html")
+    public String productCoupon() {
+        return PRODUCT_COUPON;
+    }
+
+    /**
+     * 促销活动商品列表
+     */
+    @GetMapping("/product/promotions.html")
+    public String promotions() {
+        return PROMOTIONS_LIST_PATH;
+    }
+
+    /**
+     * 商品详情页
+     */
+    @GetMapping("/product-{id}.html")
+    public String detail(final Model model, @PathVariable("id") String product) {
+        Integer productId = null;
+        Integer typeId = 0;
+        if (product.contains("-")) {
+            String[] split = product.split("-");
+            productId = Integer.valueOf(split[0]);
+            typeId = Integer.valueOf(split[1]);
+        } else {
+            productId = Integer.valueOf(product);
+        }
+        ProductDetail detail = productService.getProductDetailById(productId);
+        if (detail == null || detail.getValidFlag() == 0 || detail.getValidFlag() == 9) {
+            return super.errorPath();
+        }
+        List<String> images = productService.getImages(productId);
+        List<Parameter> params = productService.getParams(productId);
+        List<ProductList> productLists = productService.getProductLists(productId);
+        model.addAttribute("lists", productLists);
+        model.addAttribute("params", params);
+        model.addAttribute("images", images);
+        model.addAttribute("productId", productId);
+        model.addAttribute("product", detail);
+        model.addAttribute("typeId", typeId);
+        return PRODUCT_DETAIL_PATH;
+    }
+
+    /**
+     * 商品详情资料预览
+     */
+    @GetMapping("/product/filePreview.html")
+    public String productFilePreview() {
+        return PRODUCT_FILE_PREVIEW;
+    };
+
+    /**
+     * 仪器页
+     */
+    @GetMapping("/product/type-{id}.html")
+    public String instrument(final Model model, @PathVariable("id") Integer id) {
+        Integer pageId = singlePageService.getInstrumentPageIdById(id);
+        if (pageId == null) {
+            return super.errorPath();
+        }
+        String title = singlePageService.getPageTitleById(id);
+        model.addAttribute("pageId", id);
+        model.addAttribute("pageTitle", title);
+        Integer typeSort = singlePageService.getPageTypeSort(pageId);
+        model.addAttribute("typeSort", typeSort);
+        // 产品仪器一级分类
+        JSONArray bigTypeArr = productService.getTypeClassifyJson(typeSort);
+        // 产品仪器楼层数据
+        Map<String, Object> floorMap = productService.getTypeFloorJson(pageId);
+        model.addAttribute("bigTypeJson", bigTypeArr);
+        model.addAttribute("typeFloorJson", floorMap);
+        return INSTRUMENT_PAGE_PATH;
+    }
+
+    /**
+     * 商品分类列表页面
+     */
+    @GetMapping("/product/classify-{ids}.html")
+    public String instruelist(final Model model, @PathVariable("ids") String ids, String bpn, Integer pro, Integer newg) {
+        String[] split = ids.split("-");
+        // 分类类型：1产品，2仪器，0全部
+        Integer typeSort = split.length >= 1 ? Integer.valueOf(split[0]) : 0;
+        model.addAttribute("typeSort", typeSort);
+        // 一级分类Id
+        Integer bigTypeId = split.length >= 2 ? Integer.valueOf(split[1]) : 0;
+        model.addAttribute("bigTypeId", bigTypeId);
+        // 二级分类Id
+        Integer smallTypeId = split.length >= 3 ? Integer.valueOf(split[2]) : 0;
+        model.addAttribute("smallTypeId", smallTypeId);
+        // 三级级分类Id
+        Integer tinyTypeId = split.length >= 4 ? Integer.valueOf(split[3]) : 0;
+        model.addAttribute("tinyTypeId", tinyTypeId);
+        // 页码
+        Integer pageNum = split.length >= 5 ? Integer.valueOf(split[4]) : 1;
+        // 每页数量
+        Integer pageSize = split.length >= 6 ? Integer.valueOf(split[5]) : 24;
+        // 排序字段：价格price，销量sales，人气favorite
+        String sortField = split.length >= 7 ? split[6] : "";
+        // 排序规则：1降序，其他升序
+        Integer sortType = split.length >= 8 ? Integer.valueOf(split[7]) : 1;
+        /*
+         * 获取一级分类
+         */
+        JSONArray bigTypeArr = productService.getBigTypeJson(typeSort);
+        model.addAttribute("bigTypeJson", bigTypeArr);
+        AtomicReference<String> bigTypeName = new AtomicReference<>("");
+        bigTypeArr.forEach(temp -> {
+            JSONObject bigType = (JSONObject) temp;
+            if (null != bigType && bigTypeId.equals(bigType.getInteger("bigTypeId"))) {
+                bigTypeName.set(bigType.getString("name"));
+            }
+        });
+        model.addAttribute("bigTypeName", bigTypeName.get());
+        /*
+         * 获取二级分类
+         */
+        JSONArray smallTypeArr = productService.getSmallTypeJson(bigTypeId);
+        model.addAttribute("smallTypeJson", smallTypeArr);
+        AtomicReference<String> smallTypeName = new AtomicReference<>("");
+        smallTypeArr.forEach(temp -> {
+            JSONObject smallType = (JSONObject) temp;
+            if (null != smallType && smallTypeId.equals(smallType.getInteger("smallTypeId"))) {
+                smallTypeName.set(smallType.getString("name"));
+            }
+        });
+        model.addAttribute("smallTypeName", smallTypeName.get());
+        /*
+         * 获取三级分类
+         */
+        JSONArray tinyTypeArr = productService.getTinyTypeJson(smallTypeId);
+        model.addAttribute("tinyTypeJson", tinyTypeArr);
+        AtomicReference<String> tinyTypeName = new AtomicReference<>("");
+        tinyTypeArr.forEach(temp -> {
+            JSONObject tinyType = (JSONObject) temp;
+            if (null != tinyType && tinyTypeId.equals(tinyType.getInteger("tinyTypeId"))) {
+                tinyTypeName.set(tinyType.getString("name"));
+            }
+        });
+        model.addAttribute("tinyTypeName", tinyTypeName.get());
+        /*
+         * 获取商品信息
+         */
+        StringBuilder productParams = new StringBuilder();
+        if (tinyTypeId > 0) {
+            productParams.append("?id=").append(tinyTypeId).append("&idType=3");
+        } else if (smallTypeId > 0) {
+            productParams.append("?id=").append(smallTypeId).append("&idType=2");
+        } else {
+            productParams.append("?id=").append(bigTypeId).append("&idType=1");
+        }
+        productParams.append("&pageNum=").append(pageNum).append("&pageSize=").append(pageSize).append("&sortField=").append(sortField).append("&sortType=").append(sortType);
+        if (newg != null) {
+            productParams.append("&newFlag=").append(newg);
+        }
+        if (pro != null) {
+            productParams.append("&promotionFlag=").append(pro);
+        }
+        if (!StringUtils.isEmpty(bpn)) {
+            productParams.append("&brandIds=").append(bpn);
+        }
+        JSONObject productObj = productService.getProductListJson(productParams.toString());
+        Integer totalCount = 0;
+        JSONArray productList = new JSONArray();
+        if (null != productObj) {
+            totalCount = productObj.getInteger("total");
+            productList = (JSONArray) productObj.get("items");
+        }
+        model.addAttribute("productCount", totalCount);
+        model.addAttribute("productListJson", productList);
+
+        int totalPage = (int) Math.ceil((double) totalCount / pageSize);
+        totalPage = totalPage > 0 ? totalPage : 1;
+        int[] arr = null;
+        if (totalPage <= 6) {
+            int[] tmp = new int[]{1, 2, 3, 4, 5, 6};
+            arr = Arrays.copyOf(tmp, totalPage);
+        } else if (pageNum <= 3) {
+            arr = new int[]{1, 2, 3, 4, 5, 0, totalPage};
+        } else if (pageNum >= totalPage - 2) {
+            arr = new int[]{1, 0, totalPage - 4, totalPage - 3, totalPage - 2, totalPage - 1, totalPage};
+        } else {
+            arr = new int[]{1, 0, pageNum - 2, pageNum - 1, pageNum, pageNum + 1, pageNum + 2, 0, totalPage};
+        }
+
+        List<Map<String, Object>> arrPath = new ArrayList<>();
+
+        final String basePath = "/product/classify-" + typeSort + "-" + bigTypeId + "-" + smallTypeId + "-" + tinyTypeId;
+        if (pageNum > 1) {
+            StringBuilder prevPath = new StringBuilder(basePath);
+            prevPath.append("-").append(pageNum - 1).append("-").append(pageSize);
+            if (!StringUtils.isEmpty(sortField)) {
+                prevPath.append("-").append(sortField).append("-").append(sortType).append(".html");
+            } else {
+                prevPath.append(".html");
+            }
+            Map<String, Object> tempPath = new HashMap<>();
+            tempPath.put("btn", -1);
+            tempPath.put("path", prevPath);
+            arrPath.add(tempPath);
+        }
+        for (int j : arr) {
+            Map<String, Object> tempPath = new HashMap<>();
+            tempPath.put("btn", j);
+            if (j > 0) {
+                StringBuilder btnPath = new StringBuilder(basePath);
+                btnPath.append("-").append(j).append("-").append(pageSize);
+                if (!StringUtils.isEmpty(sortField)) {
+                    btnPath.append("-").append(sortField).append("-").append(sortType).append(".html");
+                } else {
+                    btnPath.append(".html");
+                }
+                tempPath.put("path", btnPath);
+            } else {
+                tempPath.put("path", "");
+            }
+            arrPath.add(tempPath);
+        }
+        if (pageNum < totalPage) {
+            StringBuilder nextPath = new StringBuilder(basePath);
+            nextPath.append("-").append(pageNum + 1).append("-").append(pageSize);
+            if (!StringUtils.isEmpty(sortField)) {
+                nextPath.append("-").append(sortField).append("-").append(sortType).append(".html");
+            } else {
+                nextPath.append(".html");
+            }
+            Map<String, Object> tempPath = new HashMap<>();
+            tempPath.put("btn", -2);
+            tempPath.put("path", nextPath);
+            arrPath.add(tempPath);
+        }
+        model.addAttribute("pageBtnNum", pageNum);
+        model.addAttribute("pageBtnList", arrPath);
+
+        return INSTRUMENT_LIST_PATH;
+    }
+
+    /**
+     * 美博会专题页
+     */
+    @GetMapping("/product/beauty.html")
+    public String beautytopic() {
+        return BEAUTY_TOP_PATH;
+    }
+
+    /**
+     * 正品联盟品牌授权商品详情页
+     */
+    @GetMapping("/product/auth/product-{id}.html")
+    public String authorization(final Model model, @PathVariable("id") Integer productId) {
+        model.addAttribute("productId", productId);
+        return QUALITY_AUTHORRIZE_PATH;
+    }
+
+    /**
+     * 活动专题页
+     */
+    @GetMapping("/product/activity-{id}.html")
+    public String activityTopic(final Model model, @PathVariable("id") Integer id) {
+        Integer pageId = null;
+        if (id == 301) {
+            // 美体节活动页
+            pageId = singlePageService.getInstrumentPageIdById(id);
+            if (pageId == null) {
+                return super.errorPath();
+            }
+            return TEMPORARY_PAGE_PATH;
+        }
+        // 活动专题页
+        pageId = singlePageService.getActivityPageIdById(id);
+        if (pageId == null) {
+            return super.errorPath();
+        }
+        model.addAttribute("pageId", id);
+        return ACTIVITY_TOP_PATH;
+    }
+
+    /**
+     * 云上美博会
+     */
+    @GetMapping("/product/beauty-{id}.html")
+    public String getCloudBeautyPath(final Model model, @PathVariable("id") Integer id) {
+        // 活动专题页
+        Integer pageId = singlePageService.getBeautyPageIdById(id);
+        if (pageId == null) {
+            return super.errorPath();
+        }
+        model.addAttribute("pageId", id);
+        return CLOUD_BEAUTY_PATH;
+    }
+
+    /**
+     * 优惠券说明页
+     */
+    @GetMapping("/product/couponExp.html")
+    public String getCouponExpPath() {
+        return ACTIVITY_COUPON_EXP;
+    }
+
+    /**
+     * 认证通页面
+     */
+    @GetMapping("/attestation.html")
+    public String getAttestationPath() {
+        return ACTIVITY_ATTESTAION;
+    }
+
+    /**
+     *
+     */
+    @GetMapping("/attestation-new.html")
+    public String getAttestationNewPath() {
+        return ACTIVITY_ATTESTAION_NEW;
+    }
+
+    /**
+     * H5配套商品页
+     */
+    @GetMapping("/product/product-supporting.html")
+    public String getProductSupporting() {
+        return PRODUCT_SUPPORTING_PATH;
+    }
+
+    /**
+     * H5配套商品页
+     */
+    @GetMapping("/approve-iframe.html")
+    public String getActivityApproveIframe() {
+        return ACTIVITY_APPROVE_IFRAME;
+    }
+
+    /**
+     * 快捷运营
+     */
+    @GetMapping("/quickOperation/operation-{id}.html")
+    public String getQuickOperation(final Model model, @PathVariable("id") Integer id) {
+        // 活动专题页
+        Integer pageId = singlePageService.getBeautyPageIdById(id);
+        if (pageId == null) {
+            return super.errorPath();
+        }
+        model.addAttribute("pageId", id);
+        return QUICK_OPERATION;
+    }
+
+    /**
+     * 服务商入驻首页
+     */
+    @GetMapping("/serviceSettlement.html")
+    public String getServiceSettlement() {
+        return SERVICE_SETTLEMENT_INDEX;
+    }
+
+    /**
+     * 服务商入驻搜索页
+     */
+    @GetMapping("/servicesSearch.html")
+    public String getServiceSearch() { return SERVICE_SEARCH_INDEX; }
+    /**
+     * 服务商入驻详情
+     */
+    @GetMapping("/settlementInfo.html")
+    public String getSettlementInfo() {
+        return SERVICE_SETTLEMENT_INFO;
+    }
+}

src/main/resources/static/css/service-settlement/index.css

@@ -0,0 +1,165 @@
+/**
+ * PC端
+ */
+@media screen and (min-width:768px) {
+    #service-container {
+        width: 100vw;
+        height: 100vh;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/service_bg.png") no-repeat 100%;
+        background-size: cover;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+    #service-container .search {
+        width: 62.5vw;
+        height: 22.4vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/service_search.png") no-repeat 100%;
+        background-size: contain;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        align-items: center;
+        box-sizing: border-box;
+        padding: 4.9vw 15.6vw;
+    }
+    #service-container .search .title {
+        font-size: 2.1vw;
+        font-weight: bold;
+        color: #333;
+    }
+    #service-container .search .search-input,
+    #service-container .search .el-input {
+        width: 100%;
+    }
+    #service-container .search .el-button {
+        width: 14.6vw;
+        height: 2.9vw;
+        font-size: 0.8vw;
+        color: #FFFFFF;
+        background-color: #FF5B00;
+    }
+    #service-container .footer-phone {
+        position: absolute;
+        width: 100%;
+        bottom: 0;
+        padding: 2.1vw;
+        left: 0;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+    }
+    .footer-phone .phone-title {
+        margin-bottom: 0.3vw;
+        font-size: 0.8vw;
+        color: #666;
+    }
+    .footer-phone .phone {
+        cursor: pointer;
+        font-size: 0.8vw;
+        color: #FF5B00;
+        box-sizing: border-box;
+        height: 1.1vw;
+    }
+    .footer-phone .phone:hover {
+        border-bottom: 1px solid #FF5B00;
+        box-sizing: border-box;
+    }
+    .el-dialog--center .el-dialog__body {
+        text-align: center !important;
+        padding: 18px;
+        font-size: 0.9vw;
+        color: #282828;
+    }
+    .el-dialog__footer .dialog-footer .confirm {
+        background-color: #FF5B00;
+        color: #fff;
+    }
+}
+
+/**
+* 移动端
+*/
+@media screen and (max-width:768px){
+    #service-container {
+        width: 100vw;
+        height: 100vh;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/H5-bg.png") no-repeat 100%;
+        background-size: cover;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+    #service-container .search {
+        position: fixed;
+        top: 40.5vw;
+        width: 76vw;
+        height: 82vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/search-bg.png") no-repeat 100%;
+        background-size: cover;
+        padding: 18vw 7vw;
+        box-sizing: border-box;
+    }
+    #service-container .search .title {
+        color: #333333;
+        font-size: 4.8vw;
+        margin-bottom: 8.8vw;
+        text-align: center;
+        font-weight: bold;
+    }
+    #service-container .search .search-input,
+    #service-container .search .el-input {
+        width: 100%;
+    }
+    #service-container .search .el-button {
+        width: 62vw;
+        height: 10vw;
+        margin-top: 4vw;
+        font-size: 3.5vw;
+        color: #FFFFFF;
+        background-color: #FF5B00;
+    }
+    #service-container .footer-phone {
+        position: fixed;
+        width: 100%;
+        bottom: 12vw;
+        padding: 2.1vw;
+        left: 0;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+    }
+    .footer-phone .phone-title {
+        margin-bottom: 2vw;
+        font-size: 3.2vw;
+        color: #666;
+    }
+    .footer-phone .phone {
+        cursor: pointer;
+        font-size: 3.2vw;
+        color: #FF5B00;
+        box-sizing: border-box;
+        height: 4.2vw;
+    }
+    .footer-phone .phone:hover {
+        border-bottom: 1px solid #FF5B00;
+        box-sizing: border-box;
+    }
+    .el-dialog {
+        width: 80% !important;
+    }
+    .el-dialog--center .el-dialog__body {
+        text-align: center !important;
+        padding: 3.2vw 0 14vw 0;
+        font-size: 3.6vw;
+        color: #282828;
+    }
+    .el-dialog__footer .dialog-footer .confirm {
+        background-color: #FF5B00;
+        color: #fff;
+    }
+}

src/main/resources/static/css/service-settlement/info.css

@@ -0,0 +1,220 @@
+/**
+ * PC端
+ */
+body{
+    background-color: #F5F5F5;
+}
+@media screen and (min-width:768px) {
+    #service-info {
+        width: 62.5vw;
+        margin: 3.2vw auto;
+        box-sizing: border-box;
+    }
+
+    #service-info .title {
+        font-size: 1.3vw;
+        color: #282828;
+        margin-bottom: 0.8vw;
+    }
+    #service-info .contain {
+        background-color: #fff;
+        padding: 0.8vw;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+    }
+    .contain .my-swipe {
+        width: 30.2vw;
+        height: 30.2vw;
+        border: 1px solid #F0F0F0;
+        box-sizing: border-box;
+    }
+    .swipe {
+        width: 30.2vw;
+        height: 30.2vw;
+        position: relative;
+    }
+    .swipe .preview {
+        width: 7.3vw;
+        height: 5.1vw;
+        position: absolute;
+        left: 0.8vw;
+        bottom: 0.8vw;
+    }
+    .swipe .preview .el-image {
+        width: 100%;
+        height: 100%;
+        cursor: pointer;
+    }
+    .contain .content { width: 29.4vw; }
+    .contain .content .content-sq {
+        width: 100%;
+        height: 5.2vw;
+        padding: 0.8vw 1vw;
+        box-sizing: border-box;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/sq_bg.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .contain .content .content-sq .sq {
+        width: 3.6vw;
+        height: 1.3vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/PC_sq.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .contain .content .content-sq .count {
+        font-size: 1vw;
+        color: #374972;
+        margin-top: 0.5vw;
+        font-weight: 500;
+    }
+    .contain .content .content-sq .count span {font-weight: bold;}
+    .contain .content .content-info {
+        margin-top: 0.6vw;
+        width: 100%;
+        height: 13.1vw;
+        box-sizing: border-box;
+        padding: 1.7vw 1.4vw 1.4vw 1.4vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/info-bg.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .contain .content .content-info .info-name {color: #fff;font-weight: bold;font-size: 1.3vw;}
+    .content-info .info-class,.content-info .info-address,.content-info .info-num,.content-info .info-phone {font-size: 0.8vw;display: flex;align-items: center;color: #FFFFFF;}
+    .content-info .icon {width: 1vw;height: 1vw;}
+    .content-info .info-class {
+        margin-top: 0.6vw;
+        height: 1.7vw;
+        padding: 0.3vw 0.6vw;
+        box-sizing: border-box;
+        border-radius: 0.2vw;
+        width: fit-content;
+    }
+    .content-info .info-address { margin-top: 1.3vw; }
+    .content-info .info-num,.content-info .info-phone { margin-top: 0.8vw; }
+    .content-line {
+        width: 100%;
+        height: 0.8vw;
+        background: #F5F5F5;
+        margin: 2.1vw 0 1.3vw 0;
+    }
+    .content-text .tent {
+        margin-bottom: 0.8vw;
+        font-weight: bold;
+        font-size: 0.9vw;
+        color: #333;
+    }
+    .content-text .text {line-height: 1.7vw;color: #666; font-size:0.8vw;}
+    .wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: 100%;
+    }
+    .block {
+        width: 36vw;
+        height: 20.6vw;
+    }
+}
+
+
+/**
+移动端
+ */
+@media screen and (max-width:768px) {
+    body {
+        background: #fff;
+    }
+    #service-info {
+        width: 100vw;
+    }
+    #service-info .title {display: none;}
+    .contain .my-swipe {
+        height: 100vw;
+    }
+    .swipe {
+        position: relative;
+        margin-bottom: 2.4vw;
+    }
+    .swipe .preview {
+        width: 27.2vw;
+        height: 18.8vw;
+        position: absolute;
+        left: 4vw;
+        bottom: 3.2vw;
+    }
+    .el-image {
+        width: 100%;
+        height: 100%;
+    }
+    .content-sq {
+        height: 20vw;
+        margin-bottom: 2.4vw;
+        box-sizing: border-box;
+        padding: 3.6vw 4vw 5.2vw 4vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/sq-bg.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .content-sq .sq {
+        width: 12vw;
+        height: 4.2vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/H5-sq.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .content-sq .count {
+        margin-top: 2vw;
+        font-size: 3.6vw;
+        color: #374972;
+    }
+    .content-sq .count span {
+        font-size: 3.6vw;
+        color: #374972;
+        font-weight: bold;
+    }
+    .content .content-info {
+        width: 100%;
+        height: 46vw;
+        box-sizing: border-box;
+        padding: 4.8vw 4vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/info-bg.png") no-repeat 100%;
+        background-size: 100%;
+    }
+    .content .content-info .info-name {
+        color: #FFFFFF;
+        font-size: 4.8vw;
+        font-weight: bold;
+        margin-bottom: 2.4vw;
+    }
+    .content .content-info .info-class {
+        width: fit-content;
+        padding: 0.7vw 2vw;
+        border-radius: 0.3vw;
+        margin-bottom: 4vw;
+    }
+    .content-info .info-class,.content-info .info-address,.content-info .info-num,.content-info .info-phone {font-size: 3.6vw;display: flex;align-items: center;color: #FFFFFF;margin-bottom: 2vw;}
+    .content-info .icon {width: 4.2vw;height: 4.2vw;}
+    .content-line { height: 3.2vw;width: 100%;background:#F5F5F5; }
+    .content-text {
+        padding: 7.2vw 6vw 25vw 4vw;
+        box-sizing: border-box;
+    }
+    .content-text .tent {
+        font-weight: bold;
+        font-size: 4vw;
+        color: #333;
+        margin-bottom: 3.2vw;
+    }
+    .content-text .text {
+        line-height: 7.2vw;
+        font-size: 3.6vw;
+        color: #666;
+    }
+    .wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: 100%;
+    }
+    .block {
+        width: 68.6vw;
+        height: 47vw;
+    }
+}

src/main/resources/static/css/service-settlement/search.css

@@ -0,0 +1,217 @@
+/**
+ * PC端
+ */
+@media screen and (min-width:768px) {
+    #service-search .search {
+        width: 100vw;
+        height: 21.9vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/PC/search-bg.png") no-repeat 100%;
+        background-size: cover;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-weight: bold;
+        font-size: 2.1vw;
+        color: #fff;
+    }
+    #service-search .search-contain {
+        width: 33.3vw;
+        margin: 2.5vw auto 0 auto;
+        display: flex;
+        align-items: center;
+        flex-direction: column;
+    }
+    #service-search .search-contain .search-frist {
+        display: flex;
+        justify-content: space-between;
+        width: 100%;
+        margin-bottom: 4vw;
+    }
+    #service-search .search-contain .search-frist .search-btn .el-button {
+        background-color: #FF5B00;
+        color: #fff;
+        font-size: 0.8vw;
+        width: 6vw;
+    }
+    #service-search .search-contain .search-frist .search-input { width: calc(100% - 8vw); }
+    .van-field__left-icon {display: none}
+    .van-search, .van-search .van-cell {padding: 0 !important;height: 100%;}
+    .van-search__content {padding-left: 12px; height: 100%;}
+    .van-field__body {height: 100%;}
+    .search-contain .contain {
+        width: 100%;
+        box-sizing: border-box;
+        padding-bottom: 7vw;
+    }
+    .search-contain .contain .contain-title {
+        font-size: 1vw;
+        color: #282828;
+        width: 100%;
+    }
+    .provider {
+        width: 100%;
+        height: 9.4vw;
+        border-radius: 0.2vw;
+        padding: 0.8vw;
+        box-sizing: border-box;
+        display: flex;
+        align-items: center;
+        background-color: #F3F5F6;
+        margin-top: 0.8vw;
+        cursor: pointer;
+        transition: all 0.1s;
+    }
+    .provider:hover {transform: scale(1.1);}
+    .provider .provider-img {
+        width: 7.7vw;
+        height: 7.7vw;
+        margin-right: 1.4vw;
+    }
+    .provider .provider-img .el-image { width: 100%; height: 100%; }
+    .provider .content {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+        height: 100%;
+    }
+    .provider .content .provider-name { font-weight: Bold;font-size: 0.9vw;color: #282828 }
+    .provider .content .provider-class { padding: 0.3vw;display: flex;align-items: center;font-size: 0.8vw;width: fit-content;border-radius: 0.2vw; }
+    .provider .content .provider-address, .provider .content .provider-num { display: flex;align-items: center;font-size: 0.8vw;color: #666; }
+    .provider .content .icon { width: 1vw; height: 1vw;margin-right: 0.6vw; }
+    .el-dialog--center .el-dialog__body {
+        text-align: center !important;
+        padding: 18px;
+        font-size: 0.9vw;
+        color: #282828;
+    }
+    .el-dialog__footer .dialog-footer .confirm {
+        background-color: #FF5B00;
+        color: #fff;
+    }
+    .footer-phone {
+        width: 100%;
+        padding: 2.1vw;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+    }
+    .footer-phone .phone-title {
+        margin-bottom: 0.3vw;
+        font-size: 0.8vw;
+        color: #666;
+    }
+    .footer-phone .phone {
+        cursor: pointer;
+        font-size: 0.8vw;
+        color: #FF5B00;
+        box-sizing: border-box;
+        height: 1.1vw;
+    }
+    .footer-phone .phone:hover {
+        border-bottom: 1px solid #FF5B00;
+        box-sizing: border-box;
+    }
+}
+
+/**
+ * 移动端
+ */
+@media screen and (max-width:768px) {
+    #service-search .search {
+        width: 100vw;
+        height: 46vw;
+        background: url("https://static.caimei365.com/app/img/serviceProvider/H5/search-content-bg.png") no-repeat 100%;
+        background-size: cover;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-weight: bold;
+        font-size: 4.8vw;
+        color: #fff;
+    }
+    .search-contain{
+        padding: 4.8vw 3.2vw 12vw;
+        box-sizing: border-box;
+    }
+    .search-contain .search-frist .search-btn{display: none}
+    .van-search, .van-search .van-cell {padding: 0 !important;height: 9.6vw;}
+    .van-search__content {padding-left: 12px; height: 9.6vw;}
+    .van-field__body {height: 9.6vw;}
+    .van-field__left-icon {line-height: 9.6vw;}
+    .contain {
+        margin-top: 10vw;
+        padding-bottom: 12.4vw;
+    }
+    .contain .contain-title {font-size: 3.6vw;color: #282828; margin-bottom: 2.6vw;}
+    .provider {
+        width: 100%;
+        padding: 2.4vw;
+        box-sizing: border-box;
+        display: flex;
+        align-items: center;
+        background-color: #F3F5F6;
+        margin-top: 2.4vw;
+    }
+    .provider .provider-img {
+        width: 21.8vw;
+        height: 21.8vw;
+        margin-right: 3.2vw;
+    }
+    .provider .provider-img .el-image { width: 100%; height: 100%; }
+    .provider .content {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-between;
+    }
+    .provider .content .provider-name {
+        font-weight: bold;
+        font-size: 3.6vw;
+        color: #282828;
+    }
+    .provider .content .provider-class {
+        padding: 1.4vw;
+        display: flex;
+        align-items: center;
+        font-size: 2.8vw;
+        width: fit-content;
+    }
+    .provider .content .provider-address, .provider .content .provider-num { display: flex;align-items: center;font-size: 2.8vw;color: #666; }
+    .provider .content .icon { width: 2.8vw; height: 2.8vw;margin-right: 1.2vw; }
+    .el-dialog {
+        width: 80% !important;
+    }
+    .el-dialog--center .el-dialog__body {
+        text-align: center !important;
+        padding: 3.2vw 0 14vw 0;
+        font-size: 3.6vw;
+        color: #282828;
+    }
+    .el-dialog__footer .dialog-footer .confirm {
+        background-color: #FF5B00;
+        color: #fff;
+    }
+    .footer-phone {
+        width: 100%;
+        padding: 2.1vw;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+    }
+    .footer-phone .phone-title {
+        margin-bottom: 2vw;
+        font-size: 3.2vw;
+        color: #666;
+    }
+    .footer-phone .phone {
+        cursor: pointer;
+        font-size: 3.2vw;
+        color: #FF5B00;
+        box-sizing: border-box;
+        height: 4.2vw;
+        border-bottom: 1px solid #FF5B00;
+    }
+}

src/main/resources/static/css/service-settlement/service-footer.css

@@ -0,0 +1,33 @@
+/**
+ * PC端
+ */
+@media screen and (min-width:768px) {
+    #footer {
+        width: 100vw;
+        height: 6.5vw;
+        background-color: #282828;
+        text-align: center;
+        color: #FFFFFF;
+        font-size: 0.7vw;
+        line-height: 6.5vw;
+    }
+}
+
+/**
+ * 移动端
+ */
+@media screen and (max-width:768px) {
+    #footer {
+        width: 100vw;
+        height: 12.4vw;
+        background-color: #282828;
+        text-align: center;
+        color: #FFFFFF;
+        font-size: 3vw;
+        line-height: 12.4vw;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+    }
+}
+

src/main/resources/static/js/common/ajax.service.js

@@ -1,74 +1,74 @@
-
-/*
-*封装的ajax函数
-* Created by ZHJY on 2020/06/03.
-* @param  option.type     请求类型  get 和 post
-* @param  option.json     数据请求方式,
-* @param  option.url(必选) 请求的url地址   相同域名下的页面（此函数不支持跨域请求）
-* @param  option.data(必选) 请求协带的参数  以js对象的形式定义，如：{name:'张三'}
-* @param  option.replace  是否更新续签
-* @param  option.mask     是否使用模态层加载动画
-*/
-var Http = {
-        AjaxService : function(option){
-            var NODE_ENV_BASE_URL = $("#coreServer").val();
-            var REV_TOKEN_ENV = '',REV_TOKEN_USERID='';
-            var GET_LOGIN_STAUS = JSON.parse(window.localStorage.getItem("userInfo"));
-            if (GET_LOGIN_STAUS != null) {
-                REV_TOKEN_ENV = GET_LOGIN_STAUS.token;
-                REV_TOKEN_USERID = GET_LOGIN_STAUS.userID;
-            }else{
-                REV_TOKEN_ENV = 'X-token'
-            }
-            var loading = '';
-            var def = $.Deferred();
-            $.ajax({
-                url: NODE_ENV_BASE_URL + option.url,
-                data: option.data,
-                xhrFields: {//此处为跨域后台保持session一致,切勿删除!!!
-                    withCredentials: true
-                },
-                type: option.type,
-                dataType: "json",
-                headers: { 'X-Token': REV_TOKEN_ENV },
-                async:false,
-                // contentType: contentType,
-                contentType: option.json ? 'application/json;charset=UTF-8' : 'application/x-www-form-urlencoded',
-                beforeSend:function () {
-                    // if (option.mask) {
-                    //     loading = layer.load(0,{shade: [0.1,'#000']}); //0.1透明度的白色背景
-                    // }
-                }
-            }).then(function(res) {
-                if(res.code=== -99){
-                    CAIMEI.Storage.clear();
-                    setBeforeUrl();
-                    location.href = "/login.html";
-                }else{
-                    def.resolve(res);
-                }
-            }, function(error) {
-                console.log('网络请求超时，请重试~');
-                def.reject(error);
-            });
-            return def;
-        },
-        uploadImage : function(option,callback) {//上传图片
-            var NODE_ENV_BASE_URL = $("#coreServer").val();
-            $.ajax({
-                url: NODE_ENV_BASE_URL + option.url,
-                type: 'POST',
-                cache: false,
-                data: option.data,
-                processData: false,
-                contentType: false,
-                dataType: "json",
-                success: function (res) {
-                    callback(res)
-                },
-                error: function (xhr, type, errorThrown) {
-                    console.log("照片上传失败")
-                }
-            });
-        }
-};
+
+/*
+*封装的ajax函数
+* Created by ZHJY on 2020/06/03.
+* @param  option.type     请求类型  get 和 post
+* @param  option.json     数据请求方式,
+* @param  option.url(必选) 请求的url地址   相同域名下的页面（此函数不支持跨域请求）
+* @param  option.data(必选) 请求协带的参数  以js对象的形式定义，如：{name:'张三'}
+* @param  option.replace  是否更新续签
+* @param  option.mask     是否使用模态层加载动画
+*/
+var Http = {
+        AjaxService : function(option){
+            var NODE_ENV_BASE_URL = $("#coreServer").val();
+            var REV_TOKEN_ENV = '',REV_TOKEN_USERID='';
+            var GET_LOGIN_STAUS = JSON.parse(window.localStorage.getItem("userInfo"));
+            if (GET_LOGIN_STAUS != null) {
+                REV_TOKEN_ENV = GET_LOGIN_STAUS.token;
+                REV_TOKEN_USERID = GET_LOGIN_STAUS.userID;
+            }else{
+                REV_TOKEN_ENV = 'X-token'
+            }
+            var loading = '';
+            var def = $.Deferred();
+            $.ajax({
+                url: NODE_ENV_BASE_URL + option.url,
+                data: option.data,
+                xhrFields: {//此处为跨域后台保持session一致,切勿删除!!!
+                    withCredentials: true
+                },
+                type: option.type,
+                dataType: "json",
+                headers: { 'X-Token': REV_TOKEN_ENV },
+                async:false,
+                // contentType: contentType,
+                contentType: option.json ? 'application/json;charset=UTF-8' : 'application/x-www-form-urlencoded',
+                beforeSend:function () {
+                    // if (option.mask) {
+                    //     loading = layer.load(0,{shade: [0.1,'#000']}); //0.1透明度的白色背景
+                    // }
+                }
+            }).then(function(res) {
+                if(res.code=== -99){
+                    CAIMEI.Storage.clear();
+                    setBeforeUrl();
+                    location.href = "/login.html";
+                }else{
+                    def.resolve(res);
+                }
+            }, function(error) {
+                console.log('网络请求超时，请重试~');
+                def.reject(error);
+            });
+            return def;
+        },
+        uploadImage : function(option,callback) {//上传图片
+            var NODE_ENV_BASE_URL = $("#coreServer").val();
+            $.ajax({
+                url: NODE_ENV_BASE_URL + option.url,
+                type: 'POST',
+                cache: false,
+                data: option.data,
+                processData: false,
+                contentType: false,
+                dataType: "json",
+                success: function (res) {
+                    callback(res)
+                },
+                error: function (xhr, type, errorThrown) {
+                    console.log("照片上传失败")
+                }
+            });
+        }
+};

src/main/resources/static/js/common/serviceapi/settlement.service.js

@@ -0,0 +1,18 @@
+var SettlementService = {
+    /**
+     * 获取微信配置信息
+     * @param params
+     * @param callback
+     */
+    getWxConfig: function (params, callback) {
+        let GET_LOGIN_STAUS = JSON.parse(window.localStorage.getItem("userInfo"))
+        let REV_TOKEN_ENV = GET_LOGIN_STAUS?.token || ''
+        fetch(`https://zplma.caimei365.com/wx/sdk/config/data?appId=${params.appId}&url=${params.url}`, {
+            method: 'GET',
+            headers: {
+                'X-Token': REV_TOKEN_ENV
+            },
+            contentType: 'application/json;charset=UTF-8'
+        }).then(res=>res.json()).then(res => callback(res))
+    }
+}

src/main/resources/static/js/service-settlement/components/footerComp.js

@@ -0,0 +1,36 @@
+const comFooter = {
+    name: 'comFooter',
+    data() {
+        return {
+            phone: '0755-3365-6365',
+            centerDialogVisible: false
+        }
+    },
+    template:
+        `
+        <div>
+            <div class="footer-phone">
+                <div class="phone-title">监督电话</div>
+                <div class="phone" @click="centerDialogVisible = true">
+                    {{ phone }}
+                </div>
+            </div>
+            <el-dialog
+              :visible.sync="centerDialogVisible"
+              width="18%"
+              center>
+              <span>确定拨打该电话吗</span>
+              <span slot="footer" class="dialog-footer">
+                <el-button @click="centerDialogVisible = false">取 消</el-button>
+                <el-button class="confirm" @click="telPhone">确 定</el-button>
+              </span>
+            </el-dialog>
+        </div>
+    `,
+    methods: {
+        telPhone() {
+            this.centerDialogVisible = false;
+            window.location.href = `tel:${this.phone}`;
+        }
+    }
+}

src/main/resources/static/js/service-settlement/components/provider-item.js

@@ -0,0 +1,58 @@
+const providerItem = {
+    name: 'providerItem',
+    props: {
+        itemObj: {
+            type: 'object',
+            default: () => ({
+                level: 2,
+                id: 1
+            })
+        }
+    },
+    data() {
+        return {
+            textLevel: {
+                1: {
+                    color: '#FF5B00',
+                    backgroundColor: '#FFEBDF'
+                },
+                2: {
+                    color: '#FFB300',
+                    backgroundColor: '#FFF4DF'
+                },
+                3: {
+                    color: '#7EACD5',
+                    backgroundColor: '#DFF0FF'
+                }
+            }
+        }
+    },
+    template:
+        `
+        <div class="provider" @click="handleInfo">
+            <div class="provider-img">
+                <el-image />
+            </div>
+            <div class="content">
+                <div class="provider-name">丽颜科美复兴广场店</div>
+                <div class="provider-class" :style="{color: textLevel[itemObj.level].color, backgroundColor: textLevel[itemObj.level].backgroundColor}">
+                    <div class="icon"></div>
+                    <div class="cont">一级服务商</div>
+                </div>
+                <div class="provider-address">
+                    <div class="icon"></div>
+                    <div class="cont">广东省深圳市罗湖区</div>
+                </div>
+                <div class="provider-num">
+                    <div class="icon"></div>
+                    <div class="cont">资格证编号：CMFW0100001</div>
+                </div>
+            </div>
+        </div>
+    `,
+    methods: {
+        handleInfo() {
+            window.open('/settlementInfo.html?id=' + this.itemObj.id)
+        }
+    }
+}

src/main/resources/static/js/service-settlement/components/service-header.js

@@ -0,0 +1,8 @@
+new Vue({
+    el: '#service-header',
+    data: {},
+    mounted() {
+        console.log(21321)
+    },
+    methods: {}
+})

src/main/resources/static/js/service-settlement/index.js

@@ -0,0 +1,39 @@
+new Vue({
+    el: '#service-container',
+    components: {
+        comFooter
+    },
+    mixins: [wxJssdkMixin],
+    data: {
+        form: {
+            name: ''
+        }
+    },
+    mounted() {
+    },
+    methods: {
+        toSearchProvider() {
+            if (this.form.name) {
+                window.open('/servicesSearch.html?keyword=' + this.form.name)
+            }
+        }
+    }
+})
+
+new Vue({
+    el: '#service-search',
+    components: {
+        providerItem,
+        comFooter
+    },
+    mixins: [wxJssdkMixin],
+    data: {
+        form: {
+            name: ''
+        }
+    },
+    mounted() {},
+    methods: {
+        toSearchProvider() {}
+    }
+})

src/main/resources/static/js/service-settlement/info.js

@@ -0,0 +1,30 @@
+new Vue({
+    el: '#service-info',
+    data: {
+        itemObj: {
+            level: 1
+        },
+        textLevel: {
+            1: {
+                color: '#FF5B00',
+                backgroundColor: '#FFEBDF'
+            },
+            2: {
+                color: '#FFB300',
+                backgroundColor: '#FFF4DF'
+            },
+            3: {
+                color: '#7EACD5',
+                backgroundColor: '#DFF0FF'
+            }
+        },
+        show: false
+    },
+    computed: {
+        infoId() {
+            return 0
+        }
+    },
+    mounted() {},
+    methods: {}
+})

src/main/resources/static/js/service-settlement/mixins/cmWXjssdk.js

@@ -0,0 +1,66 @@
+var wxJssdkMixin = function () {
+    return {
+        data() {
+            return {
+                appId: 'wx91c4152b60ca91a3', // 微信公众号appId
+                jsApiList: ['updateAppMessageShareData', 'onMenuShareAppMessage', 'updateTimelineShareData', 'onMenuShareTimeline'], // 微信配置可用权限
+            }
+        },
+        created() {
+            this.setWxConfig((wx) => this.setWxReady(wx))
+        },
+        methods: {
+            setWxConfig(callback) {
+                const url = 'https://www.caimei365.com/serviceSettlement.html'
+                SettlementService.getWxConfig({
+                    appId: this.appId,
+                    url
+                }, (res) => {
+                    const data = res.data
+                    const wx = window.wx
+                    console.log(data)
+                    if (this.isWeChat()) {
+                        wx.config({
+                            debug: true, // dev === 'development' 开启调试模式,调用的所有 api 的返回值会在客户端 alert 出来，若要查看传入的参数，可以在 pc 端打开，参数信息会通过 log 打出，仅在 pc 端时才会打印。
+                            appId: this.appId, // 必填，公众号的唯一标识
+                            timestamp: data.timestamp, // 必填，生成签名的时间戳
+                            nonceStr: data.noncestr, // 必填，生成签名的随机串
+                            signature: data.signature, // 必填，签名
+                            jsApiList: this.jsApiList // 必填，需要使用的 JS 接口列表
+                        })
+                        callback(wx)
+                        wx.error(function (err) {
+                            console.warn(err)
+                        })
+                    }
+                })
+            },
+            isWeChat() {
+                return /MicroMessenger/i.test(navigator.userAgent);
+            },
+            setWxReady(wx) {
+                wx.ready(function () {
+                    wx.onMenuShareAppMessage({
+                        title: '采美商城', // 分享标题
+                        desc: '采美商城', // 分享描述
+                        link: 'https://www.caimei365.com/serviceSettlement.html', // 分享链接，该链接域名或路径必须与当前页面对应的公众号 JS 安全域名一致
+                        success: () => {
+                        },
+                        fail: () => {
+                            window.location.reload();
+                        }
+                    })
+                    wx.onMenuShareTimeline({
+                        title: '采美商城', // 分享标题
+                        desc: '采美商城', // 分享描述
+                        link: 'https://www.caimei365.com/serviceSettlement.html', // 分享链接，该链接域名或路径必须与当前页面对应的公众号 JS 安全域名一致
+                        success: () => {
+                        },
+                        fail: () => {
+                        }
+                    })
+                })
+            }
+        }
+    }
+}()

src/main/resources/templates/service-settlement/components/footer-link.html

@@ -0,0 +1,13 @@
+<script charset="utf-8" type="text/javascript" src="/lib/jquery-3.6.0.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/jquery.slide-2.1.3.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/swiper.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/viewer.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/jquery-confirm.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/vue2.6.12.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/lazyload.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/element-ui/element-ui.min.js"></script>
+<script charset="utf-8" type="text/javascript" src="/lib/vant-ui/vant.min.js"></script>
+<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/ajax.service.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/mixins/cmWXjssdk.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/settlement.service.js(v=${version})}"></script>

src/main/resources/templates/service-settlement/components/header-link.html

@@ -0,0 +1,14 @@
+<meta charset="UTF-8">
+<meta name="referrer" content="never">
+<meta name="viewport" content="width=device-width,account-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="apple-mobile-web-app-status-bar-style" content="black">
+<meta http-equiv="X-UA-Compatible" content="ie=edge">
+<link rel="shortcut icon" th:href="@{/favicon.png}" type="image/x-icon"/>
+<link rel="bookmark" th:href="@{/favicon.png}" type="image/x-icon"/>
+<link href="/lib/swiper.min.css" media="screen and (max-width:768px)" rel="stylesheet" type="text/css">
+<link href="/lib/jquery-confirm.min.css" rel="stylesheet" type="text/css">
+<link href="/lib/css/viewer.min.css" rel="stylesheet" type="text/css">
+<!--element ui 样式表-->
+<link rel="stylesheet" href="https://unpkg.zhimg.com/element-ui@2.15.13/lib/theme-chalk/index.css"/>
+<link rel="stylesheet" href="/lib/vant-ui/index.css"/>

src/main/resources/templates/service-settlement/components/service-footer.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <link th:href="@{/css/service-settlement/service-footer.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<div id="footer">
+    - 由采美网提供技术支持 -
+</div>
+</body>
+</html>

src/main/resources/templates/service-settlement/components/service-header.html

@@ -0,0 +1,12 @@
+<!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 ">
+    <template th:replace="service-settlement/components/header-link"></template>
+    <link th:href="@{/css/service-settlement/service-header.css(v=${version})}" rel="stylesheet" type="text/css">
+    <body>
+        <div id="service-header"></div>
+    </body>
+    <template th:replace="service-settlement/components/footer-link"></template>
+    <script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/components/service-header.js(v=${version})}"></script>
+</html>
+

src/main/resources/templates/service-settlement/index.html

@@ -0,0 +1,30 @@
+<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>服务商入驻</title>
+    <template th:replace="service-settlement/components/header-link"></template>
+    <link th:href="@{/css/service-settlement/index.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<input type="hidden" th:value="${coreServer}" id="coreServer">
+<input type="hidden" th:value="${agent}" id="userAgent">
+
+<div id="service-container">
+    <div class="search">
+        <div class="title">区域服务商查询</div>
+        <div class="search-input">
+            <el-input placeholder="请输入名称搜索查询" v-model="form.name" />
+        </div>
+        <div class="search-btn">
+            <el-button @click="toSearchProvider">查询</el-button>
+        </div>
+    </div>
+    <com-footer />
+</div>
+
+<template th:replace="service-settlement/components/footer-link"></template>
+
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/components/footerComp.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/index.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/service-settlement/info.html

@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>入驻详情</title>
+    <meta name="referrer" content="never">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <template th:replace="service-settlement/components/header-link"></template>
+    <link th:href="@{/css/service-settlement/info.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<input type="hidden" th:value="${coreServer}" id="coreServer">
+<input type="hidden" th:value="${agent}" id="userAgent">
+
+<div id="service-info">
+    <div class="title">服务商详情</div>
+    <div class="contain">
+        <div class="swipe">
+            <van-swipe class="my-swipe" :autoplay="3000" indicator-color="#FF5B00">
+                <van-swipe-item>1</van-swipe-item>
+                <van-swipe-item>2</van-swipe-item>
+                <van-swipe-item>3</van-swipe-item>
+                <van-swipe-item>4</van-swipe-item>
+            </van-swipe>
+            <div class="preview" @click="show = true">
+                <el-image src="" />
+            </div>
+        </div>
+        <div class="content">
+            <div class="content-sq">
+                <div class="sq"></div>
+                <div class="count">采美平台授权 <span>科医人医疗激光设备贸易公司</span> 为一级服务商</div>
+            </div>
+            <div class="content-info">
+                <div class="info-name">丽颜科美复兴广场店</div>
+                <div class="info-class" :style="{color: textLevel[itemObj.level].color, backgroundColor: textLevel[itemObj.level].backgroundColor}"><div class="icon"></div>一级服务商</div>
+                <div class="info-address"><div class="icon"></div>广东省深圳市罗湖区</div>
+                <div class="info-num"><div class="icon"></div>资格证编号：CMFW0100001</div>
+                <div class="info-phone"><div class="icon"></div>联系方式：15889582993</div>
+            </div>
+            <div class="content-line"></div>
+            <div class="content-text">
+                <div class="tent">简介：</div>
+                <div class="text">科医人医疗激光公司(Lumenis)成立于1966年，是目前全球最大的医疗激光公
+                    司，是激光和强光开发者，创新者和生产者，为外科、皮肤美容和眼科等医学
+                    领域提供最先进的激光技术和设备。世界上第一台眼科激光、外科激光、皮肤
+                    美容激光设备都是由科医人公司制造。这使Lumenis科医人医疗激光公司在医
+                    疗激光行业具有无可争辩的竞争优势，已成为业界的领头羊。</div>
+            </div>
+        </div>
+    </div>
+    <van-overlay :show="show" @click="show = false">
+        <div class="wrapper">
+            <div class="block">
+                <van-image
+                    width="100%"
+                    height="100%"
+                    fit="contain"
+                    src="https://img01.yzcdn.cn/vant/cat.jpeg"
+                />
+            </div>
+        </div>
+    </van-overlay>
+</div>
+
+<template th:replace="service-settlement/components/footer-link"></template>
+<template th:replace="service-settlement/components/service-footer"></template>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/info.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/service-settlement/search.html

@@ -0,0 +1,41 @@
+<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>服务商入驻</title>
+    <template th:replace="service-settlement/components/header-link"></template>
+    <link th:href="@{/css/service-settlement/search.css(v=${version})}" rel="stylesheet" type="text/css">
+</head>
+<body>
+<input type="hidden" th:value="${coreServer}" id="coreServer">
+<input type="hidden" th:value="${agent}" id="userAgent">
+<template th:replace="service-settlement/components/service-header"></template>
+
+<div id="service-search">
+    <div class="search">
+        <div class="title">区域服务商查询</div>
+    </div>
+    <div class="search-contain">
+        <div class="search-frist">
+            <div class="search-input">
+                <van-search v-model="form.name" placeholder="请输入搜索关键词" />
+            </div>
+            <div class="search-btn">
+                <el-button @click="toSearchProvider">查询</el-button>
+            </div>
+        </div>
+        <div class="contain">
+            <div class="contain-title">服务商：</div>
+            <provider-item v-for="i, o in 1" :key="o" />
+        </div>
+    </div>
+    <com-footer />
+</div>
+
+<template th:replace="service-settlement/components/footer-link"></template>
+<template th:replace="service-settlement/components/service-footer"></template>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/components/footerComp.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/components/provider-item.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/service-settlement/index.js(v=${version})}"></script>
+</body>
+</html>
+