forked from beauty-erp
zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-user.html
@@ -29,6 +29,29 @@ margin: 0px 0px 10px 0px; text-align: right; } .avatar-uploader .el-upload { border: 1px dashed #d9d9d9; border-radius: 6px; cursor: pointer; position: relative; overflow: hidden; } .avatar-uploader .el-upload:hover { border-color: #409EFF; } .avatar-uploader-icon { font-size: 28px; color: #8c939d; width: 178px; height: 178px; line-height: 178px; text-align: center; } .avatar { width: 178px; height: 178px; display: block; } </style> </head> @@ -37,11 +60,11 @@ <el-row> <el-tabs v-model="activeName" > <el-tab-pane label="分销员管理" name="first"> <el-row style="display:flex;align-items: center;"> <el-col> <el-row > <el-col :span="6" style="display:flex;align-items: center;"> <el-button type="primary" @click="addSaleMan()">新增分销员</el-button> </el-col> <el-col> <el-col :span="12" style="display: flex;align-items: center;"> <el-form ref="form" :model="form" inline > <el-form-item label="审核状态" prop="shenheState"> <el-select v-model="form.shenheState" placeholder="请选择"> @@ -63,9 +86,11 @@ <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-col :span="6" style="display:flex;align-items: center;"> <el-button type="primary" @click="search" >搜索</el-button> <el-button @click="resetForm('form')">重置</el-button> </el-col> </el-row> <el-row class="table-style" > @@ -74,22 +99,19 @@ type="selection"> </el-table-column> <el-table-column label="头像" width="100"> label="分销员" width="120"> <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="nickname" label="分销员" width="100"> </el-table-column> <el-table-column prop="parentUser" label="邀请人" width="100"> label="邀请人"> </el-table-column> <el-table-column prop="lowerLevelNum" label="下级客户数" width="100"> label="下级客户数"> </el-table-column> <el-table-column prop="totalRevenue" @@ -114,6 +136,7 @@ <span v-if="scope.row.applyStatus == 1">待审核</span> <span v-if="scope.row.applyStatus == 2">通过</span> <span v-if="scope.row.applyStatus == 3">未通过</span> <span v-if="scope.row.applyStatus == 4">系统删除</span> </template> </el-table-column> <el-table-column @@ -128,8 +151,10 @@ <el-table-column label="操作" width="240"> <template slot-scope="scope"> <el-row style="display:flex;"> <el-button type="primary" size="mini" @click="openExamineSaleManApply(scope.row)">审核</el-button> <el-button type="primary" size="mini" @click="openUpdateSaleManGrade(scope.row)">修改等级</el-button> <el-button type="primary" v-if="scope.row.applyStatus == 1" size="mini" @click="openExamineSaleManApply(scope.row)">审核</el-button> <el-button type="primary" v-if="scope.row.applyStatus == 2" size="mini" @click="openUpdateSaleManGrade(scope.row)">修改等级</el-button> <el-button type="primary" size="mini" @click="openUpdateSaleManGrade(scope.row)">详情</el-button> <el-button type="primary" v-if="scope.row.applyStatus == 2" size="mini" @click="delSaleManGradeApply(scope.row)">删除</el-button> </el-row> </template> </el-table-column> @@ -147,74 +172,92 @@ </el-pagination> </el-row> </el-tab-pane> <el-tab-pane label="分佣方案" name="second"> <template> <el-table :data="tableData" style="width: 100%" height="250"> <el-row class="table-style" > <el-table id="proj" :data="fyfaList.rows" :height="height"> <el-table-column prop="name" label="方案名称" width="180"> label="方案名称"> <template slot-scope="scope"> <el-input class="edit-input" v-model="scope.row.name" placeholder="方案名称"></el-input> </template> </el-table-column> <el-table-column prop="name" label="推广提成%" width="180"> prop="sealesCommission" label="推广提成 %"> <template slot-scope="scope"> <el-input class="edit-input" v-model="scope.row.sealesCommission" oninput ="value=value.replace(/[^0-9.]/g,'')" placeholder="推广提成"></el-input> </template> </el-table-column> <el-table-column prop="name" label="邀请提成 %" width="180"> prop="invitationCommission" label="邀请提成 %"> <template slot-scope="scope"> <el-input class="edit-input" v-model="scope.row.invitationCommission" oninput ="value=value.replace(/[^0-9.]/g,'')" placeholder="邀请提成"></el-input> </template> </el-table-column> <el-table-column prop="name" label="等级条件（推广金额额）" width="180"> prop="gradeCondition" label="等级条件（推广金额）"> <template slot-scope="scope"> <el-input class="edit-input" v-model="scope.row.gradeCondition" oninput ="value=value.replace(/[^0-9.]/g,'')" placeholder="等级条件（推广金额）"></el-input> </template> </el-table-column> <el-table-column fixed="right" label="操作" width="100"> <template slot-scope="scope"> <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button> <el-button type="text" size="small">编辑</el-button> </template> </el-table-column> <el-table-column label="操作" width="240"> <template slot-scope="scope"> <el-row style="display:flex;"> <el-button type="primary" v-if="scope.row.isDefault == 1" size="mini" @click="addFyfa()">新增</el-button> <el-button type="primary" size="mini" @click="updateFyfa(scope.row)">保存</el-button> <el-button type="primary" v-if="scope.row.isDefault == 2" size="mini" @click="delFyfa(scope.row)">删除</el-button> </el-row> </template> </el-table-column> </el-table> </template> </el-row> <el-row class="paginationStyle" > <el-pagination background @size-change="changePageSizelow" @current-change="changeCurrentPagelow" :current-page="fyfaList.currentPage" :page-sizes="[10, 20, 30, 50]" :page-size="fyfaList.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="fyfaList.total"> </el-pagination> </el-row> </el-tab-pane> <el-tab-pane label="推广文案" name="third"> <el-row> <script style="width: 100%; height: 500px" id="description" name="description" type="text/plain"></script> <p class="el-big-title">文案描述</p> <el-row justify="center" type="flex"> <script style="height: 400px;width: 375px;" id="description" name="description" type="text/plain"> </script> </el-row> <el-row justify="center" type="flex"> <el-button type="primary" @click="submit()">保存</el-button> <el-button type="primary" size="mini" @click="wamsSubmit()">保存</el-button> </el-row> </el-tab-pane> <el-tab-pane label="分享图片上传" name="fourth"> <el-row> <div class="ibox-content"> <form class="form-horizontal" id="dataform" onsubmit="javascripr:return false;"> <div class="form-group"> <label class="col-sm-2 control-label">门店照片</label> <div class="col-sm-8"> <input autocomplete="off" v-model="fxtp.paramValue" name="shopImag" id="info6" class="form-control upload-input" type="text" /> <a class="btn btn-primary radius upload-a">选择图片 </a> </div> </div> <el-row justify="center" type="flex"> <el-button type="primary" @click="submittp(paramValue)">保存</el-button> </el-row> </form> </div> <el-tab-pane label="推广图片" name="fourth"> <p class="el-big-title">上传图片</p> <el-row justify="center" type="flex"> <el-upload class="avatar-uploader" action="/admin/multipleUploadFile/doUpload" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"> <img v-if="imageUrl" :src="imageUrl" class="avatar"> <i v-else class="el-icon-plus avatar-uploader-icon"></i> </el-upload> </el-row> <el-row justify="center" type="flex"> <el-button type="primary" size="mini" @click="tgtpSubmit()">保存</el-button> </el-row> </el-tab-pane> </el-tabs> </el-row> </div> @@ -231,22 +274,27 @@ <script> //百度编辑器 MUI.initImgUpload(".upload-input"); var ue = {}; var ue = { initialFrameWidth :750 }; var app = new Vue({ el: '#app', data: { fxy:[], fenxiaoGrade: "", tableData:[], tgwa: "", height:'calc(100vh - 240px)', activeName: 'first', multipleSelection: [], jfyxq:[], fxtp:{}, jfdxj:[], mdjf:[], scjf:[], fenxiaoGrade: "", //推广文案 tgwa: {}, //图片上传 imageUrl: '', //分佣方案 fyfaList:{ rows:[], total:0, pageSize:10, currentPage:1, }, //分销员管理 shenheAgreeType : 2, shenheDisagreeType : 3, form:{ @@ -271,16 +319,12 @@ pageSize:10, currentPage:1, }, height:'calc(100vh - 240px)', }, created: function () { this.loadInfo(); window.addEventListener("keydown", this.keydown); //初始化编辑器 ue = UE.getEditor('description'); //百度编辑器 MUI.initImgUpload(".upload-input"); }, mounted: function () { }, @@ -289,26 +333,186 @@ loadInfo() { let _this = this; _this.loadParamSetting(); _this.loadFyfaSetting(); _this.loadTgwaSetting(); _this.loadTgtpSetting(); _this.getSalemanGradeList(); }, submittp(paramValue) { alert(paramValue); //推广文案 loadTgwaSetting() { let _this = this; AjaxProxy.requst({ app: _this, data:[], url: basePath + '/fenXiao/fenXiaoUser/loadTgwaSetting', callback: function (data) { _this.tgwa = data.mapInfo.tgwa; var ue = UE.getEditor('description'); ue.ready(function() {//编辑器初始化完成再赋值 ue.setContent(_this.tgwa.paramValue3); //赋值给UEditor }); } }); }, toggleSelection(rows) { if (rows) { rows.forEach(row => { this.$refs.multipleTable.toggleRowSelection(row); }); } else { this.$refs.multipleTable.clearSelection(); wamsSubmit(){ let _this = this; let tgfa = ue.getContent(); let data= { tgfa:tgfa, }; AjaxProxy.requst({ app: _this, data:data, url: basePath + '/fenXiao/fenXiaoUser/updateTgjh', callback: function (data) { _this.$message.success(data.info); _this.loadTgwaSetting(); } }); }, //图片上传 loadTgtpSetting() { let _this = this; AjaxProxy.requst({ app: _this, data:[], url: basePath + '/fenXiao/fenXiaoUser/loadTgtpSetting', callback: function (data) { _this.imageUrl = data.mapInfo.tgtp.paramValue; } }); }, tgtpSubmit(){ let _this = this; let imageUrl = _this.imageUrl; let data= { imageUrl:imageUrl, }; AjaxProxy.requst({ app: _this, data:data, url: basePath + '/fenXiao/fenXiaoUser/updateTgtp', callback: function (data) { _this.$message.success(data.info); _this.loadTgtpSetting(); } }); }, handleAvatarSuccess(res, file) { this.imageUrl = res.path; }, beforeAvatarUpload(file) { const isJPG = file.type === 'image/jpeg'; const isLt2M = file.size / 1024 / 1024 < 2; if (!isJPG) { this.$message.error('上传头像图片只能是 JPG 格式!'); } if (!isLt2M) { this.$message.error('上传头像图片大小不能超过 2MB!'); } return isJPG && isLt2M; }, handleSelectionChange(val) { this.multipleSelection = val; //分佣方案 loadFyfaSetting() { let _this = this; let data=_this.getRequestParam(); data.pageSize=_this.fyfaList.pageSize; data.pageNum=_this.fyfaList.currentPage; AjaxProxy.requst({ app: _this, data:data, url: basePath + '/fenXiao/fenXiaoUser/findFyfaManageList', callback: function (data) { _this.fyfaList.rows = data.rows; _this.fyfaList.total = data.total; } }); }, handleClick(row) { console.log(row); changePageSizelow(val) { this.fyfaList.pageSize = val; this.loadFyfaSetting(); }, changeCurrentPagelow(val) { this.fyfaList.currentPage = val; this.loadFyfaSetting(); }, //新增 addFyfa(){ let _this = this; AjaxProxy.requst({ app: _this, data:[], url: basePath + '/fenXiao/fenXiaoUser/addFyfa', callback: function (data) { _this.$message.success(data.info); _this.loadFyfaSetting(); } }); }, updateFyfa(row){ let _this = this; let id = row.id; let name = row.name; let sealesCommission = row.sealesCommission; let invitationCommission = row.invitationCommission; let gradeCondition = row.gradeCondition; let obj = { id: id, name: name, sealesCommission: sealesCommission, invitationCommission: invitationCommission, gradeCondition: gradeCondition, } AjaxProxy.requst({ app: _this, data:obj, url: basePath + '/fenXiao/fenXiaoUser/updateFyfa', callback: function (data) { _this.$message.success(data.info); _this.loadFyfaSetting(); } }); }, //删除 delFyfa(row){ let _this = this; _this.$confirm('是否删除?', '删除', { distinguishCancelAndClose: true,//设置关闭按钮和不通过按钮的区别 confirmButtonText: '确认', cancelButtonText: '取消', type: 'info' }).then(() => { //通过 _this.delFyfaApply(row); _this.loadFyfaSetting(); }).catch(action => { //不通过 if(action === 'cancel'){ console.log("cancel"); }else{ //关闭按钮 console.log("close"); //this.$message({type: 'info',message: ''}) } }); }, delFyfaApply(row){ let _this = this; let id = row.id; let obj = { gradeId: id, } AjaxProxy.requst({ app: _this, data:obj, url: basePath + '/fenXiao/fenXiaoUser/delFyfaApply', callback: function (data) { _this.$message.success(data.info); } }); }, //分销员管理 loadParamSetting() { let _this = this; let data=_this.getRequestParam(); @@ -348,7 +552,7 @@ }, search:function(){ this.fxyList.currentPage=1; this.loadInfo(); this.loadParamSetting(); }, keydown(evt){ if(evt.keyCode==13) { @@ -366,16 +570,16 @@ this.form.order="asc"; } this.form.sort=column.prop; this.loadInfo(); this.loadParamSetting(); } }, changePageSize(val) { this.table.pageSize = val; this.loadData(); this.fxyList.pageSize = val; this.loadParamSetting(); }, changeCurrentPage(val) { this.table.currentPage = val; this.loadData(); this.fxyList.currentPage = val; this.loadParamSetting(); }, //时间格式化 formatDate(row,column){ @@ -396,14 +600,53 @@ content : [ basePath + '/admin/redirect/fenxiao/fenxiao-apply'] })); }, //修改等级 openUpdateSaleManGrade(){ //删除 delSaleManGradeApply(row){ this.$confirm('是否删除?', '删除', { distinguishCancelAndClose: true,//设置关闭按钮和不通过按钮的区别 confirmButtonText: '确认', cancelButtonText: '取消', type: 'info' }).then(() => { //通过 this.examineDelSaleManGradeApply(row); }).catch(action => { //不通过 if(action === 'cancel'){ console.log("cancel"); }else{ //关闭按钮 console.log("close"); //this.$message({type: 'info',message: ''}) } }); }, examineDelSaleManGradeApply(row){ let _this = this; let userId = row.userId; let id = row.id; let obj = { userId: userId, applyId: id, } AjaxProxy.requst({ app: _this, data:obj, url: basePath + '/fenXiao/fenXiaoUser/delSaleManGradeApply', callback: function (data) { _this.$message.success(data.info); _this.loadParamSetting(); } }); }, //修改等级跳转 openUpdateSaleManGrade(row){ layer.full(layer.open({ type: 2, title: "修改等级", title: "查看", maxmin: true, area: [MUI.SIZE_L, '500px'], content : [ basePath + '/admin/redirect/fenxiao/fenxiao-udpate'] content : [ basePath + '/admin/redirect/fenxiao/fenxiao-update?userId=' + row.userId+'&applyId='+row.id ] })); }, //审核 @@ -430,8 +673,10 @@ examineSaleManApply(row,type){ let _this = this; let userId = row.userId; let applyId = row.id; let obj = { userId: userId, applyId: applyId, applyState: type, } AjaxProxy.requst({ @@ -440,12 +685,9 @@ url: basePath + '/fenXiao/fenXiaoUser/examineSaleManApply', callback: function (data) { _this.$message.success(data.info); this.loadData(); _this.loadParamSetting(); } }); }, submit() { } } })
