396 lines
21 KiB
PHP
396 lines
21 KiB
PHP
@extends('layouts.base')
|
|
|
|
@section('content')
|
|
<style>
|
|
.content{
|
|
background: #eff3f6;
|
|
padding: 10px!important;
|
|
}
|
|
.con{
|
|
padding-bottom:20px;
|
|
position:relative;
|
|
min-height:100vh;
|
|
border-radius: 8px;
|
|
background-color:#fff;
|
|
}
|
|
.con .setting .block{
|
|
background-color:#fff;
|
|
border-radius: 8px;
|
|
padding:10px;
|
|
}
|
|
.con .setting .block .title{
|
|
display:flex;
|
|
align-items:center;
|
|
}
|
|
.confirm-btn{
|
|
width: 100%;
|
|
position:absolute;
|
|
bottom:0;
|
|
left:0;
|
|
line-height:63px;
|
|
background-color: #ffffff;
|
|
box-shadow: 0px 8px 23px 1px
|
|
rgba(51, 51, 51, 0.3);
|
|
background-color:#fff;
|
|
text-align:center;
|
|
}
|
|
.el-form-item__label{
|
|
margin-right:30px;
|
|
}
|
|
.qrcode_list{
|
|
width:100%;
|
|
display:flex;
|
|
flex-wrap:wrap;
|
|
}
|
|
.qrcode_list .qr_code{
|
|
width: 163px;
|
|
margin-right:2%;
|
|
border:solid 1px #ccc;
|
|
border-radius: 17px;
|
|
height: 174px;
|
|
display:flex;
|
|
flex-direction:column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom:20px;
|
|
position:relative;
|
|
}
|
|
.qrcode_list .qr_code .mask{
|
|
position:absolute;
|
|
top:0;
|
|
left:0;
|
|
right:0;
|
|
bottom:0;
|
|
background-color:rgba(0,0,0,0.5);
|
|
display:none;
|
|
border-radius: 17px;
|
|
}
|
|
.qrcode_list .qr_code:hover .mask{
|
|
display:block;
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:center;
|
|
}
|
|
.qrcode_list .qr_code:hover .mask h5{
|
|
width: 105px;
|
|
height: 31px;
|
|
background-color: #ffffff;
|
|
border-radius: 16px;
|
|
margin:0 auto;
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:center;
|
|
}
|
|
.qrcode_list .qr_code:hover .mask h5 a{
|
|
color: #29ba9c;
|
|
font-size:12px;
|
|
}
|
|
.qrcode_list .qr_code img{
|
|
width: 108px;
|
|
height: 108px;
|
|
}
|
|
b{
|
|
font-size:14px;
|
|
}
|
|
.el-tabs{
|
|
padding-right:10px;
|
|
}
|
|
</style>
|
|
<div id="qrcode" ref="qrcode" style="display:none;"></div>
|
|
<div id='re_content' >
|
|
<div class="con" >
|
|
<div class="setting">
|
|
<div class="block">
|
|
<div class="title"><span style="width: 4px;height: 18px;background-color: #29ba9c;margin-right:15px;display:inline-block;"></span><b>系统>商城入口</b></div>
|
|
</div>
|
|
<template>
|
|
<el-tabs v-model="activeName" style="padding-left:10px;" >
|
|
<el-tab-pane label="商城页面链接" name="first">
|
|
<ul class="qrcode_list" >
|
|
<li class="qr_code" >
|
|
<img id='home' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">商城首页</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('home') !!}" data-url="{!! yzAppFullUrl('home') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code" >
|
|
<img id='category' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">分类导航</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('category') !!}" data-url="{!! yzAppFullUrl('category') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code" >
|
|
<img id='searchAll' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">全部商品</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('searchAll') !!}" data-url="{!! yzAppFullUrl('searchAll') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="会员中心链接" name="second">
|
|
<ul class="qrcode_list" >
|
|
<li class="qr_code" >
|
|
<img id='member' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">会员中心</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member') !!}" data-url="{!! yzAppFullUrl('member') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code" >
|
|
<img id='orderList' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">我的订单</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/orderList/0') !!}" data-url="{!! yzAppFullUrl('member/orderList/0') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code" >
|
|
<img id='cart' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">购物车</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('cart') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='collection'>
|
|
<h5 style="margin:0;font-sieze:14px;">我的收藏</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/collection') !!}" data-url="{!! yzAppFullUrl('member/collection') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='footprint' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">我的足迹</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/footprint') !!}" data-url="{!! yzAppFullUrl('member/footprint') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='myEvaluation' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">评价</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/myEvaluation') !!}" data-url="{!! yzAppFullUrl('member/myEvaluation') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='myrelationship' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">关系</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/myrelationship') !!}" data-url="{!! yzAppFullUrl('member/myrelationship') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='address' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">收货地址</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/address') !!}" data-url="{!! yzAppFullUrl('member/address') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='coupon_index' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">我的优惠券</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('coupon/coupon_index') !!}" data-url="{!! yzAppFullUrl('coupon/coupon_index') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='coupon_store' style="margin-bottom:10px;" >
|
|
<h5 style="margin:0;font-sieze:14px;">领券中心</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('coupon/coupon_store') !!}" data-url="{!! yzAppFullUrl('coupon/coupon_store') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='integral_v2' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">积分页面</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/integral_v2') !!}" data-url="{!! yzAppFullUrl('member/integral_v2') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='integrallist' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">积分明细</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/integrallist') !!}" data-url="{!! yzAppFullUrl('member/integrallist') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='balance' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">余额页面</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/balance') !!}" data-url="{!! yzAppFullUrl('member/balance') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='detailed' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">余额明细</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/detailed') !!}" data-url="{!! yzAppFullUrl('member/detailed') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="推广中心链接" name="third">
|
|
<ul class="qrcode_list" >
|
|
<li class="qr_code">
|
|
<img id='extension' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">推广中心</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/extension') !!}" data-url="{!! yzAppFullUrl('member/extension') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='incomedetails' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">收入明细</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/incomedetails') !!}" data-url="{!! yzAppFullUrl('member/incomedetails') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='income' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">收入提现</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/withdrawal') !!}" data-url="{!! yzAppFullUrl('member/income') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
<li class="qr_code">
|
|
<img id='presentationRecord' style="margin-bottom:10px;">
|
|
<h5 style="margin:0;font-sieze:14px;">提现明细</h5>
|
|
<div class="mask" >
|
|
<h5><a href="javascript:;" data-clipboard-text="{!! yzAppFullUrl('member/presentationRecord',['extension'=>'extension']) !!}" data-url="{!! yzAppFullUrl('member/presentationRecord') !!}" class="js-clip" title="复制链接">复制链接</a></h5>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script src="{{resource_get('static/js/qrcode.min.js')}}"></script>
|
|
<script>
|
|
var vm = new Vue({
|
|
el: "#re_content",
|
|
delimiters: ['[[', ']]'],
|
|
data() {
|
|
return {
|
|
activeName: 'first',
|
|
qr_list:[
|
|
{
|
|
url:"{!! yzAppFullUrl('home') !!}",
|
|
name:'home',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('category') !!}",
|
|
name:'category',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('searchAll') !!}",
|
|
name:'searchAll',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member') !!}",
|
|
name:'member',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/orderList/0') !!}",
|
|
name:'orderList',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('cart') !!}",
|
|
name:'cart',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/collection') !!}",
|
|
name:'collection',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/footprint') !!}",
|
|
name:'footprint',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/myEvaluation') !!}",
|
|
name:'myEvaluation',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/myrelationship') !!}",
|
|
name:'myrelationship',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/address') !!}",
|
|
name:'address',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('coupon/coupon_index') !!}",
|
|
name:'coupon_index',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('coupon/coupon_store') !!}",
|
|
name:'coupon_store',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/integral_v2') !!}",
|
|
name:'integral_v2',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/integrallist') !!}",
|
|
name:'integrallist',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/balance') !!}",
|
|
name:'balance',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/detailed') !!}",
|
|
name:'detailed',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/extension') !!}",
|
|
name:'extension',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/incomedetails') !!}",
|
|
name:'incomedetails',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/income') !!}",
|
|
name:'income',
|
|
},
|
|
{
|
|
url:"{!! yzAppFullUrl('member/presentationRecord') !!}",
|
|
name:'presentationRecord',
|
|
},
|
|
],
|
|
}
|
|
},
|
|
mounted () {
|
|
this.qr_list.forEach((item,index,key)=>{
|
|
this.qrcodeScan(item.url,item.name)
|
|
})
|
|
},
|
|
methods: {
|
|
qrcodeScan(url,name) {//生成二维码
|
|
let qrcode = new QRCode('qrcode', {
|
|
width: 200, // 二维码宽度
|
|
height: 200, // 二维码高度
|
|
render: 'image',
|
|
text: url
|
|
});
|
|
|
|
var data = $("canvas")[$("canvas").length - 1].toDataURL().replace("image/png", "image/octet-stream;");
|
|
$('#'+name+'').attr('src',data);
|
|
console.log($('#'+name+''))
|
|
|
|
}
|
|
},
|
|
});
|
|
</script>
|
|
@endsection
|
|
|
|
|
|
|
|
|
|
|