|
|
@@ -0,0 +1,511 @@
|
|
|
+<template>
|
|
|
+ <div class="partner-detail">
|
|
|
+ <h1>剑鱼伙伴</h1>
|
|
|
+ <Row class="par-row">
|
|
|
+ <Col style="float:left;width: 20%" class="top-col">
|
|
|
+ <Card>
|
|
|
+ <div slot="title" class="top-tit">
|
|
|
+ <div class="avatr">
|
|
|
+ <img :src="parDetail.headImg" v-if="parDetail.headImg">
|
|
|
+ <img src="../../assets/images/moren.png" v-else>
|
|
|
+ </div>
|
|
|
+ <div class="names">{{parDetail.name}}</div>
|
|
|
+ <div class="msg1"><span>{{parDetail.phone}}</span></div>
|
|
|
+ <div class="msg1 msg2"><span>{{parDetail.email}}</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="bot-tit">
|
|
|
+ <div class="over-view" @click="tabClick(1)" :class="{active:infor === 1}"><span>概览</span></div>
|
|
|
+ <div class="basic" @click="tabClick(2)" :class="{active:infor === 2}"><span>基本信息<i :class="parDetail.auth_status | authColor">{{parDetail.auth_status | authStatus}}</i></span></div>
|
|
|
+ <div class="fund" @click="tabClick(3)" :class="{active:infor === 3}"><span>资金明细</span></div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ </Col>
|
|
|
+ <Col style="float:left;width: 77.5%">
|
|
|
+ <Card v-if="infor == 1">
|
|
|
+ <div slot="title" class="right-fund">概览</div>
|
|
|
+ <div class="msg-card">
|
|
|
+ <Card>
|
|
|
+ <div class="add-time">
|
|
|
+ <div class="time1"><img src="../../assets/images/riqi.png" />加入日期</div>
|
|
|
+ <div class="time2">{{parDetail.createtime}}</div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div class="add-time">
|
|
|
+ <div class="time1"><img src="../../assets/images/riqi.png" />最后使用日期</div>
|
|
|
+ <div class="time2">{{parDetail.lastlogintime}}</div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div class="add-time">
|
|
|
+ <div class="time1"><img src="../../assets/images/yongjin.png" />累计销售额</div>
|
|
|
+ <div class="time2">￥{{(parDetail.dis_sales/100).toLocaleString('en-US')}}</div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div class="add-time">
|
|
|
+ <div class="time1"><img src="../../assets/images/dingdan.png" />累计销售订单</div>
|
|
|
+ <div class="time2">{{parDetail.dis_order}}</div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card>
|
|
|
+ <div class="add-time">
|
|
|
+ <div class="time1"><img src="../../assets/images/yongjin.png" />累计佣金</div>
|
|
|
+ <div class="time2">￥{{(parDetail.dis_commission/100).toLocaleString('en-US')}}</div>
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ </div>
|
|
|
+ <Table
|
|
|
+ size="large"
|
|
|
+ ellipsis
|
|
|
+ :loading="loading"
|
|
|
+ :columns="column1"
|
|
|
+ :data="datas1"
|
|
|
+ stripe
|
|
|
+ style="margin-top: 30px"
|
|
|
+ v-if="infor == 1"
|
|
|
+ ></Table>
|
|
|
+ </Card>
|
|
|
+ <Card v-else-if="infor == 2">
|
|
|
+ <div slot="title" class="right-fund">基本信息</div>
|
|
|
+ <div class="infor-card">
|
|
|
+ <div class="con" v-if="types == '2'">
|
|
|
+ <span>企业名称</span>
|
|
|
+ <span class="spa2">{{parDetail.name}}</span>
|
|
|
+ </div>
|
|
|
+ <div class="con" v-else>
|
|
|
+ <span>用户名</span>
|
|
|
+ <span class="spa2">{{parDetail.name}}</span>
|
|
|
+ </div>
|
|
|
+ <Divider />
|
|
|
+ <div class="con">
|
|
|
+ <span>手机</span>
|
|
|
+ <span class="spa2">{{parDetail.phone}}</span>
|
|
|
+ </div>
|
|
|
+ <Divider />
|
|
|
+ <div class="con">
|
|
|
+ <span>邮箱</span>
|
|
|
+ <span class="spa2">{{parDetail.email}}</span>
|
|
|
+ </div>
|
|
|
+ <Divider />
|
|
|
+ <div class="con">
|
|
|
+ <span>类型</span>
|
|
|
+ <span class="spa2">{{parDetail.type == '1'?'个人':'企业'}}</span>
|
|
|
+ </div>
|
|
|
+ <Divider />
|
|
|
+ <div class="con">
|
|
|
+ <span>渠道</span>
|
|
|
+ <span class="spa2">{{parDetail.channel}}</span>
|
|
|
+ </div>
|
|
|
+ <Divider />
|
|
|
+ <div class="con" v-if="types == '2'">
|
|
|
+ <span class="spa1">营业执照</span>
|
|
|
+ <img class="imgs" @click="fruit" :src="parDetail.license"/>
|
|
|
+ </div>
|
|
|
+ <Divider v-if="types == '2'" />
|
|
|
+ </div>
|
|
|
+ </Card>
|
|
|
+ <Card v-else>
|
|
|
+ <div slot="title" class="right-fund">资金明细</div>
|
|
|
+ <Table
|
|
|
+ size="large"
|
|
|
+ ellipsis
|
|
|
+ :loading="loading"
|
|
|
+ :columns="column2"
|
|
|
+ :data="datas2"
|
|
|
+ stripe
|
|
|
+ style="margin-top: 10px"
|
|
|
+ v-if="infor == 3"
|
|
|
+ >
|
|
|
+ <template slot-scope="{ row }" slot="_code">
|
|
|
+ <div @click="rowsClick(row)">{{row.code}}</div>
|
|
|
+ </template>
|
|
|
+ </Table>
|
|
|
+ </Card>
|
|
|
+ </Col>
|
|
|
+ </Row>
|
|
|
+ <Modal v-model="preview" footer-hide :styles="{top:0}" :width="800" class-name="par-model">
|
|
|
+ <img :src="parDetail.license">
|
|
|
+ </Modal>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { ChangeDate } from '../../assets/js/date'
|
|
|
+export default {
|
|
|
+ created () {
|
|
|
+ let rout = this.$route.query
|
|
|
+ this.$request('/sales/partnerList/partnerDetail').data({// 基本信息
|
|
|
+ uid: rout.uid,
|
|
|
+ id: rout.id
|
|
|
+ }).success((r) => {
|
|
|
+ this.parDetail = r.data;
|
|
|
+ this.parDetail.createtime = ChangeDate(this.parDetail.createtime);
|
|
|
+ this.parDetail.lastlogintime = ChangeDate(this.parDetail.lastlogintime)
|
|
|
+ }).get()
|
|
|
+
|
|
|
+ this.$request('/sales/partnerList/overview').data({// 概览
|
|
|
+ uid: rout.uid,
|
|
|
+ id: rout.id
|
|
|
+ }).success((r) => {
|
|
|
+ this.datas1 = r.data?r.data:[];
|
|
|
+ }).get()
|
|
|
+
|
|
|
+ this.$request('/sales/partnerList/capitalDetails').data({// 资金明细
|
|
|
+ uid: rout.uid
|
|
|
+ }).success((r) => {
|
|
|
+ let atr = [], atr1 = []
|
|
|
+ // 按时间先后排序
|
|
|
+ if (r.data) {
|
|
|
+ r.data.forEach(e => {
|
|
|
+ atr.push(new Date(e.createtime).getTime())
|
|
|
+ })
|
|
|
+ atr.sort(this.sortNum)
|
|
|
+ atr.forEach((v) => {
|
|
|
+ r.data.forEach(res => {
|
|
|
+ let ar = new Date(res.createtime).getTime()
|
|
|
+ if (ar === v) {
|
|
|
+ atr1.push(res)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.datas2 = atr1
|
|
|
+ }
|
|
|
+ }).get()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ load(val) {
|
|
|
+ this.loading = val
|
|
|
+ },
|
|
|
+ sortNum (a, b) {
|
|
|
+ return b - a
|
|
|
+ },
|
|
|
+ tabClick(index) {
|
|
|
+ this.infor = index
|
|
|
+ },
|
|
|
+ fruit() {
|
|
|
+ this.preview = true
|
|
|
+ },
|
|
|
+ rowsClick (arr) {
|
|
|
+ if (arr.type == '佣金') {
|
|
|
+ const paths = this.$router.resolve({
|
|
|
+ path: '/order/orderList/orderDetail',
|
|
|
+ query:{
|
|
|
+ id: arr.order_id,
|
|
|
+ proType: arr.product_name,
|
|
|
+ par: 1
|
|
|
+ }})
|
|
|
+ window.open(paths.href,'_blank')
|
|
|
+ } else if (arr.type == '提现') {
|
|
|
+ const paths = this.$router.resolve({
|
|
|
+ path: '/sales/withdrawList/withdrawDetail',
|
|
|
+ query:{
|
|
|
+ id: arr.id,
|
|
|
+ uid: arr.uid,
|
|
|
+ peType: String(arr.ptype),
|
|
|
+ deType: 'tixian',
|
|
|
+ par: 1
|
|
|
+ }})
|
|
|
+ window.open(paths.href,'_blank')
|
|
|
+ } else if (arr.type == '结算') {
|
|
|
+ const paths = this.$router.resolve({
|
|
|
+ path: '/sales/settleList/settleDetail',
|
|
|
+ query:{
|
|
|
+ id: arr.id,
|
|
|
+ uid: arr.uid,
|
|
|
+ deType: 'jiesuan',
|
|
|
+ par: 1
|
|
|
+ }})
|
|
|
+ window.open(paths.href,'_blank')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ authStatus (val) {
|
|
|
+ if (val == -1) {
|
|
|
+ return '未通过'
|
|
|
+ } else if (val == 0) {
|
|
|
+ return '未认证'
|
|
|
+ } else if (val == 1) {
|
|
|
+ return '已认证'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ authColor (val) {
|
|
|
+ if (val == -1) {
|
|
|
+ return 'color1'
|
|
|
+ } else if (val == 0) {
|
|
|
+ return 'color2'
|
|
|
+ } else if (val == 1) {
|
|
|
+ return 'color3'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ parDetail: [],
|
|
|
+ infor: 1,
|
|
|
+ types: this.$route.query.type,
|
|
|
+ preview: false,
|
|
|
+ datas1: [],
|
|
|
+ datas2: [],
|
|
|
+ column1: [
|
|
|
+ {
|
|
|
+ title: '产品名称',
|
|
|
+ key: 'product_name',
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '累计销售额',
|
|
|
+ key: 'sale_money_sum',
|
|
|
+ align: 'center',
|
|
|
+ render: (h, {row}) => {
|
|
|
+ return h('span','￥' + parseFloat(row.sale_money_sum/100).toLocaleString('en-US'))
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '累计销售订单',
|
|
|
+ key: 'count',
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '累计佣金',
|
|
|
+ key: 'commission_sum',
|
|
|
+ align: 'center',
|
|
|
+ render: (h, {row}) => {
|
|
|
+ return h('span','￥' + parseFloat(row.commission_sum/100).toLocaleString('en-US'))
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '平均佣金',
|
|
|
+ key: 'average',
|
|
|
+ align: 'center',
|
|
|
+ render: (h, {row}) => {
|
|
|
+ return h('span','￥' + parseFloat(row.average/100).toLocaleString('en-US'))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ column2: [
|
|
|
+ {
|
|
|
+ title: '订单号',
|
|
|
+ slot: '_code',
|
|
|
+ className: 'table-info-money',
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '类型',
|
|
|
+ key: 'type',
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '时间',
|
|
|
+ key: 'createtime',
|
|
|
+ align: 'center'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '金额',
|
|
|
+ key: 'money',
|
|
|
+ align: 'center',
|
|
|
+ render: (h, {row}) => {
|
|
|
+ return h('span','￥' + parseFloat(row.money/100).toLocaleString('en-US'))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.partner-detail {
|
|
|
+ .par-row {
|
|
|
+ background:#Fff;
|
|
|
+ padding:20px 0 20px 15px;
|
|
|
+ }
|
|
|
+ h1 {
|
|
|
+ font-size:24px;
|
|
|
+ color:#3f4047;
|
|
|
+ padding: 10px 0 20px 10px;
|
|
|
+ }
|
|
|
+ .top-col {
|
|
|
+ margin-right: 20px;
|
|
|
+ .ivu-card /deep/ {
|
|
|
+ .ivu-card-head {
|
|
|
+ padding: 28px 0;
|
|
|
+ }
|
|
|
+ .ivu-card-body {
|
|
|
+ padding: 0px!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .top-tit {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 25px;
|
|
|
+ .avatr {
|
|
|
+ width: 80px;
|
|
|
+ height: 80px;
|
|
|
+ border: 2px solid #f4f5f8;
|
|
|
+ border-radius: 63px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 20px 0 28px 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .names {
|
|
|
+ line-height: 23px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #1b1c1e;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ .msg1 {
|
|
|
+ width: 100%;
|
|
|
+ span {
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ height: 32px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: #7b7e8a;
|
|
|
+ background: url(../../assets/images/shoujihao.png) no-repeat 6px top;
|
|
|
+ background-size: 20px 20px;
|
|
|
+ padding-left: 40px;
|
|
|
+ word-break:break-all;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .msg2 {
|
|
|
+ span {
|
|
|
+ background: url(../../assets/images/youxiang.png) no-repeat 6px top;
|
|
|
+ background-size: 20px 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bot-tit {
|
|
|
+ padding: 20px 0;
|
|
|
+ div {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%!important;
|
|
|
+ height: 55px!important;
|
|
|
+ line-height: 55px!important;
|
|
|
+ color: #6f727d!important;
|
|
|
+ cursor: pointer;
|
|
|
+ &:hover {
|
|
|
+ span {
|
|
|
+ color: #475962;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ width: 100%;
|
|
|
+ background-size: 20px 20px!important;
|
|
|
+ padding-left: 40px;
|
|
|
+ margin: 0 25px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .over-view {
|
|
|
+ span {
|
|
|
+ background: url(../../assets/images/gailan.png) no-repeat 6px center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .basic {
|
|
|
+ span {
|
|
|
+ background: url(../../assets/images/xinxi.png) no-repeat 6px center;
|
|
|
+ }
|
|
|
+ i {
|
|
|
+ display: inline-block;
|
|
|
+ width: 60px;
|
|
|
+ color: #70b603;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ .color1 {
|
|
|
+ color: #f4516c;
|
|
|
+ }
|
|
|
+ .color2 {
|
|
|
+ color: #ffb822;
|
|
|
+ }
|
|
|
+ .color3 {
|
|
|
+ color: #34bfa3;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .fund {
|
|
|
+ span {
|
|
|
+ background: url(../../assets/images/mingxi.png) no-repeat 6px center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .active {
|
|
|
+ background:rgba(54,163,247, 0.2);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right-fund {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #575962;
|
|
|
+ }
|
|
|
+ .msg-card {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ flex-direction: initial;
|
|
|
+ align-items: center;
|
|
|
+ .ivu-card {
|
|
|
+ overflow:hidden;
|
|
|
+ width: 252px;
|
|
|
+ }
|
|
|
+ .ivu-card:not(:last-child) {
|
|
|
+ margin-right: 20px;
|
|
|
+ }
|
|
|
+ .add-time {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #1b1c1e;
|
|
|
+ .time1 {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: initial;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ img {
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .time2 {
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .infor-card {
|
|
|
+ margin: 30px auto;
|
|
|
+ width: 500px;
|
|
|
+ .con {
|
|
|
+ padding: 5px 30px;
|
|
|
+ font-size: 15px;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+ .spa2 {
|
|
|
+ text-align: right;
|
|
|
+
|
|
|
+ }
|
|
|
+ .spa1 {
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ .imgs {
|
|
|
+ float: right;
|
|
|
+ width: 192px;
|
|
|
+ min-height: 197px;
|
|
|
+ margin-bottom: 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
xgwangman