产品详情页

src/router/routers.js

@@ -52,6 +52,14 @@ export const constantRouterMap = [
     },
     hidden: true
   },
+  {
+    path: '/product/details/:id',
+    meta: { title: '供应商黄页', noCache: true },
+    component: (resolve) => {
+      return require(['@/views/homepage/product/details'], resolve)
+    },
+    hidden: true
+  },
   {
     path: '/supplier',
     meta: { title: '优质供应商', noCache: true },

src/views/backstage/productMgt/productTabulate/add.vue

@@ -60,10 +60,10 @@
           </el-row>
           <el-row>
             <el-col :span="5" class="grid-content">
-              <div class="grid-label">产品名</div>
+              <div class="grid-label">批号</div>
             </el-col>
             <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeProductName" placeholder="产品名" />
+              <el-input v-model="formData.attributeBatchNumber" placeholder="批号" />
             </el-col>
             <el-col :span="5" class="grid-content">
               <div class="grid-label">额定功率</div>
@@ -132,15 +132,9 @@
             <el-col :span="5" class="grid-content">
               <div class="grid-label">适用场景</div>
             </el-col>
-            <el-col :span="7" class="grid-content">
+            <el-col :span="19" class="grid-content">
               <el-input v-model="formData.attributeApplicableScenarios" placeholder="适用场景" />
             </el-col>
-            <el-col :span="5" class="grid-content">
-              <div class="grid-label">批号</div>
-            </el-col>
-            <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeBatchNumber" placeholder="批号" />
-            </el-col>
           </el-row>
         </div>
       </el-form-item>

src/views/backstage/productMgt/productTabulate/edit.vue

@@ -60,10 +60,10 @@
           </el-row>
           <el-row>
             <el-col :span="5" class="grid-content">
-              <div class="grid-label">产品名</div>
+              <div class="grid-label">批号</div>
             </el-col>
             <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeProductName" placeholder="产品名" />
+              <el-input v-model="formData.attributeBatchNumber" placeholder="批号" />
             </el-col>
             <el-col :span="5" class="grid-content">
               <div class="grid-label">额定功率</div>
@@ -132,15 +132,9 @@
             <el-col :span="5" class="grid-content">
               <div class="grid-label">适用场景</div>
             </el-col>
-            <el-col :span="7" class="grid-content">
+            <el-col :span="19" class="grid-content">
               <el-input v-model="formData.attributeApplicableScenarios" placeholder="适用场景" />
             </el-col>
-            <el-col :span="5" class="grid-content">
-              <div class="grid-label">批号</div>
-            </el-col>
-            <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeBatchNumber" placeholder="批号" />
-            </el-col>
           </el-row>
         </div>
       </el-form-item>

src/views/backstage/productMgt/productTabulate/view.vue

@@ -61,10 +61,10 @@
           </el-row>
           <el-row>
             <el-col :span="5" class="grid-content">
-              <div class="grid-label">产品名</div>
+              <div class="grid-label">批号</div>
             </el-col>
             <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeProductName" disabled placeholder="产品名" />
+              <el-input v-model="formData.attributeBatchNumber" disabled placeholder="批号" />
             </el-col>
             <el-col :span="5" class="grid-content">
               <div class="grid-label">额定功率</div>
@@ -133,15 +133,9 @@
             <el-col :span="5" class="grid-content">
               <div class="grid-label">适用场景</div>
             </el-col>
-            <el-col :span="7" class="grid-content">
+            <el-col :span="19" class="grid-content">
               <el-input v-model="formData.attributeApplicableScenarios" disabled placeholder="适用场景" />
             </el-col>
-            <el-col :span="5" class="grid-content">
-              <div class="grid-label">批号</div>
-            </el-col>
-            <el-col :span="7" class="grid-content">
-              <el-input v-model="formData.attributeBatchNumber" disabled placeholder="批号" />
-            </el-col>
           </el-row>
         </div>
       </el-form-item>
@@ -294,7 +288,7 @@ export default {
         attributeProducingArea: '', // 属性-产地
         attributeNumber: '', // 属性-数量
         attributeColor: '', // 属性-颜色
-        attributeApplicableScenarios: '', // 属性-品牌
+        attributeApplicableScenarios: '', // 属性-适用场景
         attributeBatchNumber: '', // 属性-批号
         rank: '1' // 产品品级
       },

src/views/homepage/index.vue

@@ -34,7 +34,7 @@
             </el-image>
             <el-row>
               <el-col :span="21">
-                <div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div>
+                <div class="title touch" :title="item.title" @click="goToDetails(item, '/product/details')">{{ item.title }}</div>
               </el-col>
               <el-col :span="3">
                 <img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" title="点击取消收藏" @click="storeShowcase(item, 'product')">
@@ -121,7 +121,7 @@
             <ul class="contact-list">
               <li v-for="(item, index) in topSuppliers" :key="'ts_'+index" class="contact-item">
                 <img src="@/assets/home_images/to_like_b.png">
-                <span class="touch" @click="goToDetails(item, 'supplier')">{{ item.name }}</span>
+                <span class="touch" @click="goToDetails(item, '/supplier/details')">{{ item.name }}</span>
               </li>
             </ul>
           </div></el-col>
@@ -130,7 +130,7 @@
             <ul class="contact-list">
               <li v-for="(item, index) in topProducts" :key="'tp_'+index" class="contact-item">
                 <img src="@/assets/home_images/to_like_a.png">
-                <span class="touch" @click="goToDetails(item, 'product')">{{ item.name }}</span>
+                <span class="touch" @click="goToDetails(item, '/product/details')">{{ item.name }}</span>
               </li>
             </ul>
           </div></el-col>

src/views/homepage/product/index.vue

@@ -93,7 +93,7 @@
             </el-image>
             <el-row>
               <el-col :span="21">
-                <div class="title touch" :title="item.title" @click="goToDetails(item, 'product')">{{ item.title }}</div>
+                <div class="title touch" :title="item.title" @click="goToDetails(item, '/product/details')">{{ item.title }}</div>
               </el-col>
               <el-col :span="3">
                 <img v-if="item.isStore" class="touch" src="@/assets/home_images/to_like_h.png" title="点击取消收藏" @click="storeShowcase(item, 'product')">
@@ -132,7 +132,7 @@
               </div>
             </el-col>
             <el-col :span="12">
-              <div class="box-title touch" @click="goToDetails(item, 'project')">{{ item.title }}</div>
+              <div class="box-title touch" @click="goToDetails(item, '/product/details')">{{ item.title }}</div>
               <div class="content ellipsis">{{ item.content }}</div>
               <div class="line-btn" style="margin-top: 4px;justify-content: flex-end;">
                 <div class="btn-o" style="width: 140px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'project')">咨 询</div>
@@ -149,7 +149,7 @@
               :src="item.imgSrc?imgSrcStart+'/img'+item.imgSrc:defaultImgSoftware"
               style="width:358px;height: 240px;left: -4px;top: -3px"
             />
-            <div class="float-title touch" @click="goToDetails(item, 'software')">{{ item.title }}</div>
+            <div class="float-title touch" @click="goToDetails(item, '/product/details')">{{ item.title }}</div>
             <div class="line-btn" style="margin-top: 4px">
               <div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'software')">免费获取方案</div>
             </div>
@@ -164,7 +164,7 @@
               :src="item.imgSrc?imgSrcStart+'/img'+item.imgSrc:defaultImgSoftware"
               style="width:358px;height: 240px;left: -4px;top: -3px"
             />
-            <div class="line-text touch" @click="goToDetails(item, 'course')">{{ item.title }}</div>
+            <div class="line-text touch" @click="goToDetails(item, '/product/details')">{{ item.title }}</div>
             <div style="width: 100%;text-align: center;padding: 2px;color: #333">{{ item.subTitle }}</div>
             <div class="line-btn" style="margin-top: 14px">
               <div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'course')">课程定制</div>
@@ -379,8 +379,12 @@ export default {
       console.log(item, type)
     },
     // 跳转到详情
-    goToDetails(item, type) {
-      console.log(item, type)
+    goToDetails(item, path) {
+      if (item) {
+        this.$router.push({ path: `${path}/${item.id || 123}` })
+      } else {
+        this.$router.push({ path: `${path}` })
+      }
     },
     // 点击更多
     moreTo(type) {

src/views/homepage/supplier/index.vue

@@ -99,7 +99,7 @@
           </div>
           <div v-for="(p,i) in item.products" :key="'p_'+index+'_'+i" class="product_card">
             <el-image :src="p.imgSrc?imgSrcStart+'/img'+p.imgSrc:defaultImgProduct" style="width:240px;height: 220px;border-radius: 10px;" />
-            <div class="product_title touch ellipsis" :title="p.name">{{ p.name }}</div>
+            <div class="product_title touch ellipsis" :title="p.name" @click="goToDetails(p, '/product/details')">{{ p.name }}</div>
           </div>
         </div>
         <div class="pagination">