From a21199d217587a935dd772f679c220567ddc604f Mon Sep 17 00:00:00 2001
From: gyq <875626088@qq.com>
Date: Sat, 12 Oct 2024 09:47:58 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=95=86=E5=93=81=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                                   |   9 +
 src/views/product/components/stockHistory.vue | 211 +++++++++++++++---
 src/views/product/index.vue                   |   5 +-
 3 files changed, 188 insertions(+), 37 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 1215e93..2e2170d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -131,4 +131,13 @@ export default {
     }
   }
 }
+
+.image-slot {
+  width: 100%;
+  height: 100%;
+  background-color: #efefef;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 </style>
diff --git a/src/views/product/components/stockHistory.vue b/src/views/product/components/stockHistory.vue
index 190467c..af12121 100644
--- a/src/views/product/components/stockHistory.vue
+++ b/src/views/product/components/stockHistory.vue
@@ -2,39 +2,180 @@
 <template>
     <el-dialog width="80%" :title="`${keysList[key]}统计`" :visible.sync="dialogVisible" @close="reset">
         <div class="head-container">
-            <el-table :data="tableData.data" v-loading="tableData.loading" height="400px">
-                <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
-                <el-table-column label="变动后库存">
-                    <template v-slot="scope">
-                        {{ scope.row.leftNumber }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="原有库存" prop="">
-                    <template v-slot="scope">
-                        {{ scope.row.leftNumber + scope.row.stockNumber }}
-                    </template>
-                </el-table-column>
-                <el-table-column label="订单编号" prop="orderNo">
-                    <template v-slot="scope">
-                        <router-link :to="{ path: '/order_manage/order_list', query: { orderNo: scope.row.orderNo } }">
-                            <el-link type="primary">{{ scope.row.orderNo }}</el-link>
-                        </router-link>
-                    </template>
-                </el-table-column>
-                <el-table-column label="操作描述" prop="type"></el-table-column>
-                <el-table-column :label="`${keysList[key]}`" prop="">
-                    <template v-slot="scope">
-                        {{ scope.row.stockNumber }}
-                    </template>
-                </el-table-column>
-                <!-- <el-table-column label="报损" prop=""></el-table-column> -->
-                <el-table-column label="操作人" prop="operator"></el-table-column>
-                <el-table-column label="备注" prop="remark"></el-table-column>
-                <el-table-column label="操作时间" prop="updatedAt">
-                    <template v-slot="scope">
-                        {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
-                    </template>
-                </el-table-column>
+            <el-table ref="table" :data="tableData.data" v-loading="tableData.loading" height="400px"
+                v-if="dialogVisible">
+                <!-- 销量统计 -->
+                <template v-if="key == 'saleNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="原库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ scope.row.leftNumber + scope.row.stockNumber }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="销量" prop="saleNumber"></el-table-column>
+                    <el-table-column label="订单编号" prop="orderNo">
+                        <template v-slot="scope">
+                            <router-link
+                                :to="{ path: '/order_manage/order_list', query: { orderNo: scope.row.orderNo } }">
+                                <el-link type="primary">{{ scope.row.orderNo }}</el-link>
+                            </router-link>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 减少数量统计 -->
+                <template v-if="key == 'subCountNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="原有库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手动减少" prop="subNumber"></el-table-column>
+                    <el-table-column label="销售量" prop="saleNumber"></el-table-column>
+                    <el-table-column label="报损" prop="lossNumber"></el-table-column>
+                    <el-table-column label="操作人" prop="operator"></el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 手动减少统计 -->
+                <template v-if="key == 'subNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="原有库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手动减少" prop="subNumber"></el-table-column>
+                    <el-table-column label="操作人" prop="operator"></el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 报损统计 -->
+                <template v-if="key == 'lossNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="原库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="报损数量" prop="lossNumber"></el-table-column>
+                    <el-table-column label="报损人" prop="operator"></el-table-column>
+                    <el-table-column label="图片" prop="coverImg">
+                        <template v-slot="scope">
+                            <el-image :src="scope.row.coverImg" style="width: 40px;height: 40px;">
+                                <div slot="error" class="image-slot">
+                                    <i class="el-icon-picture-outline"></i>
+                                </div>
+                            </el-image>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 增加数量统计 -->
+                <template v-if="key == 'addCountNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="原库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手动增加" prop="addNumber"></el-table-column>
+                    <el-table-column label="退货" prop="refundNumber"></el-table-column>
+                    <el-table-column label="操作人" prop="operator"></el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 手动增加统计 -->
+                <template v-if="key == 'addNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="原库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手动增加" prop="addNumber"></el-table-column>
+                    <el-table-column label="操作人" prop="operator"></el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
+                <!-- 退货统计 -->
+                <template v-if="key == 'refundNumber'">
+                    <el-table-column label="商品名称/规格名称" prop="productName"></el-table-column>
+                    <el-table-column label="变动后库存">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber + scope.row.stockNumber}${scope.row.unitName}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="原库存" prop="leftNumber">
+                        <template v-slot="scope">
+                            {{ `${scope.row.leftNumber}` }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="退货" prop="refundNumber"></el-table-column>
+                    <el-table-column label="操作人" prop="operator"></el-table-column>
+                    <el-table-column label="备注" prop="remark"></el-table-column>
+                    <el-table-column label="操作时间" prop="updatedAt">
+                        <template v-slot="scope">
+                            {{ dayjs(scope.row.updatedAt).format('YYYY-MM-DD HH:mm:ss') }}
+                        </template>
+                    </el-table-column>
+                </template>
             </el-table>
         </div>
         <div class="head-container">
@@ -59,7 +200,7 @@ export default {
         return {
             dayjs,
             dialogVisible: false,
-            key: 'stockNumber',
+            key: 'saleNumber',
             keysList: {
                 stockNumber: '现有数量',
                 addCountNumber: '增加数量',
@@ -67,7 +208,7 @@ export default {
                 refundNumber: '退货',
                 subCountNumber: '减少数量',
                 subNumber: '手动减少',
-                saleNumber: '销售量',
+                saleNumber: '销量',
                 lossNumber: '报损',
             },
             productId: '',
diff --git a/src/views/product/index.vue b/src/views/product/index.vue
index e8eeb76..844e94f 100644
--- a/src/views/product/index.vue
+++ b/src/views/product/index.vue
@@ -37,8 +37,9 @@
           </div>
           <div class="info">
             <div class="row">
-              <span>现有数量</span>
-              <span class="link" @click="showStockHistory('stockNumber')">{{ countInfo.stockNumber || 0 }}</span>
+              <span>商品种数</span>
+              <!-- @click="showStockHistory('stockNumber')" -->
+              <span>{{ tableData.total || 0 }}</span>
             </div>
           </div>
         </div>