<!--
|
* @Author: 小明丶
|
* @Date: 2019-08-19 18:10:18
|
* @LastEditors: 小明丶
|
* @LastEditTime: 2020-12-26 13:53:40
|
* @Description:
|
-->
|
<template>
|
<div class="product-box h-100-g">
|
|
<nav class="product-title">
|
产品管理
|
</nav>
|
|
<div class="alipay" @click="$router.push('/product/facepay')">
|
<van-icon name="scan" />
|
<p>支付宝扫码收款</p>
|
</div>
|
|
|
<div class="product-list grid">
|
<div class="list-title">办理分期</div>
|
<div class="item flex-center-g" @click="handlerClick(item)" v-for="(item, index) in menu" :key="index" :class="item.icon.replace('#','')">
|
<div class="text-center-g" >
|
<svg class="icon" aria-hidden="true" :style="{fill:item.color}">
|
<use :xlink:href="item.icon"></use>
|
</svg>
|
<p class="label">{{item.label}}</p>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "product",
|
data() {
|
return {
|
// 菜单栏
|
menu: [
|
{
|
icon: '#iconxinyongkafenqi',
|
label: '信用卡分期',
|
path: '',
|
color:'#896EDB'
|
},
|
{
|
icon: '#iconhuabeifenqi',
|
label: '花呗分期',
|
color:'#896EDB'
|
},
|
{
|
icon: '#iconshoujifenqi',
|
label: '手机分期',
|
color:'#896EDB'
|
},
|
{
|
icon: '#icongoujizhijiang',
|
label: '购机直降',
|
color:'#ccc'
|
},
|
{
|
icon: '#iconzhixianghua',
|
label: '智享花',
|
color:'#896EDB'
|
},
|
{
|
icon: '#iconzhixianghua',
|
label: '信用购',
|
color:'#896EDB'
|
},
|
{
|
icon: '#icondangmianfu',
|
label: '商户收款',
|
color:'#ccc'
|
},
|
{
|
icon: '#iconhuabeiheyueji',
|
label: '花呗合约机',
|
color:'#896EDB'
|
},
|
{
|
icon: '#iconhuabeitie',
|
label: '花呗提额',
|
color:'#896EDB'
|
},
|
|
]
|
}
|
},
|
created() {
|
// this.openAuto();
|
},
|
methods: {
|
openAuto(){
|
let openId = window.localStorage.getItem("pOpenId");
|
let codeId = window.localStorage.getItem("pCodeId");
|
alert("openId:"+openId);
|
alert("codeId:"+codeId);
|
if(codeId == undefined) {
|
var strUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + "wx594ab33e0466eccf" +
|
"&redirect_uri=" + "https%3a%2f%2fsie.jycash.cn%2fsib_wx_scorec%2f%23%2f" + "&response_type=code&scope=snsapi_userinfo" + "#wechat_redirect";
|
window.location.href = strUrl;
|
}else if(openId == undefined){
|
this.$api.getWeChatUserInfo({"code":codeId}).then(
|
res => {
|
let openId = res.body;
|
window.localStorage.setItem("pOpenId",openId);
|
this.$api.setUserOpenId({"openId":openId}).then(
|
res => {
|
alert("updateOpenId:"+ openId);
|
},
|
error => {
|
statusCodeManage.showTipOfStatusCode(error, this);
|
}
|
);
|
},
|
error => {
|
statusCodeManage.showTipOfStatusCode(error, this);
|
}
|
);
|
}
|
},
|
handlerClick(item) {
|
if (item.path) {
|
this.$router.push(item.path);
|
return false;
|
}
|
|
switch (item.label) {
|
case '信用卡分期':
|
this.Click_XYK();
|
break;
|
case '花呗分期':
|
this.Click_HBFQ();
|
break;
|
}
|
},
|
|
|
//信用卡分期点击
|
Click_XYK() {
|
console.log('信用卡分期点击');
|
},
|
|
//花呗分期
|
Click_HBFQ() {
|
console.log('花呗分期');
|
},
|
|
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
.product-box {
|
padding-bottom: 100px;
|
|
//产品标题
|
.product-title {
|
.lh(44px);
|
background: @c-black;
|
font-size: @font-16;
|
color: @c-fff;
|
font-weight: bold;
|
text-align: center;
|
}
|
|
|
.alipay{
|
width: 360px;
|
margin: 0 auto;
|
.flex(center,center,warp,column);
|
margin-top: 20px;
|
min-height: 130px;
|
background-color: @c-fff;
|
.van-icon{
|
font-size: 55px;
|
margin-bottom: 15px;
|
color: @c-default;
|
}
|
p{
|
font-size: @font-12;
|
color: @c-default;
|
}
|
}
|
|
|
//产品列表
|
.grid {
|
margin: 15px auto 0 auto;
|
width: 360px;
|
background-color: @c-bg-fff;
|
.flex(flex-start, center, wrap);
|
z-index: @zIndex-20;
|
box-shadow: 0 8px 20px 0 rgba(66, 61, 93, 0.05);
|
border-radius: 3px;
|
.item {
|
width: 120px;
|
height: 122px;
|
}
|
.icon{
|
width:35px;
|
height:35px;
|
/* fill:@c-default;*/
|
}
|
.label {
|
margin-top: 15px;
|
color: @c-text-666;
|
}
|
}
|
|
|
|
.list-title{
|
width: 100%;
|
.lh(44px);
|
padding-left: 25px;
|
border-bottom: 1px solid #c7c7c7;
|
}
|
|
|
//单独修改某一单元格样式
|
.iconshoujifenqi{
|
|
}
|
|
|
|
}
|
</style>
|
