forked from beauty-erp
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>
