<!--
|
* @Author: 小明丶
|
* @Date: 2020-04-09 16:11:01
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-04-09 16:45:30
|
* @Description:
|
-->
|
<!--
|
* @Author: 小明丶
|
* @Date: 2020-04-03 14:58:33
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-04-08 11:28:40
|
* @Description: 选择通道
|
-->
|
<template>
|
<div class="tdxz-div">
|
<van-nav-bar title="选择通道" left-text="返回" left-arrow @click-left="onClickLeft" fixed style="line-height: 43px;">
|
<i class="iconfont iconzuojiantou" slot="left" style="font-size: 25px;"></i>
|
</van-nav-bar>
|
<div class="proudct-box">
|
<div v-for="(e,i) in list" :key="i" @click="goNext(e)">
|
<img :src="e.icon" alt="">
|
<p>{{e.zfbVersionName}}</p>
|
</div>
|
</div>
|
<van-popup v-model="noOpenShow" class="no-open">
|
<div class="no-open-img">
|
<img src="../../../assets/imgs/openpic.png" alt="">
|
</div>
|
<p>{{ noOpenText }}</p>
|
<van-button type="default" class="no-open-btn" @click="noOpenShow = false" round>确定</van-button>
|
</van-popup>
|
</div>
|
</template>
|
<script>
|
import Vue from 'vue';
|
import { NavBar } from 'vant';
|
|
Vue.use(NavBar);
|
export default {
|
data() {
|
return {
|
noOpenText: '门店暂未开通此通道', //产品未开通文本内容
|
noOpenShow: false, //产品未开通弹窗控制
|
list:[],//通道列表
|
}
|
},
|
created(){
|
// this.$api.prodZfbVersion().then(res=>{
|
// this.list = res.body
|
// })
|
this.list = JSON.parse(sessionStorage.getItem('td-mer-photo'))
|
console.log(this.list)
|
},
|
methods:{
|
// 返回上一页
|
onClickLeft() {
|
this.$router.go(-1);
|
},
|
// 跳转
|
goNext(item){
|
|
// var id = this.$route.query.typeId,
|
// path = '';
|
// if(item.openStatus == 2){
|
// switch (Number(id)) {
|
// case 200008:
|
// path = '/facepay/calcmoney';
|
// break
|
// case 200002:
|
// path = '/hb-credit-installment';
|
// break
|
// case 200009:
|
// path = '/hbhy-installment';
|
// break
|
// case 200010:
|
// path = '/shtx';
|
// break
|
// }
|
// }else{
|
// this.noOpenShow = true
|
// return
|
// }
|
if(item.hbStatus != 0){
|
this.$router.push({
|
path:'/relatedpictures',
|
query:{
|
// typeId: this.$route.query.typeId,
|
// prodId: this.$route.query.prodId,
|
merId:this.$route.query.merId,
|
zfbVersion:item.zfbVersion
|
}
|
})
|
}
|
else{
|
this.noOpenShow = true
|
return
|
}
|
|
}
|
}
|
}
|
</script>
|
<style lang="less" scoped>
|
.tdxz-div{
|
min-height: 100vh;
|
background: #F5F5F7;
|
padding-top: 56px;
|
.proudct-box{
|
width: 359px;
|
margin: auto;
|
box-sizing: border-box;
|
padding:16px 0;
|
// display: flex;
|
// justify-items: space-between;
|
background: #fff;
|
div{
|
display: inline-block;
|
width: 115px;
|
height: 90px;
|
box-shadow:0px 0px 15px 0px rgba(66,61,93,0.08);
|
border-radius:8px;
|
margin: 16px 31px 16px 31px;
|
text-align: center;
|
box-sizing: border-box;
|
padding: 14px 0 18px 0;
|
img{
|
width: 42px;
|
height: 42px;
|
}
|
p{
|
font-size: 13px;
|
color: #333;
|
}
|
}
|
}
|
.no-open{
|
width: 280px;
|
height: 190px;
|
text-align: center;
|
border-radius: 6px;
|
&-img{
|
width: 100%;
|
margin-top: 13px;
|
img{
|
width: 75px;
|
height: 75px;
|
}
|
}
|
p{
|
font-size: 14px;
|
color: #666666;
|
margin-top: 7px;
|
}
|
&-btn{
|
height: 36px;
|
width: 60%;
|
margin: 0 20%;
|
background: #896EDB;
|
color: #fff;
|
margin-top: 28px;
|
line-height: 36px;
|
}
|
}
|
}
|
</style>
|
