Pārlūkot izejas kodu

完善CID订单统计

cgp 2 dienas atpakaļ
vecāks
revīzija
5f68a2fadc

+ 10 - 1
src/api/company/statistics.js

@@ -197,7 +197,7 @@ export function treeselect(query) {
   });
 }
 
-// 查询销售统计列表
+// 员工销售CID订单统计:部门/员工、进粉时间、下单时间 → 进粉量、订单金额、购买次数、购买人数
 export function getSalesStatistics(query) {
   return request({
     url: '/company/statistics/salesStat',
@@ -205,3 +205,12 @@ export function getSalesStatistics(query) {
     data: query
   });
 }
+
+// 员工销售CID订单明细
+export function salesUserDetail(query) {
+  return request({
+    url: '/company/statistics/salesUserDetail',
+    method: 'post',
+    data: query
+  });
+}

+ 111 - 48
src/views/his/statistics/companyStatisticsCID.vue

@@ -2,7 +2,7 @@
   <div class="app-container">
     <!-- 搜索表单 -->
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
-      <!-- 部门选择(树形选择器,参考已有页面) -->
+      <!-- 部门选择-->
       <el-form-item label="归属部门" prop="deptId">
         <treeselect
           style="width: 220px"
@@ -10,38 +10,29 @@
           v-model="queryParams.deptId"
           :options="deptOptions"
           placeholder="请选择归属部门"
-          @select="handleDeptChange"
+          @input="handleDeptChange"
         />
       </el-form-item>
 
-      <el-form-item label="员工姓名" prop="companyUserNickName">
-        <el-input
-          v-model="queryParams.companyUserNickName"
-          placeholder="请输入员工姓名"
+      <!-- 员工选择(根据部门联动) -->
+      <el-form-item label="员工" prop="userId">
+        <el-select
+          v-model="queryParams.userId"
+          placeholder="请选择员工"
           clearable
+          filterable
           size="small"
-          @keyup.enter.native="handleQuery"
-        />
+          :loading="userLoading"
+          @change="handleQuery"
+        >
+          <el-option
+            v-for="user in userList"
+            :key="user.userId"
+            :label="user.nickName || user.userName"
+            :value="user.userId"
+          />
+        </el-select>
       </el-form-item>
-      <!-- 员工选择(根据部门联动) -->
-<!--      <el-form-item label="员工" prop="userId">-->
-<!--        <el-select-->
-<!--          v-model="queryParams.userId"-->
-<!--          placeholder="请选择员工"-->
-<!--          clearable-->
-<!--          filterable-->
-<!--          size="small"-->
-<!--          :loading="userLoading"-->
-<!--          @change="handleQuery"-->
-<!--        >-->
-<!--          <el-option-->
-<!--            v-for="user in userList"-->
-<!--            :key="user.userId"-->
-<!--            :label="user.nickName || user.userName"-->
-<!--            :value="user.userId"-->
-<!--          />-->
-<!--        </el-select>-->
-<!--      </el-form-item>-->
 
       <!-- 进粉时间 -->
       <el-form-item label="进粉时间" prop="addTimeRange">
@@ -80,13 +71,24 @@
     </el-form>
 
     <!-- 表格区域 -->
-    <el-table v-loading="loading" border :data="dataList" style="width: 100%; margin-top: 10px">
+    <el-table
+      v-loading="loading"
+      border
+      :data="dataList"
+      style="width: 100%; margin-top: 10px"
+      @sort-change="handleSortChange"
+    >
       <el-table-column label="员工姓名" align="center" prop="nickName" />
       <el-table-column label="所属部门" align="center" prop="deptName" />
-      <el-table-column label="进粉数" align="center" prop="fansCount" />
-      <el-table-column label="订单总金额" align="center" prop="totalAmount" />
-      <el-table-column label="购买次数" align="center" prop="orderCount" />
-      <el-table-column label="购买人数" align="center" prop="buyerCount" />
+      <el-table-column label="进粉数" align="center" prop="fansCount" sortable="custom" />
+      <el-table-column label="订单总金额" align="center" prop="totalAmount" sortable="custom" />
+      <el-table-column label="购买次数" align="center" prop="orderCount" sortable="custom" />
+      <el-table-column label="购买人数" align="center" prop="buyerCount" sortable="custom" />
+      <el-table-column label="操作" align="center" width="80">
+        <template slot-scope="scope">
+          <el-button type="text" size="mini" @click="handleDetail(scope.row)">详情</el-button>
+        </template>
+      </el-table-column>
     </el-table>
 
     <!-- 分页 -->
@@ -97,13 +99,28 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
+
+    <el-dialog title="用户购买明细" :visible.sync="detailVisible" width="70%">
+      <el-table v-loading="detailLoading" :data="userDetailList" border>
+        <el-table-column label="客户昵称" prop="nickName" />
+        <el-table-column label="购买次数" prop="orderCount" sortable="custom" />
+        <el-table-column label="购买总金额" prop="totalAmount" sortable="custom" />
+      </el-table>
+      <pagination
+        v-show="detailTotal > 0"
+        :total="detailTotal"
+        :page.sync="detailQuery.pageNum"
+        :limit.sync="detailQuery.pageSize"
+        @pagination="fetchUserDetail"
+      />
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { treeselect } from "@/api/company/companyDept";
-import { listUserByDept } from "@/api/company/companyUser";
-import { getSalesStatistics } from "@/api/company/statistics";
+import { listCompanyUser } from "@/api/company/companyUser";
+import { getSalesStatistics,salesUserDetail } from "@/api/company/statistics";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
@@ -112,22 +129,16 @@ export default {
   components: { Treeselect },
   data() {
     return {
-      // 显示搜索条件
       showSearch: true,
-      // 遮罩层
       loading: false,
-      // 总条数
       total: 0,
-      // 部门树选项
       deptOptions: [],
-      // 员工下拉列表
       userList: [],
       userLoading: false,
-      // 进粉时间范围
       addTimeRange: null,
-      // 下单时间范围
       orderTimeRange: null,
-      // 查询参数
+      sortField: '',
+      sortOrder: '',
       queryParams: {
         pageNum: 1,
         pageSize: 10,
@@ -137,10 +148,26 @@ export default {
         startAddTime: null,
         endAddTime: null,
         startOrderTime: null,
-        endOrderTime: null
+        endOrderTime: null,
+        orderByColumn: null,
+        isAsc: null
+      },
+      dataList: [],
+      // 详情弹窗
+      detailVisible: false,
+      detailLoading: false,
+      userDetailList: [],
+      detailTotal: 0,
+      detailQuery: {
+        pageNum: 1,
+        pageSize: 10,
+        companyUserId: null,
+        startOrderTime: null,
+        endOrderTime: null,
+        orderByColumn: null,
+        isAsc: null
       },
-      // 表格数据
-      dataList: []
+      currentEmployee: null
     };
   },
   created() {
@@ -148,6 +175,21 @@ export default {
     this.getList();
   },
   methods: {
+    /** 表格排序变化时 */
+    handleSortChange({ prop, order }) {
+      if (order === 'ascending') {
+        this.queryParams.orderByColumn = prop;
+        this.queryParams.isAsc = 'asc';
+      } else if (order === 'descending') {
+        this.queryParams.orderByColumn = prop;
+        this.queryParams.isAsc = 'desc';
+      } else {
+        // 取消排序
+        this.queryParams.orderByColumn = null;
+        this.queryParams.isAsc = null;
+      }
+      this.handleQuery();
+    },
     /** 查询部门树 */
     getDeptTree() {
       treeselect().then(response => {
@@ -155,13 +197,14 @@ export default {
       });
     },
     /** 部门变更时加载员工列表 */
-    handleDeptChange(deptId) {
+    handleDeptChange() {
       this.queryParams.userId = null;
       this.userList = [];
+      const deptId = this.queryParams.deptId;
       if (deptId) {
         this.userLoading = true;
-        listUserByDept(deptId).then(response => {
-          this.userList = response.data || [];
+        listCompanyUser({ deptId: deptId }).then(response => {
+          this.userList = response.rows || [];
           this.userLoading = false;
         }).catch(() => {
           this.userLoading = false;
@@ -200,6 +243,8 @@ export default {
       this.orderTimeRange = null;
       this.resetForm("queryForm");
       this.userList = [];
+      this.queryParams.orderByColumn = null;
+      this.queryParams.isAsc = null;
       this.handleQuery();
     },
     /** 获取列表数据 */
@@ -212,6 +257,24 @@ export default {
       }).catch(() => {
         this.loading = false;
       });
+    },
+    handleDetail(row) {
+      this.detailVisible = true;
+      this.currentEmployee = row; // 存储员工信息
+      this.detailQuery.companyUserId = row.userId;
+      this.detailQuery.pageNum = 1;
+      // 同时带上主列表已选的下单时间,保证口径一致
+      this.detailQuery.startOrderTime = this.queryParams.startOrderTime;
+      this.detailQuery.endOrderTime = this.queryParams.endOrderTime;
+      this.fetchUserDetail();
+    },
+    fetchUserDetail() {
+      this.detailLoading = true;
+      salesUserDetail(this.detailQuery).then(res => {
+        this.userDetailList = res.rows;
+        this.detailTotal = res.total;
+        this.detailLoading = false;
+      });
     }
   }
 };