完善 - 运营流水分析

src/api/ResponsiblePersonManagement/ResponsiblePersonManagement.js

@@ -65,3 +65,19 @@ export const getGuildOperatorHistoryList = query => {
         params: query
     });
 };
+// 获取 运营流水分析 - 公会明细
+export const getPageWeekStatDetail = query => {
+    return request({
+        url: '/admin/guildOperator/pageWeekStatDetail',
+        method: 'get',
+        params: query
+    });
+};
+// 获取 运营流水分析 - 公会明细 - 添加备注
+export const guildOperatorMarkDetail = query => {
+    return request({
+        url: '/admin/guildOperator/markDetail',
+        method: 'post',
+        params: query
+    });
+};

src/views/system/OperationFlowAnalysis.vue

@@ -43,8 +43,12 @@
       style="width: 100%; margin-top: 25px"
     >
       <el-table-column prop="partitionDesc" align="center" label="分区" />
-      <el-table-column prop="name" align="center" label="负责人名字" />
-      <el-table-column prop="date" align="center" label="周期" />
+      <el-table-column prop="operatorName" align="center" label="负责人名字" />
+      <el-table-column prop="date" align="center" label="周期">
+        <template v-slot="scope">
+          {{ scope.row.date + "~" + scope.row.endDate }}
+        </template>
+      </el-table-column>
       <el-table-column prop="newGuildCount" align="center" label="新公会数" />
       <el-table-column
         prop="newActiveGuildCount"
@@ -97,7 +101,7 @@
           <el-button
             class="primary"
             type="primary"
-            @click="detailPageFun(scope.row)"
+            @click="regionStatPageFun(scope.row)"
             size="default"
             >地区明细</el-button
           >
@@ -124,18 +128,10 @@
       @current-change="handleCurrentChange"
     />
     <!-- 地区明细弹窗 -->
-    <el-dialog v-model="regionStatDialog" title="地区明细" width="36%" center>
-      <el-table :data="regionStatTable" style="width: 100%">
-        <el-table-column
-          prop="partitionDesc"
-          align="center"
-          label="分区"
-        />
-        <el-table-column
-          prop="newGuildTotalGoldFlow"
-          align="center"
-          label="地区"
-        />
+    <el-dialog v-model="regionStatDialog" title="地区明细" width="70%" center>
+      <el-table :data="regionStatTable" style="width: 100%" ref="multipleTable">
+        <el-table-column prop="partitionDesc" align="center" label="分区" />
+        <el-table-column prop="regionDesc" align="center" label="地区" />
         <el-table-column prop="newGuildCount" align="center" label="新公会数" />
         <el-table-column
           prop="newActiveGuildCount"
@@ -166,21 +162,21 @@
           label="总公会数(有效)"
         />
         <el-table-column
-        prop="guildCount"
+          prop="guildGoldFlow"
           align="center"
           label="本周总钻石流水"
         >
           <template v-slot="scope">
-        {{ formattedNumber(scope.row.guildCount) }}
+            {{ formattedNumber(scope.row.guildGoldFlow) }}
           </template>
         </el-table-column>
         <el-table-column
-        prop="guildCount"
+          prop="guildDiamondFlow"
           align="center"
           label="本周总金币流水"
         >
           <template v-slot="scope">
-        {{ formattedNumber(scope.row.guildGoldCount) }}
+            {{ formattedNumber(scope.row.guildDiamondFlow) }}
           </template>
         </el-table-column>
       </el-table>
@@ -193,17 +189,126 @@
         </span>
       </template>
     </el-dialog>
+    <!-- 公会明细弹窗 -->
+    <el-dialog v-model="statDetailDialog" title="公会明细" width="70%" center>
+      <el-table
+        v-loading="tableStatDetailData.loading"
+        :data="tableStatDetailData.data"
+        ref="multipleTable"
+        @selection-change="handleSelectionChange"
+        border
+        style="width: 100%"
+      >
+        <el-table-column prop="partitionDesc" align="center" label="分区" />
+        <el-table-column prop="regionDesc" align="center" label="地区" />
+        <el-table-column prop="operatorName" align="center" label="负责人" />
+        <el-table-column prop="guildId" align="center" label="公会ID" />
+        <el-table-column
+          prop="guildOwnerErbanNo"
+          align="center"
+          label="公会长ID"
+        />
+        <el-table-column
+          prop="guildCreateTime"
+          align="center"
+          label="公会注册时间"
+        >
+        <template v-slot="scope">
+          {{ dateFormat(scope.row.guildCreateTime)  }}
+        </template>
+        </el-table-column>
+        <el-table-column prop="newGuild" align="center" label="是否为新公会">
+          <template v-slot="scope">
+            {{ scope.row.newGuild ? "是" : "否" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="guildGoldFlow"
+          align="center"
+          label="本周钻石流水"
+        >
+          <template v-slot="scope">
+            {{ formattedNumber(scope.row.guildGoldFlow) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="guildGoldFlowWow"
+          align="center"
+          label="周环比/钻石流水"
+        />
+        <el-table-column
+          prop="guildDiamondFlowSub"
+          align="center"
+          label="周涨跌幅度/钻石流水"
+        />
+        <el-table-column
+          prop="guildDiamondFlow"
+          align="center"
+          label="本周金币流水"
+        >
+          <template v-slot="scope">
+            {{ formattedNumber(scope.row.guildDiamondFlow) }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="remark" align="center" label="备注">
+          <template v-slot="scope">
+            <el-button type="text" size="small" @click="remarkFun(scope.row)">
+              {{ scope.row.remark?scope.row.remark:'备注' }}
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+    <el-pagination
+      style="margin-top: 10px"
+      class="paginationClass"
+      :current-page="formStatDetailData.pageNo"
+      :page-size="formStatDetailData.pageSize"
+      :page-sizes="[10, 20, 50, 100, 200]"
+      layout="sizes, prev, pager, next"
+      :total="tableStatDetailData.total"
+      @size-change="handleSizeChangeDetail"
+      @current-change="handleCurrentChangeDetail"
+    />
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button type="primary" @click="statDetailDialog = false">
+            关闭
+          </el-button>
+        </span>
+      </template>
+    </el-dialog>
+    <!-- 填写备注弹窗 -->
+    <el-dialog v-model="remarkDialog" title="备注" width="30%" center>
+        <div style="margin-bottom: 25px; margin-top: 10px; display: flex">
+        <span style="display: inline-block; margin-right: 20px"
+              class="col-sm-2 control-label">备注</span>
+        <el-input v-model="remarkData.remark"
+         type="textarea"
+         rows="4"
+                  placeholder="请输入"
+                  class="input"></el-input>
+      </div>
+      <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="remarkDialog = false">取消</el-button>
+                    <el-button type="primary" @click="confirmRemarkFun()"> 确认 </el-button>
+                </span>
+            </template>
+        </el-dialog>
   </div>
 </template>
 
 <script>
-import { ref, onMounted, reactive,computed } from "vue";
+import { ref, onMounted, reactive, computed } from "vue";
 import { ElMessage, ElMessageBox } from "element-plus";
 import PartitionSelect from "../common/partitionSelect.vue";
 import {
   getGuildOperatorListAll,
   getGuildOperatorPageWeekStatList,
   familyMemberWeekLevelRewardListCycleDate,
+  getPageWeekStatDetail,
+  guildOperatorMarkDetail
 } from "@/api/ResponsiblePersonManagement/ResponsiblePersonManagement.js";
 import { dateFormat } from "@/utils/system-helper";
 export default {
@@ -226,6 +331,27 @@ export default {
       total: 0,
       loading: false,
     });
+    const statDetailDialog = ref(false);
+    const tableStatDetailData = reactive({
+      data: [],
+      total: 0,
+      loading: false,
+    });
+    const formStatDetailData = reactive({
+      partitionId: undefined,
+      pageNo: 1,
+      pageSize: 10,
+      operatorId: "",
+      date: "",
+    });
+    const remarkDialog = ref(false);
+    const remarkData = reactive({
+      partitionId: '',
+      operatorId: "",
+      date: "",
+      guildId:'',
+      remark:'',
+    });
     const getData = () => {
       tableData.loading = true;
       getGuildOperatorPageWeekStatList(formData).then((res) => {
@@ -239,6 +365,58 @@ export default {
         }
       });
     };
+    // 地区明细
+    const regionStatPageFun = (row) => {
+      regionStatTable.value = JSON.parse(row.regionStat);
+      regionStatDialog.value = true;
+    };
+    // 公会明细
+    const detailPageFun = (row) => {
+      formStatDetailData.partitionId = row.partitionId;
+      formStatDetailData.operatorId = row.operatorId;
+      formStatDetailData.date = row.date;
+      tableStatDetailData.loading = true;
+      getPageWeekStatDetail(formStatDetailData).then((res) => {
+        if (res.code == 200) {
+          tableStatDetailData.data = res.data.records;
+          tableStatDetailData.loading = false;
+          tableStatDetailData.total = res.data.total;
+          statDetailDialog.value = true;
+        } else {
+          tableStatDetailData.loading = false;
+          ElMessage.error(res.message);
+        }
+      });
+    };
+    // 添加备注
+    const remarkFun = (row) => {
+        remarkData.partitionId = row.partitionId;
+        remarkData.operatorId = row.operatorId;
+        remarkData.guildId  = row.guildId;
+        remarkData.date = row.date;
+        remarkDialog.value = true;
+    };
+    const confirmRemarkFun = () => { 
+        guildOperatorMarkDetail(remarkData).then((res) => {
+        if (res.code == 200) {
+            remarkDialog.value = false;
+            getPageWeekStatDetail(formStatDetailData).then((res) => {
+        if (res.code == 200) {
+          tableStatDetailData.data = res.data.records;
+          tableStatDetailData.loading = false;
+          tableStatDetailData.total = res.data.total;
+          statDetailDialog.value = true;
+        } else {
+          tableStatDetailData.loading = false;
+          ElMessage.error(res.message);
+        }
+      });
+        } else {
+          tableStatDetailData.loading = false;
+          ElMessage.error(res.message);
+        }
+      });
+    };
     // 重置
     const resetFormData = () => {
       Object.assign(formData, {
@@ -251,10 +429,31 @@ export default {
     // 千分位
     const formattedNumber = computed(() => {
       return (num) => {
-                if (num === null || num === undefined) return '';
-                return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+        if (num === null || num === undefined) return "";
+        return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+      };
+    });
+    
+    const dateFormat = (row) => {
+      const date = new Date(row);
+      return date.format("yyyy-MM-dd hh:mm:ss");
+    }
+    const handleSizeChange = (val) => {
+            formData.pageSize = val;
+            getData();
+        };
+        const handleCurrentChange = (val) => {
+            formData.pageNo = val;
+            getData();
+        };
+        const handleSizeChangeDetail = (val) => {
+            formStatDetailData.pageSize = val;
+            getData();
+        };
+        const handleCurrentChangeDetail = (val) => {
+            formStatDetailData.pageNo = val;
+            getData();
         };
-        })
     onMounted(() => {
       getGuildOperatorListAll().then((res) => {
         if (res.code == 200) {
@@ -292,7 +491,21 @@ export default {
       resetFormData,
       regionStatDialog,
       regionStatTable,
-      formattedNumber
+      formattedNumber,
+      regionStatPageFun,
+      tableStatDetailData,
+      statDetailDialog,
+      formStatDetailData,
+      detailPageFun,
+      dateFormat,
+      handleSizeChange,
+      handleCurrentChange,
+      handleSizeChangeDetail,
+      handleCurrentChangeDetail,
+      remarkDialog,
+      remarkData,
+      remarkFun,
+      confirmRemarkFun
     };
   },
 };