|
@@ -2,340 +2,240 @@
|
|
|
<div class="conatainer">
|
|
|
<div class="header">
|
|
|
<h2 class="title">您好,{{ userInfo.partnerName }}</h2>
|
|
|
- <router-link
|
|
|
- :to="{path: '/partner/goods' + '?partnerId=' + userInfo.id + '&partnerName=' + userInfo.partnerName + '&partnerImgUrl=' + userInfo.partnerImgUrl}">
|
|
|
- <img src="./image/xiaoshou_bg_tuiguang@2x.png" alt="">
|
|
|
- </router-link>
|
|
|
+ <p class="nav-wrap">
|
|
|
+ <router-link
|
|
|
+ :to="{path: '/partner/goods' + '?partnerId=' + userInfo.id + '&partnerName=' + userInfo.partnerName + '&partnerImgUrl=' + userInfo.partnerImgUrl}">
|
|
|
+ <img src="./image/bg_xindai_tuiguang@2x.png" alt="">
|
|
|
+ </router-link>
|
|
|
+ <a href="javascript:;" @click="funJumpParterExplain">
|
|
|
+ <img src="./image/bg_hehuoren_zhaomu@2x.png" alt="">
|
|
|
+ </a>
|
|
|
+ </p>
|
|
|
</div>
|
|
|
- <p class="my-customer">我的客户</p>
|
|
|
- <div class="better-scroll wrapper" ref="wrapper">
|
|
|
- <ul>
|
|
|
- <li class="list" v-for="(item, index) in listData" :key="index">
|
|
|
- <div class="name-wrap">
|
|
|
- <div class="avatar">
|
|
|
- <img :src="item.userHeadImgUrl" alt="">
|
|
|
- </div>
|
|
|
- <p class="name">{{ item.orderUserName }}</p>
|
|
|
- </div>
|
|
|
- <p class="phone">手机号:{{ item.orderUserPhone }}</p>
|
|
|
- <div class="loan-info">
|
|
|
- <p class="label">申请产品:{{ item.orderProduceName }}</p>
|
|
|
- <p>
|
|
|
- <span class="label">需求金额:</span>
|
|
|
- <span class="value">{{ item.orderPrice / 10000}}万元</span>
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <p class="create-time">申请时间:{{ item.createdAt }}</p>
|
|
|
- <!--orderFinalStatus:0-进行中 1-成功 2-失败-->
|
|
|
- <p class="status bg-0" v-if="item.orderFinalStatus === 0">进度:{{ item.orderStatus }}</p>
|
|
|
- <p class="status bg-1" v-if="item.orderFinalStatus === 1">{{ item.orderStatus }}</p>
|
|
|
- <p class="status bg-2" v-if="item.orderFinalStatus === 2">{{ item.orderStatus }}</p>
|
|
|
- </li>
|
|
|
- <li class="load-status" v-if="listData.length && booFetchData">
|
|
|
- <p>{{ arrFetchStatus[numFetchStatus] }}</p>
|
|
|
- </li>
|
|
|
- <li class="bitmap" v-if="!listData.length && booFetchData">
|
|
|
- <p>暂无记录</p>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <div class="my-customer border-bottom-1px">
|
|
|
+ <div class="top">
|
|
|
+ <p class="label">我的客户</p>
|
|
|
+ <p class="nav-wrap">
|
|
|
+ <router-link :class="{'active': $route.name === 'partnerCustomer'}" :to="{path: '/partner'}">客户</router-link>
|
|
|
+ <router-link :class="{'active': $route.name === 'partnerAll'}" :to="{path: '/partner/business'}">合伙人
|
|
|
+ </router-link>
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <van-search
|
|
|
+ :show-action="true"
|
|
|
+ v-model="searChValue"
|
|
|
+ @search="searchHandle"
|
|
|
+ @clear="clearHandle"
|
|
|
+ placeholder="输入姓名、手机号">
|
|
|
+ <template #action>
|
|
|
+ <span @click="searchHandle">搜索</span>
|
|
|
+ </template>
|
|
|
+ </van-search>
|
|
|
</div>
|
|
|
+ <keep-alive>
|
|
|
+ <router-view v-if="$route.meta.keepAlive"></router-view>
|
|
|
+ </keep-alive>
|
|
|
+ <router-view v-if="!$route.meta.keepAlive"></router-view>
|
|
|
+ <Poster :posterBg="posterBg"
|
|
|
+ :codeParams="codeParams"
|
|
|
+ ref="myPoster"/>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import BScroll from 'better-scroll'
|
|
|
- import { Toast } from 'vant'
|
|
|
- import { saleList } from './api'
|
|
|
- import { mapGetters } from 'vuex'
|
|
|
-
|
|
|
- const PAGESIZE = 20
|
|
|
- export default {
|
|
|
- name: 'marketing',
|
|
|
- data () {
|
|
|
- return {
|
|
|
- pager: {
|
|
|
- pagenum: 1,
|
|
|
- pagesize: PAGESIZE,
|
|
|
- pagecount: 1
|
|
|
- },
|
|
|
- listData: [],
|
|
|
- scroll: null,
|
|
|
- numFetchStatus: 0,
|
|
|
- arrFetchStatus: ['正在加载,请稍后~', '上拉加载更多', '没有更多了', '出错啦'],
|
|
|
- booFetchData: false,
|
|
|
- numPositionY: 0
|
|
|
+import { Search } from 'vant'
|
|
|
+import Poster from '../poster'
|
|
|
+import { mapGetters } from 'vuex'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'marketing',
|
|
|
+ components: {
|
|
|
+ 'van-search': Search,
|
|
|
+ Poster
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ posterBg: require('./image/poster_partner.png'),
|
|
|
+ codeParams: {
|
|
|
+ partnerImgUrl: '',
|
|
|
+ partnerName: '',
|
|
|
+ link: '',
|
|
|
+ x: 122,
|
|
|
+ y: 1191,
|
|
|
+ width: 202,
|
|
|
+ height: 192
|
|
|
}
|
|
|
- },
|
|
|
- activated () {
|
|
|
- if (!this.$route.meta.isUseCache) {
|
|
|
- this.pager = {
|
|
|
- pagenum: 1,
|
|
|
- pagesize: PAGESIZE,
|
|
|
- pagecount: 1
|
|
|
- }
|
|
|
- this.listData = []
|
|
|
- this.numFetchStatus = 0
|
|
|
- this.booFetchData = false
|
|
|
- this.numPositionY = 0
|
|
|
- this.funFetch()
|
|
|
- } else {
|
|
|
- this.$nextTick(() => {
|
|
|
- if (this.scroll) {
|
|
|
- this.scroll.refresh()
|
|
|
- this.scroll.scrollTo(0, this.numPositionY)
|
|
|
- }
|
|
|
- })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refreshTitle('妥妥推手')
|
|
|
+ })
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({
|
|
|
+ userInfo: 'partnerMine/userInfo'
|
|
|
+ }),
|
|
|
+ searChValue: {
|
|
|
+ get () {
|
|
|
+ return this.$store.getters['business/searchValue']
|
|
|
+ },
|
|
|
+ set (val) {
|
|
|
+ this.$store.dispatch('business/setSearchValue', val)
|
|
|
}
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ funJumpParterExplain () {
|
|
|
+ const { partnerImgUrl, partnerName, inviteCode } = this.userInfo
|
|
|
+ this.$set(this.codeParams, 'partnerImgUrl', partnerImgUrl)
|
|
|
+ this.$set(this.codeParams, 'partnerName', partnerName)
|
|
|
+ this.$set(this.codeParams, 'link', `${location.origin}/partner/explain?inviteCode=${inviteCode}`)
|
|
|
this.$nextTick(() => {
|
|
|
- this.$refreshTitle('销售')
|
|
|
+ this.$refs.myPoster.createQRCode()
|
|
|
})
|
|
|
},
|
|
|
- computed: {
|
|
|
- ...mapGetters({
|
|
|
- userInfo: 'partnerMine/userInfo'
|
|
|
- })
|
|
|
+ searchHandle () {
|
|
|
+ this.$store.dispatch('business/setIsSearch', 1)
|
|
|
},
|
|
|
- methods: {
|
|
|
- funFetch () {
|
|
|
- const vm = this
|
|
|
- vm.numFetchStatus = 0
|
|
|
- saleList(vm.pager.pagenum, vm.pager.pagesize).then(response => {
|
|
|
- if (response.status) {
|
|
|
- const data = response.data
|
|
|
- const temp = data.data
|
|
|
- vm.pager.pagecount = Math.ceil(data.count / PAGESIZE)
|
|
|
- vm.pager.pagenum++
|
|
|
- vm.booFetchData = true
|
|
|
- if (vm.pager.pagecount <= 1) {
|
|
|
- vm.numFetchStatus = 2
|
|
|
- } else {
|
|
|
- vm.numFetchStatus = 1
|
|
|
- }
|
|
|
- if (temp.length) {
|
|
|
- vm.listData = vm.listData.concat(temp)
|
|
|
- vm.$nextTick(() => {
|
|
|
- if (!vm.scroll) {
|
|
|
- vm.scroll = new BScroll(vm.$refs.wrapper, {
|
|
|
- click: true,
|
|
|
- pullUpLoad: {
|
|
|
- threshold: -20
|
|
|
- },
|
|
|
- scrollbar: true
|
|
|
- })
|
|
|
- vm.scroll.on('pullingUp', () => {
|
|
|
- if (vm.pager.pagenum > vm.pager.pagecount) {
|
|
|
- vm.numFetchStatus = 2
|
|
|
- return
|
|
|
- }
|
|
|
- vm.funFetch()
|
|
|
- })
|
|
|
- } else {
|
|
|
- vm.scroll.refresh()
|
|
|
- vm.scroll.finishPullUp()
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- } else {
|
|
|
- Toast(response.msg)
|
|
|
- vm.numFetchStatus = 3
|
|
|
- }
|
|
|
- }).catch(() => {
|
|
|
- Toast('出错啦')
|
|
|
- vm.numFetchStatus = 3
|
|
|
- })
|
|
|
- }
|
|
|
+ clearHandle () {
|
|
|
+ this.$store.dispatch('business/setIsSearch', 1)
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .conatainer {
|
|
|
- position: relative;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- .header {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 100%;
|
|
|
- padding: 24px 0 20px;
|
|
|
- background: #fff;
|
|
|
-
|
|
|
- .title {
|
|
|
- width: 100%;
|
|
|
- padding-left: 24px;
|
|
|
- line-height: 33px;
|
|
|
- font-size: 24px;
|
|
|
- font-weight: 500;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- img {
|
|
|
- display: block;
|
|
|
- width: 343px;
|
|
|
- height: 88px;
|
|
|
- margin: 12px 0 0 17px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .my-customer {
|
|
|
+.conatainer {
|
|
|
+ position: relative;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.header {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 100%;
|
|
|
+ padding: 24px 0 22px;
|
|
|
+
|
|
|
+ .title {
|
|
|
width: 100%;
|
|
|
padding-left: 24px;
|
|
|
- margin: 24px 0 16px;
|
|
|
- line-height: 25px;
|
|
|
- font-size: 18px;
|
|
|
+ line-height: 33px;
|
|
|
+ font-size: 24px;
|
|
|
font-weight: 500;
|
|
|
color: #333;
|
|
|
}
|
|
|
|
|
|
- .wrapper {
|
|
|
- position: relative;
|
|
|
- width: 100%;
|
|
|
- height: calc(100vh - 242px);
|
|
|
- overflow: hidden;
|
|
|
-
|
|
|
- ul {
|
|
|
- width: 100%;
|
|
|
- padding-bottom: 100px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .list {
|
|
|
- position: relative;
|
|
|
- left: 0;
|
|
|
- top: 0;
|
|
|
+ .nav-wrap {
|
|
|
display: flex;
|
|
|
- flex-direction: column;
|
|
|
align-items: center;
|
|
|
- width: 100%;
|
|
|
- padding: 19px 0 16px;
|
|
|
+ padding-left: 17px;
|
|
|
margin-top: 12px;
|
|
|
- border-radius: 4px;
|
|
|
- background: #FFF;
|
|
|
- box-shadow: 0 2px 0px -1px rgba(224, 224, 224, 0.5);
|
|
|
|
|
|
- &:nth-of-type(1) {
|
|
|
- margin-top: 0;
|
|
|
+ a:nth-of-type(2) {
|
|
|
+ margin-left: 18px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .name-wrap {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- width: 331px;
|
|
|
+ img {
|
|
|
+ display: block;
|
|
|
+ width: 163px;
|
|
|
+ height: 88px;
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
- .avatar {
|
|
|
- width: 25px;
|
|
|
- height: 25px;
|
|
|
- margin-right: 13px;
|
|
|
- border-radius: 50%;
|
|
|
- overflow: hidden;
|
|
|
+.my-customer {
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 12px;
|
|
|
+ background: #fff;
|
|
|
|
|
|
- img {
|
|
|
- display: block;
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
+ .top {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 10px 40px 15px 24px;
|
|
|
+ @include border-bottom-1px(#E0E0E0);
|
|
|
}
|
|
|
|
|
|
- .name,
|
|
|
- .phone {
|
|
|
- line-height: 20px;
|
|
|
- font-size: 15px;
|
|
|
+ .label {
|
|
|
+ line-height: 25px;
|
|
|
+ font-size: 18px;
|
|
|
font-weight: 500;
|
|
|
color: #333;
|
|
|
}
|
|
|
|
|
|
- .phone {
|
|
|
- width: 331px;
|
|
|
- margin-top: 14px;
|
|
|
- }
|
|
|
-
|
|
|
- .loan-info {
|
|
|
+ .nav-wrap {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- width: 331px;
|
|
|
- margin-top: 7px;
|
|
|
-
|
|
|
- p {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- &:nth-of-type(2) {
|
|
|
- margin-left: 17px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .label {
|
|
|
- line-height: 20px;
|
|
|
- font-size: 15px;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .value {
|
|
|
- line-height: 20px;
|
|
|
- font-size: 15px;
|
|
|
- font-weight: 500;
|
|
|
- color: #EE0A23;
|
|
|
- }
|
|
|
}
|
|
|
|
|
|
- .create-time {
|
|
|
- width: 331px;
|
|
|
- margin-top: 7px;
|
|
|
- line-height: 17px;
|
|
|
- font-size: 12px;
|
|
|
- color: #999;
|
|
|
- }
|
|
|
-
|
|
|
- .status {
|
|
|
- position: absolute;
|
|
|
- right: 16px;
|
|
|
- top: 16px;
|
|
|
- z-index: 1;
|
|
|
- padding: 0 8px;
|
|
|
- border-radius: 4px;
|
|
|
+ a {
|
|
|
+ position: relative;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ padding: 0 9px;
|
|
|
line-height: 22px;
|
|
|
- font-size: 15px;
|
|
|
+ font-size: 16px;
|
|
|
font-weight: 500;
|
|
|
- color: #fff;
|
|
|
+ color: #333;
|
|
|
|
|
|
- &.bg-0 {
|
|
|
- background: #F39D41;
|
|
|
+ &:nth-of-type(2) {
|
|
|
+ margin-left: 27px;
|
|
|
}
|
|
|
|
|
|
- &.bg-1 {
|
|
|
- background: #53DA6A;
|
|
|
+ &.active:after {
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom: -2px;
|
|
|
+ display: block;
|
|
|
+ content: '';
|
|
|
+ width: 100%;
|
|
|
+ height: 2px;
|
|
|
+ background: linear-gradient(90deg, #DBC3A9 0%, #C7AB8A 100%);
|
|
|
+ border-radius: 2px;
|
|
|
}
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- &.bg-2 {
|
|
|
- background: #EE0A23;
|
|
|
- }
|
|
|
+::v-deep .van-search {
|
|
|
+ width: 327px;
|
|
|
+ height: 40px;
|
|
|
+ padding-left: 0;
|
|
|
+ margin: 10px auto 11px;
|
|
|
+
|
|
|
+ .van-search__content {
|
|
|
+ border-radius: 20px;
|
|
|
+ background: #F2F2F2;
|
|
|
}
|
|
|
|
|
|
- .load-status {
|
|
|
- margin-top: 12px;
|
|
|
+ .van-cell {
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
|
|
|
- p {
|
|
|
- line-height: 20px;
|
|
|
- font-size: 14px;
|
|
|
- color: #666;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
+ .van-icon-search {
|
|
|
+ font-size: 22px;
|
|
|
+ color: #DDDDDD;
|
|
|
}
|
|
|
|
|
|
- .bitmap {
|
|
|
- p {
|
|
|
- line-height: 22px;
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 500;
|
|
|
- text-align: center;
|
|
|
- color: #333;
|
|
|
+ .van-field__control {
|
|
|
+ line-height: 17px;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #333;
|
|
|
+ overflow: hidden;
|
|
|
+ background: transparent;
|
|
|
+ -webkit-text-fill-color: #333;
|
|
|
+ opacity: 1;
|
|
|
+
|
|
|
+ &::-webkit-input-placeholder {
|
|
|
+ color: #999;
|
|
|
+ -webkit-text-fill-color: #999;
|
|
|
+ opacity: 1;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|