From 95f9ea7eb339c36cade6c67d0385c49ec2d81477 Mon Sep 17 00:00:00 2001 From: 935090232@qq.com <ak473600000> Date: Wed, 14 Apr 2021 19:39:45 +0800 Subject: [PATCH] Merge branch 'score_shop' into api_score_meger --- zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-user.html | 770 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 770 insertions(+), 0 deletions(-) diff --git a/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-user.html b/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-user.html new file mode 100644 index 0000000..2e975b3 --- /dev/null +++ b/zq-erp/src/main/resources/templates/views/admin/fenxiao/fenxiao-user.html @@ -0,0 +1,770 @@ +<!DOCTYPE HTML> +<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> +<head> + <meta charset="utf-8"> + <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> + <meta name="renderer" content="webkit|ie-comp|ie-stand"> + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> + <meta name="viewport" + content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> + <meta http-equiv="Cache-Control" content="no-siteapp"/> + <!-- 本框架基本脚本和样式 --> + <script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script> + <link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}"> + <link rel="stylesheet" th:href="@{/plugin/bootstrap-3.3.5/css/bootstrap.min.css}"> + <link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/> + + <!-- 富文本编辑器 --> + <script type="text/javascript" charset="utf-8" + th:src="@{/plugin/beditor/ueditor.config.js}"></script> + <script type="text/javascript" charset="utf-8" + th:src="@{/plugin/beditor/ueditor.all.js}"> + </script> + <script type="text/javascript" charset="utf-8" + th:src="@{/plugin/beditor/lang/zh-cn/zh-cn.js}"></script> + <style> + .panel-body{ + overflow: hidden; + } + .paginationStyle{ + background: #ffffff; + padding: 10px 10px; + 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> + +<body> +<div class="panel-body" id="app" v-cloak> + <el-row> + <el-tabs v-model="activeName" > + <el-tab-pane label="分销员管理" name="first"> + <el-row > + <el-col :span="6" style="display:flex;align-items: center;"> + <el-button type="primary" @click="addSaleMan()">新增分销员</el-button> + </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="请选择"> + <el-option + v-for="item in shenheStateList" + :key="item.value" + :label="item.label" + :value="item.value" + > + </el-option> + </el-select> + </el-form-item> + <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-select> + </el-form-item> + <el-form-item prop="userName"> + <el-input v-model="form.userName" placeholder="请输入会员姓名"></el-input> + </el-form-item> + </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" > + <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 + width="150"> + <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="parentUserNow" + label="当前上级"> + </el-table-column> + <el-table-column + prop="lowerLevelNum" + label="推广客户"> + </el-table-column> + <el-table-column + prop="invitedNum" + label="邀请下级"> + </el-table-column> + <el-table-column + prop="totalRevenue" + label="累计收益"> + </el-table-column> + <el-table-column + prop="balance" + label="待结算"> + </el-table-column> + <el-table-column + prop="grade" + label="等级"> + </el-table-column> + <el-table-column + prop="createTime" + label="加入时间" + show-overflow-tooltip + :formatter="formatDate"> + </el-table-column> + <el-table-column + label="状态"> + <template slot-scope="scope"> + <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 + prop="parentUser" + 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" 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="danger" v-if="scope.row.applyStatus == 2" size="mini" @click="delSaleManGradeApply(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 class="table-style" > + <el-table id="proj" :data="fyfaList.rows" :height="height"> + <el-table-column + prop="name" + 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="sealesCommission" + label="自购返佣 %"> + <template slot-scope="scope"> + <el-input class="edit-input" v-model="scope.row.selfCommission" oninput ="value=value.replace(/[^0-9.]/g,'')" placeholder="自购返佣"></el-input> + </template> + </el-table-column> + <el-table-column + 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="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="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 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="addFyfaReady()">新增</el-button> + <el-button type="primary" size="mini" @click="updateFyfa(scope.row)">保存</el-button> + <el-button type="danger" v-if="scope.row.isDefault == 2" size="mini" @click="delFyfa(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="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"> + <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" size="mini" @click="wamsSubmit()">保存</el-button> + </el-row> + </el-tab-pane> + + <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> +</body> +<script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> +<script type="text/javascript" th:src="@{/js/plugin/jquery.query.js}"></script> +<script type="text/javascript" th:src="@{/plugin/bootstrap-3.3.5/js/bootstrap.min.js}"></script> +<script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script> +<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script> +<script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script> +<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> +<script type="text/javascript" th:src="@{/plugin/layer/layer.js}"></script> +<script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script> + +<script> + //百度编辑器 + var ue = { + initialFrameWidth :750 + }; + var app = new Vue({ + el: '#app', + data: { + height:'calc(100vh - 240px)', + activeName: 'first', + fenxiaoGrade: "", + //推广文案 + tgwa: {}, + //图片上传 + imageUrl: '', + //分佣方案 + fyfaList:{ + rows:[], + total:0, + pageSize:10, + currentPage:1, + }, + //分销员管理 + shenheAgreeType : 2, + shenheDisagreeType : 3, + form:{ + shenheState:'', + salemanGrade:'', + userName:'', + order:'', + sort:'' + }, + //条件查询审核状态 + shenheStateList:[ + {value:'',label:'全部'}, + {value:1,label:'未审核'}, + {value:2,label:'通过'}, + {value:3,label:'未通过'} + ], + //条件查询分销员等级 + salemanGradeList:[], + fxyList:{ + rows:[], + total:0, + pageSize:10, + currentPage:1, + }, + }, + created: function () { + this.loadInfo(); + window.addEventListener("keydown", this.keydown); + //初始化编辑器 + ue = UE.getEditor('description', { + toolbars: [ + [ + 'anchor', + 'bold', //加粗 + 'indent', //首行缩进 + 'italic', //斜体 + 'underline', //下划线 + 'strikethrough', //删除线 + 'subscript', //下标 + 'fontborder', //字符边框 + 'superscript', //上标 + 'formatmatch', //格式刷 + 'pasteplain', //纯文本粘贴模式 + 'selectall', //全选 + 'horizontal', //分隔线 + 'removeformat', //清除格式 + 'unlink', //取消链接 + 'inserttitle', //插入标题 + 'cleardoc', //清空文档 + 'fontfamily', //字体 + 'fontsize', //字号 + 'paragraph', //段落格式 + 'simpleupload', //单图上传 + 'insertimage', //多图上传 + 'link', //超链接 + 'emotion', //表情 + 'justifyleft', //居左对齐 + 'justifyright', //居右对齐 + 'justifycenter', //居中对齐 + 'justifyjustify', //两端对齐 + 'forecolor', //字体颜色 + 'backcolor', //背景色 + 'insertorderedlist', //有序列表 + 'insertunorderedlist', //无序列表 + 'fullscreen', //全屏 + 'rowspacingtop', //段前距 + 'rowspacingbottom', //段后距 + 'imagecenter', //居中 + 'lineheight', //行间距 + 'customstyle', //自定义标题 + 'autotypeset', //自动排版 + 'background', //背景 + ] + ]}); + }, + mounted: function () { + }, + methods: { + //加载分类 + loadInfo() { + let _this = this; + _this.loadParamSetting(); + _this.loadFyfaSetting(); + _this.loadTgwaSetting(); + _this.loadTgtpSetting(); + _this.getSalemanGradeList(); + }, + //推广文案 + 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 + }); + } + }); + }, + 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; + }, + //分佣方案 + 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; + } + }); + }, + changePageSizelow(val) { + this.fyfaList.pageSize = val; + this.loadFyfaSetting(); + }, + changeCurrentPagelow(val) { + this.fyfaList.currentPage = val; + this.loadFyfaSetting(); + }, + //新增 + addFyfaReady(){ + let _this = this; + let fyfaReady = {}; + _this.fyfaList.rows.push(fyfaReady); + }, + // 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 selfCommission = row.selfCommission; + let invitationCommission = row.invitationCommission; + let gradeCondition = row.gradeCondition; + let obj = { + id: id, + name: name, + sealesCommission: sealesCommission, + selfCommission: selfCommission, + 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); + + }).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); + _this.loadFyfaSetting(); + } + }); + }, + //分销员管理 + loadParamSetting() { + let _this = this; + let data=_this.getRequestParam(); + data.pageSize=_this.fxyList.pageSize; + data.pageNum=_this.fxyList.currentPage; + AjaxProxy.requst({ + app: _this, + data:data, + url: basePath + '/fenXiao/fenXiaoUser/findShopSalesmanApplyList', + callback: function (data) { + _this.fxyList.rows = data.rows; + _this.fxyList.total=data.total; + } + }); + }, + // 下拉框数据源---分销员等级 + getSalemanGradeList() { + let _this = this; + AjaxProxy.requst({ + app: _this, + data:[], + url: basePath + '/fenXiao/fenXiaoUser/getShopSalesmanGrade', + callback: function (data) { + _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.loadParamSetting(); + }, + keydown(evt){ + if(evt.keyCode==13) { + this.search(); + } + }, + resetForm(formName) { + this.$refs[formName].resetFields(); + }, + sortChange:function (column){ + if(column.order){ + if(column.order.indexOf("desc")){ + this.form.order="desc"; + }else{ + this.form.order="asc"; + } + this.form.sort=column.prop; + this.loadParamSetting(); + } + }, + changePageSize(val) { + this.fxyList.pageSize = val; + this.loadParamSetting(); + }, + changeCurrentPage(val) { + this.fxyList.currentPage = val; + this.loadParamSetting(); + }, + //时间格式化 + 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'] + })); + }, + //删除 + 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: "查看", + maxmin: true, + area: [MUI.SIZE_L, '500px'], + content : [ basePath + '/admin/redirect/fenxiao/fenxiao-update?userId=' + row.userId+'&applyId='+row.id ] + })); + }, + //审核 + openExamineSaleManApply(row) { + this.$confirm('是否通过?', '审核', { + distinguishCancelAndClose: true,//设置关闭按钮和不通过按钮的区别 + confirmButtonText: '通过', + cancelButtonText: '不通过', + type: 'info' + }).then(() => { + //通过 + this.examineSaleManApply(row,this.shenheAgreeType); + }).catch(action => { + //不通过 + if(action === 'cancel'){ + this.examineSaleManApply(row,this.shenheDisagreeType); + }else{ + //关闭按钮 + console.log("close"); + //this.$message({type: 'info',message: ''}) + } + }); + }, + examineSaleManApply(row,type){ + let _this = this; + let userId = row.userId; + let applyId = row.id; + let obj = { + userId: userId, + applyId: applyId, + applyState: type, + } + AjaxProxy.requst({ + app: _this, + data:obj, + url: basePath + '/fenXiao/fenXiaoUser/examineSaleManApply', + callback: function (data) { + _this.$message.success(data.info); + _this.loadParamSetting(); + } + }); + } + } + }) +</script> + +</body> +</html> \ No newline at end of file -- Gitblit v1.9.1