From d388e2788b7ef088d7cd40f901b0acdcec460bc3 Mon Sep 17 00:00:00 2001 From: wzy <wzy19931122ai@163.com> Date: Thu, 01 Apr 2021 00:19:23 +0800 Subject: [PATCH] modify --- zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-update.html | 668 ++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 528 insertions(+), 140 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..7611622 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,320 @@ margin: 0px 0px 10px 0px; text-align: right; } + .el-aside { + color: #333; + line-height: 15px; + } + .el-main { + color: #333; + line-height: 15px; + } + .box-card { + width: 160px; + border-radius: 5px; + color: #ffffff; + padding: 5px 5px; + margin-right: 20px; + cursor: pointer; + float: right; + } + .el-card__body { + padding: 0px; + } </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="60px" style="display:flex;align-items: center;"> + <el-avatar :size="50" :src="basicdetail.avatarUrl" style="display:flex;align-items: center;margin-left: 10px"></el-avatar> + </el-aside> + <el-main> + <el-row style="display:flex;align-items: center;padding: 10px;"> + <el-col :span="8" style="display:flex;align-items: center;"> + <span style="font-size: 20px;">{{basicdetail.nickname}} </span> + </el-col> + <el-col :span="6"> + <el-select v-model="basicdetail.grade" @focus="getDatalist()" @change="changeSaleManGrade(basicdetail.grade)" 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-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> - </el-row> - </el-row> + </el-col> + <el-col :span="10"> + </el-col> + </el-row> + <el-row style="display:flex;padding: 5px;"> + <el-col> + <span> + 手机号码:{{basicdetail.phone}} | + 加入时间:{{basicdetail.createTime}} + </span> + </el-col> + </el-row> + <el-row style="display:flex;padding: 5px;"> + <el-col> + <span> + 邀请人:{{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-main> + <el-row> + <el-row style="display:flex;align-items: center;text-align: center;"> + <el-card class="box-card" style="background-color: #0f9aef;"> + <div style="padding:10px;font-size: 20px;">{{basicdetail.lowerLevelNum}}人</div> + <div>绑定客户</div> + </el-card > + <el-card class="box-card" style="background: #67C23A;"> + <div style="padding:10px;font-size: 20px;">{{basicdetail.invitedNum}}人</div> + <div>邀请下级</div> + </el-card > + <el-card class="box-card" style="background: rgb(121, 187, 255);"> + <div style="padding:10px;font-size: 20px;">{{basicdetail.totalRevenue}}元</div> + <div>累计收益</div> + </el-card > + <el-card class="box-card" style="background: rgb(93 191 45);"> + <div style="padding:10px;font-size: 20px;">{{basicdetail.balance}}元</div> + <div>待结算</div> + </el-card > + </el-row> + </el-row> + </el-main> + </el-container> + <el-row> + <el-tabs v-model="activeName" > + <el-tab-pane label="绑定客户" name="first"> + <el-row style="display:flex;align-items: center;text-align: right;"> + <el-col> + <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-col> + </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="客户" + show-overflow-tooltip> + <template slot-scope="scope"> + <img :src="scope.row.avatarUrl" width="40" height="40" class="head_pic"/> + {{scope.row.nickname}} + </template> + </el-table-column> + <el-table-column + prop="createTime" + label="绑定时间" + show-overflow-tooltip> + </el-table-column> + <el-table-column + label="客户状态"> + <template slot-scope="scope"> + <span v-if="scope.row.doneNum == 0">已成交</span> + <span v-if="scope.row.doneNum > 0">未成交</span> + </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="openExamineSaleMan(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;text-align: right;"> + <el-col> + <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-col> + </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="客户"> + <template slot-scope="scope"> + <img :src="scope.row.avatarUrl" width="40" height="40" class="head_pic"/> + {{scope.row.nickname}} + </template> + </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="操作" width="240"> + <template slot-scope="scope"> + <el-row style="display:flex;"> + <el-button type="primary" size="mini" @click="openExamineSaleMan(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-tab-pane label="收益订单" name="third"> + <el-row style="display:flex;align-items: center;text-align: right;"> + <el-col> + <el-form ref="formOrder" :model="formOrder" inline > + <el-form-item label="结算状态" prop="orderType"> + <el-select v-model="formOrder.orderType" placeholder="请选择"> + <el-option + v-for="item in orderTypeList" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </el-form-item> + <el-form-item prop="userName"> + <el-input v-model="formOrder.userName" placeholder="请输入会员姓名"></el-input> + </el-form-item> + <el-button type="primary" @click="searchFormOrder" >搜索</el-button> + <el-button @click="resetFormOrder('formOrder')">重置</el-button> + </el-form> + </el-col> + </el-row> + <el-row class="table-style" > + <el-table id="proj" :data="orderLevelList.rows" :height="height" stripe:true @sort-change="sortChange"> + <el-table-column + prop="orderNo" + label="订单编号" + show-overflow-tooltip> + </el-table-column> + <el-table-column + prop="orderMoney" + label="实付金额"> + </el-table-column> + <el-table-column + label="订单状态"> + <template slot-scope="scope"> + <span v-if="scope.row.orderState == 1">待付款</span> + <span v-if="scope.row.orderState == 2">待配送</span> + <span v-if="scope.row.orderState == 3">待收货</span> + <span v-if="scope.row.orderState == 4">待评价</span> + <span v-if="scope.row.orderState == 5">已评价</span> + <span v-if="scope.row.orderState == 6">申请退款</span> + <span v-if="scope.row.orderState == 7">退款成功</span> + <span v-if="scope.row.orderState == 8">退款拒绝</span> + <span v-if="scope.row.orderState == 9">已取消</span> + </template> + </el-table-column> + <el-table-column + prop="storeName" + label="下单门店" + show-overflow-tooltip> + </el-table-column> + <el-table-column + label="客户" + show-overflow-tooltip> + <template slot-scope="scope"> + <img :src="scope.row.avatarUrl" width="40" height="40" class="head_pic"/> + {{scope.row.nickName}} + </template> + </el-table-column> + <el-table-column + prop="createTime" + label="时间" + show-overflow-tooltip> + </el-table-column> + <el-table-column + label="收益类型"> + <template slot-scope="scope"> + <span v-if="scope.row.revenueType == 1">推广收益</span> + <span v-if="scope.row.revenueType == 2">邀请收益</span> + </template> + </el-table-column> + <el-table-column + prop="amount" + label="收益金额"> + </el-table-column> + <el-table-column + label="结算状态"> + <template slot-scope="scope"> + <span v-if="scope.row.orderStatus == 1">待结算</span> + <span v-if="scope.row.orderStatus == 2">已结算</span> + <span v-if="scope.row.orderStatus == 3">已退款</span> + </template> + </el-table-column> + </el-table> + </el-row> + <el-row class="paginationStyle" > + <el-pagination background + @size-change="changePageSizeOrder" + @current-change="changeCurrentPageOrder" + :current-page="orderLevelList.currentPage" + :page-sizes="[10, 20, 30, 50]" + :page-size="orderLevelList.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="orderLevelList.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,27 +356,21 @@ <script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script> <script> + //获取传输的USERID对象 + var userId = $.query.get("userId"); + var applyId = $.query.get("applyId"); + var app = new Vue({ el: '#app', data: { activeName: 'first', - shenheAgreeType : 2, - shenheDisagreeType : 3, + basicdetail:{}, + //绑定客户 form:{ - shenheState:'', - salemanGrade:'', userName:'', order:'', sort:'' }, - //条件查询审核状态 - shenheStateList:[ - {value:'',label:'全部'}, - {value:1,label:'未审核'}, - {value:2,label:'通过'}, - {value:3,label:'未通过'} - ], - //条件查询分销员等级 salemanGradeList:[], fxyList:{ rows:[], @@ -128,7 +378,39 @@ pageSize:10, currentPage:1, }, - height:'calc(100vh - 240px)', + //邀请下级 + formlow:{ + userName:'', + order:'', + sort:'' + }, + lowLevelList:{ + rows:[], + total:0, + pageSize:10, + currentPage:1, + }, + //收益订单 + formOrder:{ + userName:'', + orderType:'', + order:'', + sort:'' + }, + //条件查询结算状态 + orderTypeList:[ + {value:'',label:'全部'}, + {value:1,label:'待结算'}, + {value:2,label:'已结算'}, + {value:3,label:'已退款'} + ], + orderLevelList:{ + rows:[], + total:0, + pageSize:10, + currentPage:1, + }, + height:'calc(100vh - 400px)', }, created: function () { @@ -140,9 +422,46 @@ //加载分类 loadInfo() { let _this = this; - //_this.loadParamSetting(); - //_this.getSalemanGradeList(); + _this.loadParamSettingBasic(); + _this.loadParamSetting(); + _this.loadParamSettinglow(); + _this.loadParamSettingOrder(); + _this.getDatalist(); }, + //修改等级 + changeSaleManGrade(id){ + let _this = this; + let obj = { + userId: userId, + gradeId: id, + } + AjaxProxy.requst({ + app: _this, + data:obj, + url: basePath + '/fenXiao/fenXiaoUser/changeSaleManGrade', + callback: function (data) { + _this.$message.success(data.info); + this.loadInfo(); + } + }); + }, + //加载基本数据信息 + loadParamSettingBasic() { + let _this = this; + let data={ + userId:userId, + applyId:applyId, + }; + AjaxProxy.requst({ + app: _this, + data:data, + url: basePath + '/fenXiao/fenXiaoUser/loadParamSettingBasic', + callback: function (data) { + _this.basicdetail = data.mapInfo.basicdetail; + } + }); + }, + //绑定客户 loadParamSetting() { let _this = this; let data=_this.getRequestParam(); @@ -151,15 +470,137 @@ AjaxProxy.requst({ app: _this, data:data, - url: basePath + '/fenXiao/fenXiaoUser/findShopSalesmanApplyList', + url: basePath + '/fenXiao/fenXiaoUser/loadParamSetting', callback: function (data) { - _this.fxyList.rows = data.rows; - _this.fxyList.total=data.total; + _this.fxyList.rows = data.mapInfo.customDetailRecords; + _this.fxyList.total = data.mapInfo.customDetailTotal; + _this.loadParamSettingBasic(); } }); }, - // 下拉框数据源---分销员等级 - getSalemanGradeList() { + //查询参数 + getRequestParam(){ + let _this = this; + return { + userName:_this.form.userName, + order:_this.form.order, + sort:_this.form.sort, + userId:userId, + applyId:applyId, + } + }, + //查询 + search:function(){ + this.fxyList.currentPage=1; + this.loadParamSetting(); + }, + //重置 + resetForm(formName) { + this.$refs[formName].resetFields(); + }, + changePageSize(val) { + this.fxyList.pageSize = val; + this.loadParamSetting(); + }, + changeCurrentPage(val) { + this.fxyList.currentPage = val; + this.loadParamSetting(); + }, + //邀请下级 + 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/loadParamSettinglow', + callback: function (data) { + _this.lowLevelList.rows = data.mapInfo.customLowRecords; + _this.lowLevelList.total = data.mapInfo.customLowTotal; + _this.loadParamSettingBasic(); + } + }); + }, + //查询参数 + getRequestParamlow(){ + let _this = this; + return { + userName:_this.formlow.userName, + order:_this.formlow.order, + sort:_this.formlow.sort, + userId:userId, + applyId:applyId, + } + }, + //查询 + searchlow:function(){ + this.lowLevelList.currentPage=1; + this.loadParamSettinglow(); + }, + //重置 + resetFormlow(formName) { + this.$refs[formName].resetFields(); + }, + changePageSizelow(val) { + this.lowLevelList.pageSize = val; + this.loadParamSettinglow(); + }, + changeCurrentPagelow(val) { + this.lowLevelList.currentPage = val; + this.loadParamSettinglow(); + }, + + //收益订单 + loadParamSettingOrder() { + let _this = this; + let data=_this.getRequestParamOrder(); + data.pageSize=_this.orderLevelList.pageSize; + data.pageNum=_this.orderLevelList.currentPage; + AjaxProxy.requst({ + app: _this, + data:data, + url: basePath + '/fenXiao/fenXiaoUser/loadParamSettingOrder', + callback: function (data) { + _this.orderLevelList.rows = data.mapInfo.orderRecords; + _this.orderLevelList.total = data.mapInfo.orderTotal; + _this.loadParamSettingBasic(); + } + }); + }, + //查询参数 + getRequestParamOrder(){ + let _this = this; + return { + userName:_this.formOrder.userName, + orderType:_this.formOrder.orderType, + order:_this.formOrder.order, + sort:_this.formOrder.sort, + userId:userId, + applyId:applyId, + } + }, + //查询 + searchFormOrder:function(){ + this.orderLevelList.currentPage=1; + this.loadParamSettingOrder(); + }, + //重置 + resetFormOrder(formName) { + this.$refs[formName].resetFields(); + }, + changePageSizeOrder(val) { + this.orderLevelList.pageSize = val; + this.loadParamSettingOrder(); + }, + changeCurrentPageOrder(val) { + this.orderLevelList.currentPage = val; + this.loadParamSettingOrder(); + }, + + // select下拉框获取焦点的时候下拉框数据源---分销员等级 + getDatalist() { let _this = this; AjaxProxy.requst({ app: _this, @@ -169,23 +610,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){ @@ -198,84 +622,48 @@ 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(){ - layer.full(layer.open({ - type: 2, - title: "选择会员", - maxmin: true, - area: [MUI.SIZE_L, '500px'], - content : [ basePath + '/admin/redirect/fenxiao/fenxiao-apply'] - })); - }, - //修改等级 - openUpdateSaleManGrade(){ - layer.full(layer.open({ - type: 2, - title: "修改等级", - maxmin: true, - area: [MUI.SIZE_L, '500px'], - content : [ basePath + '/admin/redirect/fenxiao/fenxiao-update'] - })); - }, - //审核 - openExamineSaleManApply(row) { - this.$confirm('是否通过?', '审核', { + //解绑 + openExamineSaleMan(row) { + this.$confirm('是否解绑?', '解绑', { distinguishCancelAndClose: true,//设置关闭按钮和不通过按钮的区别 - confirmButtonText: '通过', - cancelButtonText: '不通过', + confirmButtonText: '同意', + cancelButtonText: '取消', type: 'info' }).then(() => { //通过 - this.examineSaleManApply(row,this.shenheAgreeType); + console.log("conform"); + this.unbundlingSaleMan(row); }).catch(action => { //不通过 if(action === 'cancel'){ - this.examineSaleManApply(row,this.shenheDisagreeType); + console.log("cancel"); }else{ //关闭按钮 console.log("close"); - //this.$message({type: 'info',message: ''}) } }); }, - examineSaleManApply(row,type){ + unbundlingSaleMan(row){ let _this = this; let userId = row.userId; let obj = { userId: userId, - applyState: type, } AjaxProxy.requst({ app: _this, data:obj, - url: basePath + '/fenXiao/fenXiaoUser/examineSaleManApply', + url: basePath + '/fenXiao/fenXiaoUser/unbundlingSaleMan', callback: function (data) { _this.$message.success(data.info); - this.loadData(); + if(_this.activeName == "first"){ + _this.loadParamSetting(); + } + if(_this.activeName == "second"){ + _this.loadParamSettinglow(); + } } }); }, - - submit() { - } } }) </script> -- Gitblit v1.9.1