fix: 调整商品下架详情展示

xinkeaboard-web/assets/language/en.js

@@ -865,6 +865,8 @@ export const lang_en = {
         '手机': 'Phone',
         '密码': 'Password',
         '登录成功': 'Login successful'
-    }
+    },
 
+    '谢谢您的关注！': 'Thank you for your interest!',
+    '该产品已被下架或移除。': 'The product has been taken down or removed.'
 };

xinkeaboard-web/assets/language/zh.js

@@ -895,5 +895,7 @@ export const lang_zn = {
         '手机': '手机',
         '密码': '密码',
         '登录成功': '登录成功'
-    }
+    },
+    '谢谢您的关注！': '谢谢您的关注！',
+    '该产品已被下架或移除。': '该产品已被下架或移除。'
 };

xinkeaboard-web/assets/style/goodsDetail.scss

@@ -3,6 +3,106 @@
     width: 100%;
     background-color: #F6F8FA;
 
+    .error-wrap {
+        width: 100%;
+        height: 100%;
+
+        &-content {
+            width: 1440px;
+            margin: 0 auto;
+            height: 100%;
+
+            &__tip {
+                width: 100%;
+                height: 488px;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+
+                img {
+                    width: 216px;
+                    height: 216px;
+                }
+
+                .text_1 {
+                    font-weight: 400;
+                    font-size: 14px;
+                    color: #000000;
+                }
+
+                .text_2 {
+                    font-weight: bold;
+                    font-size: 16px;
+                    color: $colorMain;
+                }
+            }
+
+            &__like {
+                width: 100%;
+               
+                display: flex;
+                flex-direction: column;
+
+                .like_title {
+                    height: 42px;                
+                    background: #F6F8FA;
+                    font-weight: bold;
+                    font-size: 16px;
+                    color: #282E30;
+                    text-align: center;
+                    line-height: 42px;
+                }
+
+                .like_list {
+                    display: flex;
+                    flex-wrap: wrap;
+                    background-color: #fff;
+                }
+
+                .like_list_item {
+                    width: 200px;
+                    height: 262px;
+                   
+                    a {
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                        flex-direction: column;
+                        justify-content: center;
+                        align-items: center;
+                    }
+                   .item-img {
+                        width: 160px;
+                        height: 160px;
+                        img {
+                            width: 100%;
+                            height: 100%;
+                            object-fit: cover;
+                        }
+                   }
+
+                   .item-name {
+                        width: 100%;
+                        height: 30px;
+                        overflow: hidden;
+                        padding: 0 10px;
+                        margin-top: 4px;
+                        // white-space: nowrap;
+                        text-overflow: ellipsis;
+                        display: -webkit-box;
+                        -webkit-line-clamp: 2;
+                        -webkit-box-orient: vertical;
+                        font-weight: bold;
+                        font-size: 12px;
+                        color: #282E30;
+                   }
+                }
+
+            }
+        }
+    }
+
     .contain_con {
         width: 100%;
         background: #ffffff;

xinkeaboard-web/components/SldDiy.vue

@@ -137,7 +137,7 @@
               v-bind:style="{ backgroundColor: item.json_data.title_info.title_color }"
               >&nbsp;</font
             > -->
-            <span v-bind:style="{ color: item.json_data.title_info.title_color, fontWeight: 'bold' }">{{
+            <span v-bind:style="{ color: item.json_data.title_info.title_color }">{{
               item.json_data.title_info.title_name
             }}</span>
             <!-- <font

xinkeaboard-web/pages/goods/detail/[id].vue

@@ -991,9 +991,36 @@
         @closeLoingModal="closeEnquiryModal"
       />
 
-      <!-- <div v-if="goodsDetail.data.state !== 3">
-        sdsd
-      </div> -->
+      <div class="error-wrap" v-if="!firstLoading && goodsDetail.data.state !== 3">
+        <div class="error-wrap-content">
+            <div class="error-wrap-content__tip">
+              <img src="/new_empty.png"/>
+              <span class="text_1">{{ L['该产品已被下架或移除。'] }}</span>
+              <span class="text_2">{{ L['谢谢您的关注！'] }}</span>
+            </div>
+            <div class="error-wrap-content__like">
+              <div class="like_title">
+                {{ L['看了又看'] }}
+              </div>
+              <div class="like_list">
+                <div class="like_list_item" v-for="(recommendItem, recommendIndex) in recommendeList.data" :key="recommendIndex">
+                  <router-link
+                    target="_blank"
+                    :to="'/goods/detail/'+ calcProductName(recommendItem.goodsName) +'_'+ recommendItem.defaultProductId"
+                >
+                    <div class="item-img">
+                      <img
+                          :src="recommendItem.goodsImage"
+                          :title="recommendItem.goodsName"
+                      />
+                    </div>
+                    <div class="item-name">{{ recommendItem.goodsName }}</div>
+                  </router-link>
+                </div>
+              </div>
+            </div>
+        </div>
+      </div>
 
     </div>
   </div>