会员中心添加首页按钮，pclogo改为阿里云地址，编辑折扣券没有传折扣值，

manager/src/views/goods/goods-info/goodsDetail.vue

@@ -1,62 +1,35 @@
 <template>
   <div>
-    <Form
-      :label-width="120"
-    >
-      <div class="content-goods-publish">
+    <Form :label-width="120">
+      <Card>
         <div class="base-info-item">
           <h4>基本信息</h4>
           <div class="form-item-view">
             <FormItem label="商品分类">
-              <span v-for="item in goods.categoryName"> {{ item }} > </span>
+              <span v-for="(item,index) in goods.categoryName" :key="index"> {{ item }} <i v-if="index !== (goods.categoryName.length-1)">&gt;</i> </span>
             </FormItem>
-            <FormItem label="商品名称" prop="goodsName">
+            <FormItem label="商品名称">
               {{ goods.goodsName }}
             </FormItem>
 
-            <FormItem label="商品卖点" prop="sellingPoint">
+            <FormItem label="商品卖点">
               {{ goods.sellingPoint }}
             </FormItem>
           </div>
           <h4>商品交易信息</h4>
           <div class="form-item-view">
-            <FormItem
-              class="form-item-view-el"
-              label="计量单位"
-              prop="goodsUnit"
-            > {{ goods.goodsUnit }}
-            </FormItem>
-            <FormItem
-              class="form-item-view-el"
-              label="销售模式"
-              prop="salesModel"
-            >
+            <FormItem label="计量单位"> {{ goods.goodsUnit }}</FormItem>
+            <FormItem label="销售模式">
               {{ goods.salesModel === 'RETAIL' ? '零售型' : '批发型' }}
             </FormItem>
           </div>
           <h4>商品规格及图片</h4>
           <div class="form-item-view">
-            <FormItem label="商品编号" prop="sn">
-              {{ goods.sn }}
-            </FormItem>
-            <FormItem label="商品价格" prop="price">
-              ¥{{ goods.price | unitPrice }}
-            </FormItem>
-            <FormItem label="市场价格" prop="cost">
-
-              ¥{{ goods.cost | unitPrice }}
-            </FormItem>
-            <FormItem
-              class="form-item-view-el"
-              label="商品图片"
-              prop="goodsGalleryFiles"
-            >
-
-              <div
-                class="demo-upload-list"
-                v-for="(item, __index) in goods.goodsGalleryList"
-                :key="__index"
-              >
+            <FormItem label="商品编号"> {{ goods.sn }}</FormItem>
+            <FormItem label="商品价格"> ¥{{ goods.price | unitPrice }} </FormItem>
+            <FormItem label="市场价格"> ¥{{ goods.cost | unitPrice }} </FormItem>
+            <FormItem label="商品图片">
+              <div class="demo-upload-list" v-for="(item, __index) in goods.goodsGalleryList" :key="__index">
                 <img :src="item"/>
                 <div class="demo-upload-list-cover">
                   <Icon
@@ -64,7 +37,6 @@
                     @click.native="handleViewGoodsPicture(item)"
                   ></Icon>
                 </div>
-
                 <Modal title="View Image" v-model="goodsPictureVisible">
                   <img
                     :src="previewGoodsPicture"
@@ -73,70 +45,50 @@
                   />
                 </Modal>
               </div>
-
-
             </FormItem>
-
-
-            <FormItem
-              class="form-item-view-el"
-              label="商品规格"
-            >
-
+            <FormItem label="商品规格">
               <Table :columns="skuColumn" :data="skuData">
-
-                <!-- 商品栏目格式化 -->
                 <template slot="showImage" slot-scope="scope">
-
                   <div style="margin-top: 5px;height: 80px; display: flex;">
-                    <div style="">
+                    <div>
                       <img :src="scope.row.image" style="height: 60px;margin-top: 1px;width: 60px">
                     </div>
                   </div>
                 </template>
               </Table>
-
             </FormItem>
-
-
           </div>
           <h4>商品详情描述</h4>
           <div class="form-item-view">
-            <FormItem class="form-item-view-el" label="商品描述" prop="intro">
+            <FormItem label="商品描述">
               <div v-html="goods.intro"></div>
             </FormItem>
             <FormItem
-              class="form-item-view-el"
               label="移动端描述"
-              prop="skuList"
             >
               <div v-html="goods.mobileIntro"></div>
             </FormItem>
           </div>
           <h4>商品物流信息</h4>
           <div class="form-item-view">
-            <FormItem class="form-item-view-el" label="商品重量" prop="weight">
+            <FormItem label="商品重量">
               <Input v-model="goods.weight">
                 <span slot="append">kg</span>
               </Input>
             </FormItem>
           </div>
         </div>
-      </div>
+      </Card>
     </Form>
   </div>
 </template>
-
 <script>
-
 import {getGoodsDetail} from "@/api/goods";
-
 export default {
-
   name: "goodsDetail",
   data() {
     return {
-      goods: '', // 商品信息
+      goods: {}, // 商品信息
       previewGoodsPicture: '', // 预览图片
       goodsPictureVisible: false, // 预览图片模态框
       skuColumn: [ // 规格表头
@@ -149,7 +101,7 @@ export default {
           key: 'sn'
         },
         {
-          title: '重量',
+          title: '重量(kg)',
           key: 'weight'
         },
         {
@@ -173,12 +125,12 @@ export default {
   }
   ,
   methods: {
+    // 初始化数据，获取商品详情
     initGoods(id) {
       getGoodsDetail(id).then(res => {
         this.goods = res.result;
         let that = this
         res.result.skuList.forEach(function (sku, index, array) {
-          console.log(sku)
           that.skuData.push({
             'specs': sku.goodsName,
             'sn': sku.sn,
@@ -191,9 +143,8 @@ export default {
         console.warn(this.skuData)
 
       });
-    }
-    ,
-
+    },
+    // 预览商品图片
     handleViewGoodsPicture(url) {
       this.previewGoodsPicture = url;
       this.goodsPictureVisible = true;
@@ -207,8 +158,61 @@ export default {
 </script>
 
 <style lang="scss" soped>
-@import "./goodsDetail.scss";
+/*平铺*/
+div.base-info-item {
+  h4 {
+    margin-bottom: 10px;
+    padding: 0 10px;
+    border: 1px solid #ddd;
+    background-color: #f8f8f8;
+    font-weight: bold;
+    color: #333;
+    font-size: 14px;
+    line-height: 40px;
+    text-align: left;
+  }
 
+  .form-item-view {
+    padding-left: 80px;
+  }
+}
+
+.demo-upload-list{
+  display: inline-block;
+  width: 60px;
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border: 1px solid transparent;
+  border-radius: 4px;
+  overflow: hidden;
+  background: #fff;
+  position: relative;
+  box-shadow: 0 1px 1px rgba(0,0,0,.2);
+  margin-right: 4px;
+}
+.demo-upload-list img{
+  width: 100%;
+  height: 100%;
+}
+.demo-upload-list-cover{
+  display: none;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: rgba(0,0,0,.6);
+}
+.demo-upload-list:hover .demo-upload-list-cover{
+  display: block;
+}
+.demo-upload-list-cover i{
+  color: #fff;
+  font-size: 20px;
+  cursor: pointer;
+  margin: 0 2px;
+}
 .ivu-table table {
   width: 100% !important;
 }