| | |
|---|
| | | 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> |
|---|
| | |
|---|
| | | <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:'全部'}, |
|---|
| | |
|---|
| | | {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, |
|---|
| | |
|---|
| | | //加载分类 |
|---|
| | | loadInfo() { |
|---|
| | | let _this = this; |
|---|
| | | //_this.loadParamSetting(); |
|---|
| | | //_this.getSalemanGradeList(); |
|---|
| | | _this.loadParamSetting(); |
|---|
| | | _this.loadParamSettinglow(); |
|---|
| | | _this.getDatalist(); |
|---|
| | | }, |
|---|
| | | //绑定客户 |
|---|
| | | loadParamSetting() { |
|---|
| | | let _this = this; |
|---|
| | | let data=_this.getRequestParam(); |
|---|
| | |
|---|
| | | 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, |
|---|
| | |
|---|
| | | _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){ |
|---|
| | |
|---|
| | | 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(){ |
|---|
