管理后台-商品管理：添加商品

htmldev/manage/src/views/business/pms/goods/details.vue

@@ -373,26 +373,28 @@ export default {
       for (const key in this.exData) {
         if (this.form.hasOwnProperty(key)) {
           let value = this.exData[key]
-          if (key === 'product_img_url') {
-            value = [value]
+          if ((Array.isArray(value) && value.length >= 1) || (Object.prototype.toString.call(value) === '[object Object]') || (typeof value === 'string' && value) || typeof value === 'number') {
+            if (key === 'product_img_url') {
+              value = [value]
+            }
+            if (key === 'product_place' || key === 'product_status') {
+              value = value.toString()
+            }
+            if (key === 'skus') {
+              value = value.map(item => ({
+                ...item,
+                product_status: item.product_status === 1,
+                product_price: fen2Yuan(item.product_price)
+              }))
+            }
+            if (key === 'attachs') {
+              value = value.map(item => ({
+                ...item,
+                attach_content: item.attach_content.split(',')
+              }))
+            }
+            this.$set(this.form, key, value)
           }
-          if (key === 'product_place' || key === 'product_status') {
-            value = value.toString()
-          }
-          if (key === 'skus') {
-            value = value.map(item => ({
-              ...item,
-              product_status: item.product_status === 1,
-              product_price: fen2Yuan(item.product_price)
-            }))
-          }
-          if (key === 'attachs') {
-            value = value.map(item => ({
-              ...item,
-              attach_content: item.attach_content.split(',')
-            }))
-          }
-          this.$set(this.form, key, value)
         }
       }
     }

htmldev/manage/src/views/business/pms/goods/index.vue

@@ -47,47 +47,108 @@
               <span>{{ props.row.id }}</span>
             </el-form-item>
             <el-form-item label="商品名称">
-              <span>{{ props.row.bar_name }}</span>
-            </el-form-item>
-            <el-form-item label="价格（元）">
-              <span>{{ props.row.bar_address }}</span>
+              <span>{{ props.row.product_name }}</span>
             </el-form-item>
             <el-form-item label="商品分类">
-              <span>{{ ['无效', '有效'][props.row.bar_status] }}</span>
+              <span>{{ props.row.category_name }}</span>
             </el-form-item>
-            <el-form-item label="上架">
-              <span>{{ props.row.bar_song_start_time }}</span>
+            <el-form-item label="价格（元）">
+              <span>{{ props.row.product_price | fen2Yuan }}</span>
             </el-form-item>
             <el-form-item label="出单位置">
-              <span>{{ props.row.bar_song_end_time }}</span>
+              <span>{{ ['', '厨房', '柜台'][props.row.product_place] }}</span>
             </el-form-item>
-            <el-form-item label="酒吧座位预定开始时间">
-              <span>{{ props.row.bar_place_reserve_start_time }}</span>
+            <el-form-item label="是否上架">
+              <span>{{ ['下架', '上架'][props.row.product_status] }}</span>
             </el-form-item>
-            <el-form-item label="酒吧座位预定结束时间">
-              <span>{{ props.row.bar_place_reserve_end_time }}</span>
+            <el-form-item label="商品描述">
+              <div v-html="props.row.product_desc"></div>
             </el-form-item>
-            <el-form-item label="门店图片">
+            <el-form-item label="商品图片">
               <el-image style="width: 100px; height: 100px"
-                        :src="props.row.bar_img_url[0]"
-                        :preview-src-list="props.row.bar_img_url">
+                        :src="props.row.product_img_url"
+                        :preview-src-list="[props.row.product_img_url]">
               </el-image>
             </el-form-item>
+            <el-form-item label="创建时间">
+              <span>{{ props.row.created_at }}</span>
+            </el-form-item>
+            <el-form-item label="更新时间">
+              <span>{{ props.row.updated_at }}</span>
+            </el-form-item>
+            <el-form-item label="SKU"></el-form-item>
+            <div class="table-layout">
+              <el-row>
+                <el-col :span="2" class="table-cell-title">ID</el-col>
+                <el-col :span="8" class="table-cell-title">SKU名</el-col>
+                <el-col :span="2" class="table-cell-title">库存</el-col>
+                <el-col :span="2" class="table-cell-title">价格</el-col>
+                <el-col :span="2" class="table-cell-title">是否上架</el-col>
+                <el-col :span="4" class="table-cell-title">创建时间</el-col>
+                <el-col :span="4" class="table-cell-title">更新时间</el-col>
+              </el-row>
+              <el-row v-for="(item, index) in props.row.skus"
+                      :key="index">
+                <el-col :span="2" class="table-cell">{{ item.id }}</el-col>
+                <el-col :span="8" class="table-cell">{{ item.product_sku }}</el-col>
+                <el-col :span="2" class="table-cell">{{ item.product_stock }}</el-col>
+                <el-col :span="2" class="table-cell">{{ item.product_price | fen2Yuan }}</el-col>
+                <el-col :span="2" class="table-cell">{{ ['下架', '上架'][item.product_status] }}</el-col>
+                <el-col :span="4" class="table-cell">{{ item.created_at }}</el-col>
+                <el-col :span="4" class="table-cell">{{ item.updated_at }}</el-col>
+              </el-row>
+            </div>
+            <el-form-item label="规格"></el-form-item>
+            <div class="table-layout">
+              <el-row>
+                <el-col :span="2" class="table-cell-title">ID</el-col>
+                <el-col :span="6" class="table-cell-title">附加名</el-col>
+                <el-col :span="8" class="table-cell-title">明细</el-col>
+                <el-col :span="4" class="table-cell-title">创建时间</el-col>
+                <el-col :span="4" class="table-cell-title">更新时间</el-col>
+              </el-row>
+              <el-row v-for="(item, index) in props.row.attachs"
+                      :key="index">
+                <el-col :span="2" class="table-cell">{{ item.id }}</el-col>
+                <el-col :span="6" class="table-cell">{{ item.attach_name }}</el-col>
+                <el-col :span="8" class="table-cell">
+                  <el-tag
+                    class="af-el-tag"
+                    type="info"
+                    v-for="(tag, idx) in item.attach_content.split(',')"
+                    :key="idx">{{ tag }}
+                  </el-tag>
+                </el-col>
+                <el-col :span="4" class="table-cell">{{ item.created_at }}</el-col>
+                <el-col :span="4" class="table-cell">{{ item.updated_at }}</el-col>
+              </el-row>
+            </div>
           </el-form>
         </template>
       </el-table-column>
       <el-table-column label="ID" prop="id" width="160"></el-table-column>
-      <el-table-column label="商品名称" prop="bar_name"></el-table-column>
-      <el-table-column label="价格（元）" prop="bar_address"></el-table-column>
-      <el-table-column label="商品分类" prop="bar_address"></el-table-column>
-      <el-table-column label="上架" width="100">
+      <el-table-column label="商品名称" prop="product_name"></el-table-column>
+      <el-table-column label="商品分类" prop="category_name"></el-table-column>
+      <!--TODO 价格区间-->
+      <el-table-column label="价格（元）">
         <template slot-scope="scope">
-          <p>{{ ['无效', '有效'][scope.row.bar_status] }}</p>
+          <p>{{ scope.row.product_price | fen2Yuan }}</p>
+        </template>
+      </el-table-column>
+      <el-table-column label="出单位置">
+        <template slot-scope="scope">
+          <p>{{ ['', '厨房', '柜台'][scope.row.product_place] }}</p>
+        </template>
+      </el-table-column>
+      <el-table-column label="是否上架" width="100">
+        <template slot-scope="scope">
+          <p>{{ ['下架', '上架'][scope.row.product_status] }}</p>
         </template>
       </el-table-column>
       <el-table-column label="操作" width="100">
         <template slot-scope="scope">
           <el-button type="text" @click="edit(scope.row)">编辑</el-button>
+          <el-button type="text" @click="del(scope.row)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -199,4 +260,37 @@ export default {
     }
   }
 }
+
+.table-layout {
+  margin-top: 20px;
+  border-left: 1px solid #DCDFE6;
+  border-top: 1px solid #DCDFE6;
+}
+
+.table-cell {
+  height: 60px;
+  line-height: 40px;
+  border-right: 1px solid #DCDFE6;
+  border-bottom: 1px solid #DCDFE6;
+  padding: 10px;
+  font-size: 14px;
+  color: #606266;
+  text-align: center;
+  overflow: hidden;
+}
+
+.table-cell-title {
+  border-right: 1px solid #DCDFE6;
+  border-bottom: 1px solid #DCDFE6;
+  padding: 10px;
+  background: #F2F6FC;
+  text-align: center;
+  font-size: 14px;
+  color: #303133;
+}
+
+.af-el-tag {
+  margin-right: 6px;
+  margin-bottom: 6px;
+}
 </style>