1. 登录成功改为跳转 home 页 2.注册成功跳转登录页 3.我的推广码页面样式修改, 推广码列表新增复制玩家推广码和营销推广码功能 4. 明细查询页 ->推广员查询, 玩家查询 5.我的推广页

README.md

@@ -1,26 +1,15 @@
-## todo
-[x] 路由
-[x] 网络请求
-[x] less
-[x] vuex
-[x] elementui
-[x] echart图表
-[x] vuex + axios + loading
-[] router + loading
-[] 404页面样式
-[] loading 渐显渐隐
-
-## 目录详情
-详情见directoryList.md
-
 ## 启动
+
 npm start
 
 ## 打包
+
 npm run build
 
-## 配置启动地址
-配置本地ip 为dev.ll.com => config=>index.js
-端口根据需要修改
-本地ipconfig  查看IPV4地址
+## 2021.6.30
 
+[x] 登录成功改为跳转 home 页
+[x] 注册成功跳转登录页
+[x] 我的推广码页面样式修改, 推广码列表新增复制玩家推广码和营销推广码功能
+[] 明细查询页 ->推广员查询, 玩家查询
+[] 我的推广页

src/App.vue

@@ -59,11 +59,28 @@ export default {
       this.showNav = false;
     }
     this.getUserInfo();
-    // const userInfo = JSON.parse(this.$utils.getCookie("userInfo"));
-    // this.userInfoAction(userInfo);
+    this.onProfit();
   },
   methods: {
-    ...mapActions(["userInfoAction", "queryAction", "isLoginAction"]),
+    ...mapActions([
+      "userInfoAction",
+      "queryAction",
+      "isLoginAction",
+      "userProfitAction",
+    ]),
+
+    // 获取已赚取佣金
+    onProfit() {
+      this.$api.profit().then((res) => {
+        this.checkCode(res);
+        const { code, data } = res.data;
+        if (code) {
+          return;
+        }
+        // 成功 todo
+        this.userProfitAction(data);
+      });
+    },
 
     /**
      * 初始化路由地址
@@ -118,7 +135,6 @@ export default {
           return;
         }
         // 成功
-        this.isLoginAction(true);
         this.$utils.setCookie("userInfo", JSON.stringify(data), 7);
         this.userInfoAction(data);
       });

src/components/ShowMoney/ShowMoney.vue

@@ -44,7 +44,7 @@ export default {
 
 <style lang='less' scoped>
 .show_money {
-  width: 25%;
+  width: 35%;
   padding: 20px;
   margin-right: 20px;
   box-sizing: border-box;

src/store/index.js

@@ -8,6 +8,7 @@ export default new Vuex.Store({
         userInfo: {}, // 用户信息
         query: {}, // 路由携带参数
         token: "", // 用户token
+        userProfit: {}, // 用户详细流水信息
     },
     // 异步操作
     actions: {
@@ -27,6 +28,10 @@ export default new Vuex.Store({
         tokenAction(context, payload) {
             context.commit("tokenMutation", payload)
         },
+        // 用户的推广员和游戏流水
+        userProfitAction(context, payload) {
+            context.commit("userProfitMutation", payload)
+        },
     },
     mutations: {
         // 页面配置
@@ -45,5 +50,9 @@ export default new Vuex.Store({
         tokenMutation(state, payload) {
             state.token = payload
         },
+        // 用户的推广员和游戏流水
+        userProfitMutation(state, payload) {
+            state.userProfit = payload
+        },
     }
 })

src/views/Directly/DirectlyPlayer/DirectlyPlayer.vue

@@ -2,7 +2,7 @@
   <!-- 直属查询页 -->
   <div class="directly_player">
     <!-- 筛选 todo: 这里 搜索框内容以及选择分类需要传递过来 -->
-    <DirectlyPlayerHeader :gameProfit="gameProfit" @onSearch="onSearch" />
+    <DirectlyPlayerHeader @onSearch="onSearch" />
 
     <!-- 玩家查询表格 -->
     <DirectlyPlayerTable
@@ -15,7 +15,7 @@
 
     <!-- 分页 -->
     <el-pagination
-      v-if="tableList && tableList.length > 1"
+      v-if="tableList && totalPage.length > 1"
       class="directly_page"
       layout="prev, pager, next, jumper"
       :total="totalPage * 10"
@@ -43,7 +43,6 @@ export default {
       pageSize: 15, // 一页大小
       pageIndex: 1, // 当前页
       totalPage: 1, // 总页数
-      gameProfit: 0, // 推广员总流水
     };
   },
   computed: {},
@@ -51,8 +50,6 @@ export default {
   created() {},
   mounted() {
     this.onGameUserList(this.pageIndex, this.pageSize);
-    // 推广员总流水
-    this.onGameProfit();
   },
   methods: {
     // 分页页码改变
@@ -72,23 +69,15 @@ export default {
           return;
         }
         // 成功
+        data.data.map((ele) => {
+          const { amount } = ele;
+          ele.amount = (amount / 100).toFixed(2);
+        });
         this.tableList = data.data;
         this.totalPage = Math.ceil(data.count / this.pageSize);
       });
     },
 
-    // 销售总流水
-    onGameProfit() {
-      this.$api.gameProfit().then((res) => {
-        this.checkCode(res);
-        const { code, data } = res.data;
-        if (code) {
-          return;
-        }
-        this.gameProfit = data;
-      });
-    },
-
     // 搜索
     onSearch(searchValue, currentInputValue) {
       console.log(

src/views/Directly/DirectlyPlayer/DirectlyPlayerHeader/DirectlyPlayerHeader.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="directlt_player_head">
     <!-- 玩家总流水 start -->
-    <div class="today_money" :title="gameProfit">
+    <div class="today_money">
       <span class="title"> 玩家总流水 </span>
       <span class="money text_overflow">
-        {{ gameProfit }}
+        {{ (userProfit.game_user_amount / 100).toFixed(2) }}
       </span>
     </div>
     <!-- 玩家总流水 end -->
@@ -38,6 +38,7 @@
 
 <script>
 import DropdownList from "@/components/DropdownList/DropdownList";
+import { mapState } from "vuex";
 export default {
   name: "DirectlyPalyerHead",
   components: {
@@ -53,13 +54,10 @@ export default {
       searchValue: "", // 搜索内容
     };
   },
-  props: {
-    gameProfit: {
-      type: [Number, String],
-      default: 0,
-    },
+  props: {},
+  computed: {
+    ...mapState(["userProfit"]),
   },
-  computed: {},
   watch: {},
   created() {},
   mounted() {

src/views/Directly/DirectlyPlayer/DirectlyPlayerTable/DirectlyPlayerTable.vue

@@ -1,12 +1,13 @@
 <template>
   <div class="directly_table">
     <el-table :data="tableData" style="width: 100%">
-      <el-table-column prop="uid" label="UID"> </el-table-column>
+      <el-table-column prop="uid" label="uid"> </el-table-column>
       <el-table-column prop="passport" label="账号"> </el-table-column>
-      <el-table-column prop="role_id" label="角色ID"> </el-table-column>
-      <el-table-column prop="server_name" label="区服"> </el-table-column>
+      <el-table-column prop="create_at" label="创建时间"> </el-table-column>
+      <el-table-column prop="last_login_at" label="最后登录时间">
+      </el-table-column>
       <el-table-column prop="game_name" label="游戏名"> </el-table-column>
-      <el-table-column prop="today_money" label="流水"> </el-table-column>
+      <el-table-column prop="amount" label="流水(元)"> </el-table-column>
     </el-table>
   </div>
 </template>

src/views/Directly/DirectlySale/DirectlySale.vue

@@ -2,7 +2,7 @@
   <!-- 直属查询页 -->
   <div class="directly_sale">
     <!-- 筛选 todo: 这里 搜索框内容以及选择分类需要传递过来 -->
-    <DirectlySaleHead :promoProfit="promoProfit" @onSearch="onSearch" />
+    <DirectlySaleHead @onSearch="onSearch" />
 
     <!-- 直属查询表格 -->
     <DirectlySaleTable
@@ -42,7 +42,6 @@ export default {
       pageSize: 15, // 一页大小
       pageIndex: 1, // 当前页
       totalPage: 1, // 总页数
-      promoProfit: "", // 推广员总流水
     };
   },
   computed: {},
@@ -51,8 +50,6 @@ export default {
   mounted() {
     // 推广员明细列表
     this.pageChange(1);
-    // 推广员总流水
-    this.onPromoProfit();
   },
   methods: {
     // 分页页码改变
@@ -71,18 +68,6 @@ export default {
       );
     },
 
-    // 销售总流水
-    onPromoProfit() {
-      this.$api.promoProfit().then((res) => {
-        this.checkCode(res);
-        const { code, data } = res.data;
-        if (code) {
-          return;
-        }
-        this.promoProfit = data;
-      });
-    },
-
     // 销售流水列表
     onPromoUserList(pageIndex, pageSize) {
       this.pageIndex = pageIndex;
@@ -93,7 +78,11 @@ export default {
           return;
         }
         // 成功
-        console.log(data, "data===");
+        data.map((ele) => {
+          const { game_user_amount, game_user_profit } = ele;
+          ele.game_user_amount = (game_user_amount / 100).toFixed(2);
+          ele.game_user_profit = (game_user_profit / 100).toFixed(2);
+        });
         this.tableList = data;
         this.totalPage = Math.ceil(data.count / this.pageSize);
       });

src/views/Directly/DirectlySale/DirectlySaleHead/DirectlySaleHead.vue

@@ -1,10 +1,10 @@
 <template>
   <div class="directlt_head">
     <!-- 推广员总流水 start -->
-    <div class="today_money" :title="promoProfit">
+    <div class="today_money">
       <span class="title"> 推广员总流水 </span>
       <span class="money text_overflow">
-        {{ promoProfit }}
+        {{ (userProfit.promo_user_amount / 100).toFixed(2) }}
       </span>
     </div>
     <!-- 推广员总流水 end -->
@@ -38,6 +38,7 @@
 
 <script>
 import DropdownList from "@/components/DropdownList/DropdownList";
+import { mapState } from "vuex";
 export default {
   name: "DirectlySaleHead",
   components: {
@@ -62,7 +63,9 @@ export default {
       },
     },
   },
-  computed: {},
+  computed: {
+    ...mapState(["userProfit"]),
+  },
   watch: {},
   created() {},
   mounted() {

src/views/Directly/DirectlySale/DirectlySaleTable/DirectlySaleTable.vue

@@ -6,9 +6,10 @@
       <el-table-column prop="create_at" label="创建时间"> </el-table-column>
       <el-table-column prop="last_login_at" label="最后登录时间">
       </el-table-column>
-      <el-table-column prop="sales_player_money" label="推广员流水">
+      <el-table-column prop="game_user_amount" label="推广员流水(元)">
+      </el-table-column>
+      <el-table-column prop="game_user_profit" label="推广员业绩(元)">
       </el-table-column>
-      <el-table-column prop="sales_money" label="推广员业绩"> </el-table-column>
     </el-table>
   </div>
 </template>

src/views/Home/Home.vue

@@ -13,44 +13,61 @@
 <script>
 import ShowMoney from "@/components/ShowMoney/ShowMoney";
 import HomeLink from "@/views/Home/HomeLink/HomeLink";
-import { mapActions, mapState } from "vuex";
+import { mapState } from "vuex";
 export default {
   name: "Home",
   components: {
     ShowMoney,
     HomeLink,
   },
+  inject: ["checkCode"],
   data() {
     return {
-      teamTitleArr: ["团队人数(新增)", "玩家人数(新增)", "当前已赚取佣金"],
-      teamContentArr: ["80(10)", "80(10)", "880416"],
-      //   myTitleArr: ["推荐ID", "总业绩", "佣金", "当前可提取佣金"],
-      //   myContentArr: ["0416", "80", "80", "880416"],
+      teamTitleArr: [
+        "玩家人数",
+        "推广员人数",
+        "玩家总充值（总佣金）",
+        "推广员总充值（总佣金）",
+        "总充值",
+        "当前已赚取佣金",
+      ],
+      teamContentArr: [0, 0, "0（0）", "0（0）", 0, 0],
     };
   },
   computed: {
-    ...mapState(["num"]),
+    ...mapState(["userProfit"]),
+  },
+  watch: {
+    userProfit() {
+      this.init();
+    },
   },
-  watch: {},
   created() {},
   mounted() {
-    // 1. 初始化用户信息
-    // // 网络请求测试
-    // this.$api.getChengpin().then((res) => {
-    //     console.log(res);
-    // });
+    this.init();
   },
   methods: {
-    // 获取已赚取佣金
-    onProfit() {
-      this.$api.profit().then((res) => {
-        this.checkCode(res);
-        const { code, data } = res.data;
-        if (code) {
-          return;
-        }
-        // 成功 todo
-      });
+    init() {
+      const {
+        game_user_amount,
+        game_user_profit,
+        promo_user_amount,
+        promo_user_profit,
+        game_user_count,
+        promo_user_count,
+      } = this.userProfit;
+      this.teamContentArr = [
+        game_user_count,
+        promo_user_count,
+        `${(game_user_amount / 100).toFixed(2)}（${(
+          game_user_profit / 100
+        ).toFixed(2)}）`,
+        `${(promo_user_amount / 100).toFixed(2)}（${(
+          promo_user_profit / 100
+        ).toFixed(2)}）`,
+        ((game_user_amount + promo_user_amount) / 100).toFixed(2),
+        ((game_user_profit + promo_user_profit) / 100).toFixed(2),
+      ];
     },
   },
 };

src/views/Login/Login.vue

@@ -88,7 +88,7 @@ export default {
           this.$utils.setCookie("userInfo", JSON.stringify(data), 7);
           this.userInfoAction(data);
           this.$router.push({
-            name: "PromoCode",
+            name: "Home",
           });
         });
     },

src/views/Performance/Performance.vue

@@ -1,148 +1,148 @@
 <template>
-    <!-- 业绩查询页 -->
-    <div class="performance">
-        <!-- 表格 -->
-        <Table v-if="tableData" :tableData="tableData" />
-        <!-- 分页 -->
-        <el-pagination
-            v-if="tableList.length > 1"
-            class="performance_page"
-            layout="prev, pager, next, jumper"
-            :total="50 * 10"
-            :current-page="1"
-            @current-change="pageChange"
-        >
-        </el-pagination>
-    </div>
+  <!-- 业绩查询页 -->
+  <div class="performance">
+    <!-- 表格 -->
+    <Table v-if="tableData" :tableData="tableData" />
+    <!-- 分页 -->
+    <el-pagination
+      v-if="tableList.length > 1"
+      class="performance_page"
+      layout="prev, pager, next, jumper"
+      :total="50 * 10"
+      :current-page="1"
+      @current-change="pageChange"
+    >
+    </el-pagination>
+  </div>
 </template>
 
 <script>
 import Table from "@/components/Table/Table";
 export default {
-    name: "Performance",
-    components: {
-        Table,
-    },
-    data() {
-        return {
-            tableData: null, // 表格需要的内容
-            // 网络请求拿到的表格的数据
-            tableList: [
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "已发放",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "处理中",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "已发放",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "处理中",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "未成功",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "已发放",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "处理中",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "未成功",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "已发放",
-                },
-                {
-                    date: "2021-04-16 16:16:16",
-                    performance: 1,
-                    personMoney: "999",
-                    state: "处理中",
-                },
-            ],
-        };
-    },
-    computed: {},
-    watch: {},
-    created() {},
-    mounted() {
-        // 初始化表格内容
-        this.initTable();
-    },
-    methods: {
-        // 初始化表格内容
-        initTable() {
-            const { tableList } = this;
-            this.tableData = {
-                data: tableList,
-                list: [
-                    {
-                        title: "日期",
-                        value: "date",
-                        width: "25%",
-                    },
-                    {
-                        title: "直营业绩",
-                        value: "performance",
-                        width: "25%",
-                    },
-                    {
-                        title: "个人佣金",
-                        value: "personMoney",
-                        width: "25%",
-                    },
-                    {
-                        title: "状态",
-                        value: "state",
-                        width: "25%",
-                    },
-                ],
-            };
+  name: "Performance",
+  components: {
+    Table,
+  },
+  data() {
+    return {
+      tableData: null, // 表格需要的内容
+      // 网络请求拿到的表格的数据
+      tableList: [
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "已发放",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "处理中",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "已发放",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "处理中",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "未成功",
         },
-        // 分页页码改变
-        pageChange(currentPage) {
-            console.log("当前页", currentPage);
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "已发放",
         },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "处理中",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "未成功",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "已发放",
+        },
+        {
+          date: "2021-04-16 16:16:16",
+          performance: 1,
+          personMoney: "999",
+          state: "处理中",
+        },
+      ],
+    };
+  },
+  computed: {},
+  watch: {},
+  created() {},
+  mounted() {
+    // 初始化表格内容
+    this.initTable();
+  },
+  methods: {
+    // 初始化表格内容
+    initTable() {
+      const { tableList } = this;
+      this.tableData = {
+        data: tableList,
+        list: [
+          {
+            title: "日期",
+            value: "date",
+            width: "25%",
+          },
+          {
+            title: "直营业绩",
+            value: "performance",
+            width: "25%",
+          },
+          {
+            title: "个人佣金",
+            value: "personMoney",
+            width: "25%",
+          },
+          {
+            title: "状态",
+            value: "state",
+            width: "25%",
+          },
+        ],
+      };
+    },
+    // 分页页码改变
+    pageChange(currentPage) {
+      // console.log("当前页", currentPage);
     },
+  },
 };
 </script>
 
 <style lang='less' scoped>
 .performance {
-    width: 98%;
-    margin: 0 auto;
-    
-    .performance_page {
-        margin-top: 20px;
-    }
+  width: 98%;
+  margin: 0 auto;
+
+  .performance_page {
+    margin-top: 20px;
+  }
 }
 </style>

src/views/PromoCode/PromoCodeCreate/PromoCodeCreate.vue

@@ -154,6 +154,8 @@ export default {
 
     span {
       line-height: 40px;
+      float: left;
+      margin-left: 10px;
       font-weight: bold;
       font-size: 20px;
     }

src/views/PromoCode/PromoCodeCreate/PromoCodeCreatePlayer.vue

@@ -155,6 +155,8 @@ export default {
 
     span {
       line-height: 40px;
+      float: left;
+      margin-left: 10px;
       font-weight: bold;
       font-size: 20px;
     }

src/views/PromoCode/PromoCodeTable/PromoCodeTable.vue

@@ -10,22 +10,22 @@
         <el-table-column label="操作" width="300">
           <template slot-scope="scope">
             <el-button
-              type="primary"
               size="mini"
+              type="primary"
               class="promo_code_btn"
               :data-clipboard-text="promoCode"
-              @click="handleCopySale(scope.$index, scope.row)"
+              @click="handleCopyPlayer(scope.$index, scope.row)"
             >
-              复制营销推广码
+              复制玩家推广码
             </el-button>
             <el-button
-              size="mini"
               type="primary"
+              size="mini"
               class="promo_code_btn"
               :data-clipboard-text="promoCode"
-              @click="handleCopyPlayer(scope.$index, scope.row)"
+              @click="handleCopySale(scope.$index, scope.row)"
             >
-              复制玩家推广码
+              复制推广员推广码
             </el-button>
           </template>
         </el-table-column>