Merge remote-tracking branch 'origin/developerA' into developerA

src/main/resources/static/css/encyclopedia/common.css

@@ -8,7 +8,7 @@
 .flex-between-center,.navbar .nav li a,.navbar .nav,.navbar .container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
 .container{width:1200px;margin:0 auto}
 body{padding-top:80px;min-height: 100vh;}
-.navbar{width:100%;background:#fff;position:fixed;top:0;left:0;z-index:99999;-webkit-box-shadow:0 0 5px rgba(0,0,0,0.1);box-shadow:0 0 5px rgba(0,0,0,0.1)}
+.navbar{width:100%;background:#fff;position:fixed;top:0;left:0;z-index:99998;-webkit-box-shadow:0 0 5px rgba(0,0,0,0.1);box-shadow:0 0 5px rgba(0,0,0,0.1)}
 .navbar .logo{width:136px;height:56px;overflow:hidden}
 .navbar .logo .menu-btn{display:none}
 .navbar .logo h1{font-size:0;margin:0}
@@ -56,7 +56,7 @@ body{padding-top:80px;min-height: 100vh;}
 .icon.arrowleft{background-position:-42vw 0;-webkit-transform:rotateZ(-90deg);-ms-transform:rotate(-90deg);transform:rotateZ(-90deg)}
 .clearfix::after{content:"";display:block;width:0;clear:both}
 body{-webkit-box-sizing:border-box;box-sizing:border-box;padding-top:29.5vw}
-.navbar{position:fixed;top:0;z-index:99999;width:100vw;height:29.5vw;background-color:#fff}
+.navbar{position:fixed;top:0;z-index:99998;width:100vw;height:29.5vw;background-color:#fff}
 .navbar .nav{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:fixed;top:0;left:0;z-index:99999;height:100vh;width:100vw;background:rgba(0,0,0,0.7);-webkit-box-sizing:border-box;box-sizing:border-box;display:none}
 .navbar .nav li{width:70.2vw;height:12.8vw;line-height:12.8vw;text-align:center;border-top:1px solid rgba(255,255,255,0.4)}
 .navbar .nav li.active a{color:#e15616}

src/main/resources/static/css/encyclopedia/detail.css

@@ -1,4 +1,6 @@
 @charset "UTF-8";
+.viewer-container{z-index: 99999 !important}
+img{cursor: pointer;}
 @media screen and (min-width:768px){
 .flex-between-center,.article .section.description .content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
 .container,.article{width:1200px;margin:0 auto}
@@ -15,7 +17,7 @@
 .article .section.description .content .content-left{width:986px}
 .article .section.description .content .content-left .desc{text-align:justify;font-size:14px;line-height:24px}
 .article .section.description .content .content-left .names{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;line-height: 26px}
-.article .section.description .content .content-left .names .name{width: 60%;}
+.article .section.description .content .content-left .names .name{max-width: 60%;}
 .article .section.description .content .content-left .names .alias{ flex: 1;}
 .article .section.description .content .content-left .alias{color:#93979f;margin-left:40px}
 .article .section.description .content .cover{width:120px;height:120px;border:1px dashed #93979f;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}
@@ -48,6 +50,7 @@
 .contact-popup .content p.time{color:#2c3038}
 }
 @media screen and (max-width:768px){
+img{max-width: 100%;}
 .flex,.flex-start-center,.article .section.approve .img-list,.article .section.params .tr .group,.flex-between-center,.flex-center{display:-webkit-box;display:-ms-flexbox;display:flex}
 .flex-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
 .flex-between-center{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}

src/main/resources/static/css/supplier-center/article/article-list.css

@@ -1,186 +1,36 @@
-@charset "UTF-8";
-.top-row {
-    width: 968px;
-    padding: 12px 0 12px 236px;
-    margin: 0 auto;
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-end;
-}
-
-.top-row .crumbs {
-    width: auto;
-    padding: 0;
-    margin: 0;
-}
-
-.top-row .hot-tip {
-    font-size: 12px;
-    color: #E15616;
-}
-
-.form-section {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-wrap: wrap;
-}
-
-.form-section .form-item {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    padding-bottom: 18px;
-}
-
-.form-section .form-item .form-label {
-    margin-right: 8px;
-    font-size: 14px;
-    color: #627386;
-}
-
-.form-section .form-item .form-control {
-    outline: none;
-    width: 210px;
-    height: 36px;
-    padding: 8px 12px;
-    background: #FFFFFF;
-    border: 1px solid #B8BFCA;
-    border-radius: 2px;
-    box-sizing: border-box;
-}
-
-.form-section .form-item .form-control::placeholder {
-    font-size: 14px;
-    color: #9AA5B5;
-}
-
-.form-section .form-item .form-select {
-    color: #627386;
-}
-
-.form-section .form-item .form-button {
-    height: 36px;
-    padding: 0 30px;
-    margin-left: 16px;
-    font-size: 14px;
-    line-height: 36px;
-    border-radius: 2px;
-    cursor: pointer;
-}
-
-.form-section .buttons {
-    justify-content: flex-start;
-}
-
-.form-section .form-item .form-button.search {
-    color: #FFFFFF;
-    background: #E15616;
-}
-
-
-.form-section .form-item .form-button.add {
-    background: #FFE6DC;
-    border: 1px solid #E15616;
-    color: #E15616;
-}
-
-.navLayout {
-    min-height: 500px;
-}
-
-.article-list {
-}
-
-.article-list .row {
-    width: 100%;
-    padding: 18px 20px 0;
-    margin-bottom: 16px;
-    box-sizing: border-box;
-    background: #fff;
-    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.07);
-}
-
-.article-list .table, .table tr, .table th, .table td {
-    border: 0;
-}
-
-.article-list .table {
-    width: 100%;
-}
-
-.article-list .table th {
-    font-size: 14px;
-    color: #627386;
-    padding-bottom: 16px;
-    border-bottom: 1px solid #E2E7EF;
-}
-
-.article-list .table td {
-    font-size: 12px;
-    color: #22272E;
-    text-align: center;
-}
-
-.article-list .table td {
-    padding: 16px 0;
-}
-
-
-.article-list .table .title,
-.article-list .table .time,
-.article-list .table .option {
-    width: 100px;
-}
-
-.article-list .table .title {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-.article-list .table .option .form-button {
-    width: 40px;
-    height: 22px;
-    margin: 2px 0;
-    line-height: 22px;
-    text-align: center;
-    background: #FFE6DC;
-    border: 1px solid #E15616;
-    border-radius: 2px;
-    font-size: 12px;
-    color: #E15616;
-    cursor: pointer;
-}
-
-.article-list .table .cover {
-    display: inline-block;
-    width: 48px;
-    height: 48px;
-    border: 1px dashed #E2E7EF;
-}
-
-.article-list .state {
-    color: #22272E;
-}
-
-.article-list .state.success {
-    color: #34CC8C;
-}
-
-.article-list .state.warning {
-    color: #F9A94B;
-}
-
-.article-list .state.danger {
-    color: #F94B4B;
-}
-
-.article-list .state.primary {
-    color: #1890F9;
-}
-
-.article-list .pageWrap {
-    width: 100% !important;
-}
+@charset "UTF-8";.top-row{width:968px;padding:12px 0 12px 236px;margin:0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}
+.top-row .crumbs{width:auto;padding:0;margin:0}
+.top-row .hot-tip{font-size:12px;color:#E15616}
+.form-section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}
+.form-section .form-item{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;padding-bottom:18px}
+.form-section .form-item .form-label{margin-right:8px;font-size:14px;color:#627386}
+.form-section .form-item .form-control{outline:none;width:210px;height:36px;padding:8px 12px;background:#FFFFFF;border:1px solid #B8BFCA;border-radius:2px;-webkit-box-sizing:border-box;box-sizing:border-box}
+.form-section .form-item .form-control::-webkit-input-placeholder{font-size:14px;color:#9AA5B5}
+.form-section .form-item .form-control::-moz-placeholder{font-size:14px;color:#9AA5B5}
+.form-section .form-item .form-control:-ms-input-placeholder{font-size:14px;color:#9AA5B5}
+.form-section .form-item .form-control::-ms-input-placeholder{font-size:14px;color:#9AA5B5}
+.form-section .form-item .form-control::placeholder{font-size:14px;color:#9AA5B5}
+.form-section .form-item .form-select{color:#627386}
+.form-section .form-item .form-button{height:36px;padding:0 30px;margin-left:16px;font-size:14px;line-height:36px;border-radius:2px;cursor:pointer}
+.form-section .buttons{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}
+.form-section .form-item .form-button.search{color:#FFFFFF;background:#E15616}
+.form-section .form-item .form-button.add{background:#FFE6DC;border:1px solid #E15616;color:#E15616}
+.navLayout{min-height:500px}
+.article-list{}
+.article-list .row{width:100%;padding:18px 20px 0;margin-bottom:16px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff;-webkit-box-shadow:0px 3px 6px rgba(0,0,0,0.07);box-shadow:0px 3px 6px rgba(0,0,0,0.07)}
+.article-list .table,.table tr,.table th,.table td{border:0}
+.article-list .table{width:100%}
+.article-list .table th{font-size:14px;color:#627386;padding-bottom:16px;border-bottom:1px solid #E2E7EF}
+.article-list .table td{font-size:12px;color:#22272E;text-align:center}
+.article-list .table td{padding:16px 0}
+.article-list .table .title,.article-list .table .time,.article-list .table .option{width:100px}
+.article-list .table .title{white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis}
+.article-list .table .reason{display:inline-block;width:14px;height:14px;background:#FF2A2A;color:#fff;border-radius:50%;vertical-align:middle;line-height:14px;text-align:center;margin-left:2px;cursor: help;}
+.article-list .table .option .form-button{width:40px;height:22px;margin:2px 0;line-height:22px;text-align:center;background:#FFE6DC;border:1px solid #E15616;border-radius:2px;font-size:12px;color:#E15616;cursor:pointer}
+.article-list .table .cover{display:inline-block;width:48px;height:48px;border:1px dashed #E2E7EF}
+.article-list .state{color:#22272E}
+.article-list .state.success{color:#34CC8C}
+.article-list .state.warning{color:#F9A94B}
+.article-list .state.danger{color:#F94B4B}
+.article-list .state.primary{color:#1890F9}
+.article-list .pageWrap{width:100% !important}

src/main/resources/static/js/encyclopedia/detail.js

@@ -1,5 +1,15 @@
 "use strict";
 
+function initPreviewImage() {
+    var imageGroup = {};
+    var imageEls = document.querySelectorAll('.content');
+    if (imageEls.length <= 0) return;
+    imageEls.forEach(function (imageEl, index) {
+        imageGroup['cm-images-' + index] = new Viewer(imageEl);
+    });
+    console.log('初始化图片预览成功')
+}
+
 $(function () {
     // 页面滚动偏移
     var offset = 0;
@@ -40,10 +50,11 @@ $(function () {
     $('#contactPopupClose').on('click', function () {
         $('#contactPopup').hide();
     });
+
     // 切换显示侧边导航
     function toggleNavigate(selector, time, maxWidth, offset) {
         selector = $(selector);
-        if(windowWidth <= middleScreenWidth){
+        if (windowWidth <= middleScreenWidth) {
             selector.hide();
         }
         // 鼠标移动事件
@@ -60,10 +71,11 @@ $(function () {
         $(window).resize(function () {
             if ($(this).width() <= maxWidth) {
                 selector.hide();
-            }else{
+            } else {
                 selector.show();
             }
         });
     }
+    initPreviewImage()
     // toggleNavigate('.navigate', 1000, middleScreenWidth, 80);
 });

src/main/resources/templates/encyclopedia/instrument-detail.html

@@ -5,11 +5,14 @@
     <meta charset="UTF-8"/>
     <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <title>采美百科-仪器百科详情</title>
+    <meta name="keyword" th:content="${baikeInstrument.seoKeyword}" />
+    <meta name="description" th:content="${baikeInstrument.discription}" />
+    <title th:text="${baikeInstrument.name + '详情-采美百科-美业百科全书'}"></title>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/normalize.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/base.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/common.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/detail.css(v=${version})}"/>
+    <link rel="stylesheet" type="text/css" href="/lib/css/viewer.min.css">
 </head>
 <body>
 <!-- 引用公共头部 -->
@@ -109,7 +112,7 @@
             <div class="tr">
                 <div class="group">
                     <div class="th">上市时间</div>
-                    <div class="td" th:text="*{#dates.format(marketTime,'yyyy-MM-dd')}"></div>
+                    <div class="td" th:text="*{#dates.format(marketTime,'yyyy年MM月dd日')}"></div>
                 </div>
                 <div class="group">
                     <div class="th">公司/厂商</div>
@@ -119,7 +122,7 @@
             <div class="tr">
                 <div class="group">
                     <div class="th">NMPA认证时间</div>
-                    <div class="td" th:text="*{#dates.format(nmpaTime,'yyyy-MM-dd')}"></div>
+                    <div class="td" th:text="*{#dates.format(nmpaTime,'yyyy年MM月dd日')}"></div>
                 </div>
                 <div class="group">
                     <div class="th">价格区间</div>
@@ -213,6 +216,7 @@
 
 <!-- 引用公共底部 -->
 <template th:replace="encyclopedia/components/footer"></template>
+<script charset="utf-8" type="text/javascript" src="/lib/viewer.min.js"></script>
 <script th:src="@{/js/encyclopedia/detail.js(v=${version})}"></script>
 </body>
 </html>

src/main/resources/templates/encyclopedia/product-detail.html

@@ -5,13 +5,14 @@
     <meta charset="UTF-8"/>
     <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-    <meta name="keyword" th:content="${baikeProduct.name}" />
+    <meta name="keyword" th:content="${baikeProduct.seoKeyword}" />
     <meta name="description" th:content="${baikeProduct.discription}" />
-    <title th:text="${'采美百科-产品百科详情-' + baikeProduct.name}"></title>
+    <title th:text="${baikeProduct.name + '详情-采美百科-美业百科全书'}"></title>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/normalize.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/base.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/common.css(v=${version})}"/>
     <link rel="stylesheet" th:href="@{/css/encyclopedia/detail.css(v=${version})}"/>
+    <link rel="stylesheet" type="text/css" href="/lib/css/viewer.min.css">
 </head>
 <body>
 <!-- 引用公共头部 -->
@@ -96,7 +97,7 @@
             <div class="tr">
                 <div class="group">
                     <div class="th">上市时间</div>
-                    <div class="td" th:text="*{#dates.format(marketTime,'yyyy-MM-dd')}"></div>
+                    <div class="td" th:text="*{#dates.format(marketTime,'yyyy年MM月dd日')}"></div>
                 </div>
                 <div class="group">
                     <div class="th">公司/厂商</div>
@@ -106,7 +107,7 @@
             <div class="tr">
                 <div class="group">
                     <div class="th">NMPA认证时间</div>
-                    <div class="td" th:text="*{#dates.format(nmpaTime,'yyyy-MM-dd')}"></div>
+                    <div class="td" th:text="*{#dates.format(nmpaTime,'yyyy年MM月dd日')}"></div>
                 </div>
                 <div class="group">
                     <div class="th">价格区间</div>
@@ -196,6 +197,7 @@
 </div>
 <!-- 引用公共底部 -->
 <template th:replace="encyclopedia/components/footer"></template>
+<script charset="utf-8" type="text/javascript" src="/lib/viewer.min.js"></script>
 <script th:src="@{/js/encyclopedia/detail.js(v=${version})}"></script>
 </body>
 </html>

src/main/resources/templates/supplier-center/article/article-list.html

@@ -102,6 +102,7 @@
                                     <span class="state warning" v-if="articleInfo.auditStatus === 1">待审核</span>
                                     <span class="state success" v-else-if="articleInfo.auditStatus === 2">审核通过</span>
                                     <span class="state danger" v-else>审核失败</span>
+                                    <span class="reason" v-if="articleInfo.auditStatus === 3" :title="'审核失败：' + articleInfo.failReason">?</span>
                                 </td>
                                 <td class="time">
                                     <div class="time">{{ articleInfo.publishDate | formatDate }}</div>