Merge branch 'master' of http://60.204.229.151:20080/chenkangxu/merchant-web

src/views/modules/datacenter/product-analysis/index.vue

@@ -108,7 +108,6 @@
     <div
       style="
         padding: 10px;
-        height: 48vh;
         border: 1px solid #ccc;
         margin-top: 20px;
       "
@@ -197,6 +196,131 @@
           </el-table>
         </el-col>
       </el-row>
+      <el-row style="margin:20px 0" type="flex" justify="space-between">
+        <el-col :span="11"
+          ><div class="grid-content bg-purple">销售量TOP</div>
+          <el-table
+            :data="productList.saleConutList"
+            border
+            style="width: 100%"
+            height="35vh"
+          >
+            <el-table-column
+              align="center"
+              type="index"
+              label="排名"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column prop="date" label="商品名称">
+              <template slot-scope="scope">
+                <div style="display: flex; align-items: center">
+                  <div>
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.productImg"
+                      :preview-src-list="[scope.row.productImg]"
+                    >
+                    </el-image>
+                  </div>
+                  <div style="margin-left: 10px; color: blue">
+                    {{ scope.row.productName }}
+                  </div>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop="sortData"
+              label="销售量"
+              width="140"
+            >
+            </el-table-column> </el-table
+        ></el-col>
+        <el-col :span="11"
+          ><div class="grid-content bg-purple">销售额TOP</div>
+          <el-table
+            :data="productList.saleMoneyList"
+            border
+            style="width: 100%"
+            height="35vh"
+          >
+            <el-table-column
+              align="center"
+              type="index"
+              label="排名"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column prop="date" label="商品名称">
+              <template slot-scope="scope">
+                <div style="display: flex; align-items: center">
+                  <div>
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.productImg"
+                      :preview-src-list="[scope.row.productImg]"
+                    >
+                    </el-image>
+                  </div>
+                  <div style="margin-left: 10px; color: blue">
+                    {{ scope.row.productName }}
+                  </div>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop="sortData"
+              label="销售额"
+              width="140"
+            >
+            </el-table-column>
+          </el-table>
+        </el-col>
+      </el-row>
+      <el-row style="" type="flex" justify="space-between">
+        <el-col :span="11"
+          ><div class="grid-content bg-purple">回复率TOP</div>
+          <el-table
+            :data="productList.repurchaseList"
+            border
+            style="width: 100%"
+            height="35vh"
+          >
+            <el-table-column
+              align="center"
+              type="index"
+              label="排名"
+              width="50"
+            >
+            </el-table-column>
+            <el-table-column prop="date" label="商品名称">
+              <template slot-scope="scope">
+                <div style="display: flex; align-items: center">
+                  <div>
+                    <el-image
+                      style="width: 60px; height: 60px"
+                      :src="scope.row.productImg"
+                      :preview-src-list="[scope.row.productImg]"
+                    >
+                    </el-image>
+                  </div>
+                  <div style="margin-left: 10px; color: blue">
+                    {{ scope.row.productName }}
+                  </div>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              align="center"
+              prop="sortData"
+              label="回复率（%）"
+              width="140"
+            >
+            </el-table-column> </el-table
+        ></el-col>
+      </el-row>
     </div>
   </div>
 </template>