From 626e9811c77cd89182d16d12d3c5890904daea02 Mon Sep 17 00:00:00 2001 From: xiaoyong931011 <15274802129@163.com> Date: Sat, 13 Mar 2021 18:53:02 +0800 Subject: [PATCH] 分销员后台0313 --- zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html | 397 +++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 305 insertions(+), 92 deletions(-) diff --git a/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html b/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html index 659a7e4..3cd9ded 100644 --- a/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html +++ b/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html @@ -29,64 +29,222 @@ margin: 0px 0px 10px 0px; text-align: right; } + .el-aside { + color: #333; + line-height: 50px; + } + .el-main { + color: #333; + line-height: 50px; + } </style> </head> <body> <div class="ibox-content" id="app" v-cloak> - <el-row> <p class="el-big-title">个人详情</p> </el-row> - <el-row> - <el-col> - <template> - <img :src="detailVo.avatarUrl" width="50" height="50" class="head_pic"/> - </template> - </el-col> - <el-col> - <div>张三</div> - <div> - <el-form-item label="分销员等级" prop="salemanGrade"> - <el-select v-model="form.salemanGrade" placeholder="请选择" filterable allow-create> - <el-option v-for="item in salemanGradeList " :key="item.id" :label="item.name" :value="item.id"> - </el-option> + <el-container> + <el-aside width="200px" style="display:flex;align-items: center;"> + <el-avatar :size="100" :src="basicdetail.avatarUrl" style="display:flex;align-items: center;margin-left: 50px"></el-avatar> + </el-aside> + <el-main> + <el-row style="display:flex;align-items: center;"> + <el-col :span="3" style="display:flex;align-items: center;"> + <span style="font-size: 20px;">{{basicdetail.nickname}} </span> + </el-col> + <el-col :span="3"> + <el-select v-model="basicdetail.grade" @focus="getDatalist()" placeholder="请选择" filterable allow-create> + <el-option v-for="item in salemanGradeList " :key="item.id" :label="item.name" :value="item.id"></el-option> </el-select> - </el-form-item> - </div> - </el-col> - </el-row> - <el-row> - <el-col> - <div>手机号码:</div> - <div>加入时间:</div> - <div>邀请人:</div> - <div>来源:</div> - </el-col> - </el-row> - <el-row> - <el-row> - <el-col :span="24"> - <el-form-item> - <el-col class="line" :span="6" style="text-align: center">绑定客户</el-col> - <el-col class="line" :span="6" style="text-align: center">邀请下级</el-col> - <el-col class="line" :span="6" style="text-align: center">累计收益</el-col> - <el-col class="line" :span="6" style="text-align: center">待结算</el-col> - </el-form-item> + </el-col> + <el-col :span="18"> + </el-col> + </el-row> + <el-row style="display:flex;"> + <el-col> + <span> + 手机号码:{{basicdetail.phone}} | + 加入时间:{{basicdetail.createTime}} | + 邀请人:{{basicdetail.parentUser}} | + 来源: + <span v-if="basicdetail.applyWay == 1">自主申请</span> + <span v-if="basicdetail.applyWay == 2">自动添加</span> + <span v-if="basicdetail.applyWay == 3">上级邀请</span> + <span v-if="basicdetail.applyWay == 4">手动添加</span> | + 状态: + <span v-if="basicdetail.applyStatus == 1">待审核</span> + <span v-if="basicdetail.applyStatus == 2">通过</span> + <span v-if="basicdetail.applyStatus == 3">未通过</span> + </span> + </el-col> + </el-row> + </el-main> + </el-container> + <el-row style="padding: 30px;"> + <el-row :gutter="100"> + <el-col class="line" :span="6" style="text-align: center"> + <el-card class="box-card" style="background-color: #eee;border-radius: 30px;"> + <div>绑定客户</div> + <div style="padding: 5px;font-size: 18px;">{{basicdetail.lowerLevelNum}}人</div> + </el-card > </el-col> - </el-row> - <el-row> - <el-col :span="24"> - <el-form-item> - <el-col class="line" :span="6" style="text-align: center">0</el-col> - <el-col class="line" :span="6" style="text-align: center">0</el-col> - <el-col class="line" :span="6" style="text-align: center">0</el-col> - <el-col class="line" :span="6" style="text-align: center">0</el-col> - </el-form-item> + <el-col class="line" :span="6" style="text-align: center"> + <el-card class="box-card" style="background-color: #eee;border-radius: 30px;"> + <div>邀请下级</div> + <div style="padding: 5px;font-size: 18px;">{{basicdetail.invitedNum}}人</div> + </el-card > + </el-col> + <el-col class="line" :span="6" style="text-align: center"> + <el-card class="box-card" style="background-color: #eee;border-radius: 30px;"> + <div>累计收益</div> + <div style="padding: 5px;font-size: 18px;">{{basicdetail.totalRevenue}}元</div> + </el-card > + </el-col> + <el-col class="line" :span="6" style="text-align: center"> + <el-card class="box-card" style="background-color: #eee;border-radius: 30px;"> + <div>待结算</div> + <div style="padding: 5px;font-size: 18px;">{{basicdetail.balance}}元</div> + </el-card > </el-col> </el-row> </el-row> + <el-row> + <el-tabs v-model="activeName" > + <el-tab-pane label="分销员管理" name="first"> + <el-row style="display:flex;align-items: center;"> + <el-form ref="form" :model="form" inline > + <el-form-item prop="userName"> + <el-input v-model="form.userName" placeholder="请输入会员姓名"></el-input> + </el-form-item> + <el-button type="primary" @click="search" >搜索</el-button> + <el-button @click="resetForm('form')">重置</el-button> + </el-form> + </el-row> + <el-row class="table-style" > + <el-table id="proj" :data="fxyList.rows" :height="height" stripe:true @sort-change="sortChange"> + <el-table-column + type="selection"> + </el-table-column> + <el-table-column + label="头像" width="100"> + <template slot-scope="scope"> + <img :src="scope.row.avatarUrl" width="40" height="40" class="head_pic"/> + </template> + </el-table-column> + <el-table-column + prop="nickname" + label="分销员" width="100"> + </el-table-column> + <el-table-column + prop="createTime" + label="绑定时间"> + </el-table-column> + <el-table-column + label="绑定方式"> + <template slot-scope="scope"> + <span v-if="scope.row.applyWay == 1">自主申请</span> + <span v-if="scope.row.applyWay == 2">自动添加</span> + <span v-if="scope.row.applyWay == 3">上级邀请</span> + <span v-if="scope.row.applyWay == 4">手动添加</span> + </template> + </el-table-column> + <el-table-column + label="客户状态"> + <template slot-scope="scope"> + </template> + </el-table-column> + <el-table-column label="操作" width="240"> + <template slot-scope="scope"> + <el-row style="display:flex;"> + <el-button type="primary" size="mini" @click="openExamineSsaleManApply(scope.row)">解绑</el-button> + </el-row> + </template> + </el-table-column> + </el-table> + </el-row> + <el-row class="paginationStyle" > + <el-pagination background + @size-change="changePageSize" + @current-change="changeCurrentPage" + :current-page="fxyList.currentPage" + :page-sizes="[10, 20, 30, 50]" + :page-size="fxyList.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="fxyList.total"> + </el-pagination> + </el-row> + </el-tab-pane> + + <el-tab-pane label="邀请下级" name="second"> + <el-row style="display:flex;align-items: center;"> + <el-form ref="formlow" :model="formlow" inline > + <el-form-item prop="userName"> + <el-input v-model="formlow.userName" placeholder="请输入会员姓名"></el-input> + </el-form-item> + + <el-button type="primary" @click="searchlow" >搜索</el-button> + <el-button @click="resetFormlow('formlow')">重置</el-button> + </el-form> + </el-row> + <el-row class="table-style" > + <el-table id="proj" :data="lowLevelList.rows" :height="height" stripe:true @sort-change="sortChange"> + <el-table-column + type="selection"> + </el-table-column> + <el-table-column + label="头像" width="100"> + <template slot-scope="scope"> + <img :src="scope.row.avatarUrl" width="40" height="40" class="head_pic"/> + </template> + </el-table-column> + <el-table-column + prop="nickname" + label="分销员" width="100"> + </el-table-column> + <el-table-column + prop="createTime" + label="绑定时间"> + </el-table-column> + <el-table-column + label="绑定方式"> + <template slot-scope="scope"> + <span v-if="scope.row.applyWay == 1">自主申请</span> + <span v-if="scope.row.applyWay == 2">自动添加</span> + <span v-if="scope.row.applyWay == 3">上级邀请</span> + <span v-if="scope.row.applyWay == 4">手动添加</span> + </template> + </el-table-column> + <el-table-column + label="客户状态"> + <template slot-scope="scope"> + </template> + </el-table-column> + <el-table-column label="操作" width="240"> + <template slot-scope="scope"> + <el-row style="display:flex;"> + <el-button type="primary" size="mini" @click="openExamineSsaleManApply(scope.row)">解绑</el-button> + </el-row> + </template> + </el-table-column> + </el-table> + </el-row> + <el-row class="paginationStyle" > + <el-pagination background + @size-change="changePageSizelow" + @current-change="changeCurrentPagelow" + :current-page="lowLevelList.currentPage" + :page-sizes="[10, 20, 30, 50]" + :page-size="lowLevelList.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="lowLevelList.total"> + </el-pagination> + </el-row> + </el-tab-pane> + </el-tabs> + </el-row> </div> </body> <script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> @@ -100,19 +258,15 @@ <script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script> <script> + //获取传输的USERID对象 + var userId = $.query.get("userId"); + var app = new Vue({ el: '#app', data: { activeName: 'first', shenheAgreeType : 2, shenheDisagreeType : 3, - form:{ - shenheState:'', - salemanGrade:'', - userName:'', - order:'', - sort:'' - }, //条件查询审核状态 shenheStateList:[ {value:'',label:'全部'}, @@ -120,9 +274,27 @@ {value:2,label:'通过'}, {value:3,label:'未通过'} ], + basicdetail:{}, //条件查询分销员等级 + form:{ + userName:'', + order:'', + sort:'' + }, salemanGradeList:[], fxyList:{ + rows:[], + total:0, + pageSize:10, + currentPage:1, + }, + + formlow:{ + userName:'', + order:'', + sort:'' + }, + lowLevelList:{ rows:[], total:0, pageSize:10, @@ -140,9 +312,11 @@ //加载分类 loadInfo() { let _this = this; - //_this.loadParamSetting(); - //_this.getSalemanGradeList(); + _this.loadParamSetting(); + _this.loadParamSettinglow(); + _this.getDatalist(); }, + //绑定客户 loadParamSetting() { let _this = this; let data=_this.getRequestParam(); @@ -151,15 +325,88 @@ AjaxProxy.requst({ app: _this, data:data, - url: basePath + '/fenXiao/fenXiaoUser/findShopSalesmanApplyList', + url: basePath + '/fenXiao/fenXiaoUser/findShopSalesmanDetail', callback: function (data) { - _this.fxyList.rows = data.rows; - _this.fxyList.total=data.total; + _this.basicdetail = data.mapInfo.basicdetail; + _this.fxyList.rows = data.mapInfo.customDetailRecords; + _this.fxyList.total = data.mapInfo.customDetailTotal; } }); }, - // 下拉框数据源---分销员等级 - getSalemanGradeList() { + //查询参数 + getRequestParam(){ + let _this = this; + return { + userName:_this.form.userName, + order:_this.form.order, + sort:_this.form.sort, + userId:userId, + } + }, + //查询 + search:function(){ + this.fxyList.currentPage=1; + this.loadInfo(); + }, + //重置 + resetForm(formName) { + this.$refs[formName].resetFields(); + }, + changePageSize(val) { + this.fxyList.pageSize = val; + this.loadInfo(); + }, + changeCurrentPage(val) { + this.fxyList.currentPage = val; + this.loadInfo(); + }, + //邀请下级 + loadParamSettinglow() { + let _this = this; + let data=_this.getRequestParamlow(); + data.pageSize=_this.lowLevelList.pageSize; + data.pageNum=_this.lowLevelList.currentPage; + AjaxProxy.requst({ + app: _this, + data:data, + url: basePath + '/fenXiao/fenXiaoUser/findShopSalesmanDetail', + callback: function (data) { + _this.basicdetail = data.mapInfo.basicdetail; + _this.lowLevelList.rows = data.mapInfo.customLowRecords; + _this.lowLevelList.total = data.mapInfo.customLowTotal; + } + }); + }, + //查询参数 + getRequestParamlow(){ + let _this = this; + return { + userName:_this.formlow.userName, + order:_this.formlow.order, + sort:_this.formlow.sort, + userId:userId, + } + }, + //查询 + searchlow:function(){ + this.lowLevelList.currentPage=1; + this.loadInfo(); + }, + //重置 + resetFormlow(formName) { + this.$refs[formName].resetFields(); + }, + changePageSizelow(val) { + this.lowLevelList.pageSize = val; + this.loadInfo(); + }, + changeCurrentPagelow(val) { + this.lowLevelList.currentPage = val; + this.loadInfo(); + }, + + // select下拉框获取焦点的时候下拉框数据源---分销员等级 + getDatalist() { let _this = this; AjaxProxy.requst({ app: _this, @@ -169,23 +416,6 @@ _this.salemanGradeList = data.mapInfo.salesGrade; } }); - }, - getRequestParam(){ - let _this = this; - return { - shenheState:_this.form.shenheState, - salemanGrade:_this.form.salemanGrade, - userName:_this.form.userName, - order:_this.form.order, - sort:_this.form.sort, - } - }, - search:function(){ - this.fxyList.currentPage=1; - this.loadInfo(); - }, - resetForm(formName) { - this.$refs[formName].resetFields(); }, sortChange:function (column){ if(column.order){ @@ -197,23 +427,6 @@ this.form.sort=column.prop; this.loadInfo(); } - }, - changePageSize(val) { - this.table.pageSize = val; - this.loadData(); - }, - changeCurrentPage(val) { - this.table.currentPage = val; - this.loadData(); - }, - //时间格式化 - formatDate(row,column){ - let data = row[column.property] - if (data ===null) { - return '' - } - let dt = new Date(data) - return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate() + ' ' + dt.getHours() + ':' + dt.getMinutes() }, //新增分销员页面 addSaleMan(){ -- Gitblit v1.9.1