添加统计

src/views/modules/marketing/user/index.vue

@@ -86,6 +86,31 @@
             <el-button type="primary" @click="Reset">重置</el-button>
           </el-form-item>
         </el-form>
+        <div class="stat-list">
+          <div class="stat-item">
+            <i style="font-size: 22px" class="el-icon-user-solid"></i>
+            <div class="stat-right">
+              <div class="stat-title">用户数量（人）</div>
+              <div class="stat-value">
+                <span style="font-size: 20px">99999</span>
+              </div>
+            </div>
+          </div>
+          <div class="stat-item">
+            <i style="font-size: 22px" class="el-icon-s-custom"></i>
+            <div class="stat-right">
+              <div class="stat-title">今日新增（人）</div>
+              <div class="stat-value">
+                <span style="font-size: 20px">234</span>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="mb-2">
+          <el-button type="success" size="small" @click="userExport"
+            >导出</el-button
+          >
+        </div>
       </template>
     </obj-table-plus>
     <!-- 修改积分或成长值 -->
@@ -99,6 +124,8 @@
 </template>
 
 <script>
+import * as XLSX from "xlsx";
+import { saveAs } from "file-saver";
 import modifyPoints from "./popup/modify-points.vue";
 import viewDetails from "./popup/view-details.vue";
 import { mapState } from "vuex";
@@ -181,6 +208,42 @@ export default {
         this.form.endRegistrationTime = "";
       }
     },
+    async userExport() {
+        let now = new Date();
+      let year = now.getFullYear();
+      let month = now.getMonth() + 1;
+      let day = now.getDate();
+      let res = await this.$api.marketing.marketingUserPage({
+        pageNumber: 1,
+        pageSize: 9999999,
+        ...this.formInline,
+        ...this.form,
+      });
+      console.log(res);
+      let userData = res.data.data.data.map((item) => {
+        return {
+          用户ID: item.userId,
+          用户头像: item.headUrl,
+          用户昵称: item.username,
+          手机号: item.mobile,
+          会员等级id: item.levelId,
+          会员等级名称: item.levelName,
+          生日: item.birthday,
+          注册时间: item.registrationTime,
+        };
+      });
+
+      const workbook = XLSX.utils.book_new();
+      const worksheet = XLSX.utils.json_to_sheet(userData);
+
+      XLSX.utils.book_append_sheet(workbook, worksheet, "用户管理");
+      const excelData = XLSX.write(workbook, {
+        type: "array",
+        bookType: "xlsx",
+      });
+      const blob = new Blob([excelData], { type: "application/octet-stream" });
+      saveAs(blob, `用户管理-${year + "" + month + day}.xlsx`);
+    },
   },
   computed: {
     tableCols() {
@@ -345,4 +408,27 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.stat-list {
+  display: flex;
+  align-items: center;
+  /* justify-content: space-between; */
+  // flex-wrap: wrap;
+  margin-bottom: 10px;
+  padding: 10px;
+  border: 1px solid #ccc;
+}
+.stat-item {
+  width: 30%;
+  margin: 20px 20px;
+  display: flex;
+  align-items: center;
+}
+.stat-right {
+  margin-left: 12px;
+  font-size: 18px;
+}
+.stat-title {
+  margin-bottom: 5px;
+}
+</style>

src/views/modules/product/commodity/index.vue

@@ -62,6 +62,44 @@
               <el-button type="primary" @click="Reset">重置</el-button>
             </el-form-item>
           </el-form>
+          <div class="stat-list">
+            <div class="stat-item">
+              <i style="font-size: 22px" class="el-icon-s-goods"></i>
+              <div class="stat-right">
+                <div class="stat-title">总商品数量（个）</div>
+                <div class="stat-value">
+                  <span style="font-size: 20px">99999</span>
+                </div>
+              </div>
+            </div>
+            <div class="stat-item">
+              <i style="font-size: 22px" class="el-icon-s-shop"></i>
+              <div class="stat-right">
+                <div class="stat-title">上架中商品数量（个）</div>
+                <div class="stat-value">
+                  <span style="font-size: 20px">234</span>
+                </div>
+              </div>
+            </div>
+            <div class="stat-item">
+              <i style="font-size: 22px" class="el-icon-s-marketing"></i>
+              <div class="stat-right">
+                <div class="stat-title">折扣商品数量（个）</div>
+                <div class="stat-value">
+                  <span style="font-size: 20px">99999</span>
+                </div>
+              </div>
+            </div>
+            <div class="stat-item">
+              <i style="font-size: 22px" class="el-icon-s-promotion"></i>
+              <div class="stat-right">
+                <div class="stat-title">仓库中商品数量（个）</div>
+                <div class="stat-value">
+                  <span style="font-size: 20px">234</span>
+                </div>
+              </div>
+            </div>
+          </div>
           <el-tabs v-model="activeName" @tab-click="handleClick">
             <el-tab-pane label="在售" name="在售"></el-tab-pane>
             <el-tab-pane label="仓库中" name="仓库中"></el-tab-pane>
@@ -427,4 +465,27 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.stat-list {
+  display: flex;
+  align-items: center;
+  /* justify-content: space-between; */
+  // flex-wrap: wrap;
+  margin-bottom: 10px;
+  padding: 10px;
+  border: 1px solid #ccc;
+}
+.stat-item {
+  width: 20%;
+  margin: 20px 20px;
+  display: flex;
+  align-items: center;
+}
+.stat-right {
+  margin-left: 12px;
+  font-size: 18px;
+}
+.stat-title {
+  margin-bottom: 5px;
+}
+</style>