275 lines
8.5 KiB
HTML
275 lines
8.5 KiB
HTML
{extend name="app/shop/view/base.html"/}
|
||
{block name="resources"}
|
||
<style type="text/css">
|
||
.access {
|
||
padding: 10px;
|
||
}
|
||
|
||
.access-title {
|
||
font-size: 18px;
|
||
font-family: Microsoft YaHei;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
}
|
||
|
||
.access-item {
|
||
background-color: #F8F8F8;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.item {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin: 20px 0 20px 10px;
|
||
}
|
||
|
||
.item-datail {
|
||
position: relative;
|
||
}
|
||
|
||
.item-number {
|
||
width: 30px;
|
||
height: 30px;
|
||
border-radius: 50%;
|
||
border: 5px solid #eee;
|
||
position: absolute;
|
||
top: -5px;
|
||
left: -45px;
|
||
box-sizing: border-box;
|
||
font-size: 10px;
|
||
line-height: 20px;
|
||
}
|
||
|
||
.item-number label {
|
||
width: 20px;
|
||
height: 20px;
|
||
background: #ddd;
|
||
border-radius: 50%;
|
||
text-align: center;
|
||
color: #FFFFFF !important;
|
||
display: inline-block;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.item-number.active {
|
||
border: 5px solid rgba(255, 106, 0, 0.5);
|
||
}
|
||
|
||
.item-number.active label {
|
||
background: #FF6A00;
|
||
}
|
||
|
||
.item-check {
|
||
position: absolute;
|
||
top: 5px;
|
||
left: 20px;
|
||
width: 25px;
|
||
height: 25px;
|
||
background: #CCCCCC;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.item-check i {
|
||
border-radius: 50%;
|
||
border: none;
|
||
font-size: 14px;
|
||
color: #fff
|
||
}
|
||
.item-checked {
|
||
background: rgba(255, 106, 0, 0.5);
|
||
border-radius: 50%;
|
||
}
|
||
.item-checked i {
|
||
color: #ff6a00
|
||
}
|
||
.item-datail div {
|
||
font-size: 14px;
|
||
font-family: Microsoft YaHei;
|
||
font-weight: 400;
|
||
color: #333333;
|
||
margin-bottom: 10px;
|
||
}
|
||
.item-datail p {
|
||
display: inline-block;
|
||
font-size: 12px;
|
||
font-family: Microsoft YaHei;
|
||
font-weight: 400;
|
||
color: #999999;
|
||
}
|
||
.item-datail a {
|
||
font-size: 12px;
|
||
font-family: Microsoft YaHei;
|
||
font-weight: 400;
|
||
color: #FF6A00 !important;
|
||
}
|
||
.item button {
|
||
width: 88px;
|
||
height: 34px;
|
||
background: #FF6A00;
|
||
border-radius: 2px;
|
||
border: 1px solid #FFFFFF;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
cursor: pointer;
|
||
}
|
||
.item span, .item a, .item button {
|
||
margin-right: 40px;
|
||
margin-top: 10px;
|
||
}
|
||
.layui-timeline-item:before {
|
||
top: 27px;
|
||
}
|
||
.order-pay-layer .wrap {
|
||
display: flex;
|
||
}
|
||
.order-pay-layer .wrap .flex {
|
||
flex: 1
|
||
}
|
||
.order-pay-layer .wrap .flex:last-child {
|
||
border-left: 1px solid #eee
|
||
}
|
||
.order-pay-layer .qrcode img {
|
||
width: 150px;
|
||
margin: auto;
|
||
display: block;
|
||
}
|
||
.order-pay-layer .goods-name {
|
||
margin-right: 15px;
|
||
font-weight: bold;
|
||
}
|
||
.order-pay-layer .price {
|
||
margin-right: 15px;
|
||
margin-top: 15px;
|
||
font-weight: bold;
|
||
}
|
||
.order-pay-layer .tips {
|
||
margin-bottom: 15px;
|
||
}
|
||
a:hover {
|
||
text-decoration: none !important;
|
||
cursor: pointer
|
||
}
|
||
</style>
|
||
{/block}
|
||
{block name="main"}
|
||
<div class="access">
|
||
<div class="access-title">1688精选代发</div>
|
||
<ul class="layui-timeline">
|
||
<li class="layui-timeline-item">
|
||
<div class="layui-timeline-content layui-text">
|
||
<div class="item">
|
||
<div class="item-datail">
|
||
<div class="item-number active">
|
||
<label>1</label>
|
||
</div>
|
||
<div>创建1688账号</div>
|
||
<p>在1688中创建视频号，如已有1688可越过该步骤。</p>
|
||
</div>
|
||
<a href="https://www.yuque.com/yuqueyonghuwahz8b/ogiw29/ioyzisgv1kccwnkh?singleDoc# 《1688代发指南》" target="_blank" class="layui-btn">接入指南</a>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="layui-timeline-item">
|
||
<div class="layui-timeline-content layui-text">
|
||
<div class="item">
|
||
<div class="item-datail">
|
||
<div class="item-number {if $checkres['code'] == 0 && $checkres['data']['status'] == 2}active{/if}">
|
||
<label>2</label>
|
||
</div>
|
||
<div>1688代发精选</div>
|
||
<p>去订购'精选代发'开通之后<a href="{$authorization_url}" target="_blank">去订购</a></p>
|
||
</div>
|
||
</div>
|
||
<div class="access-item">
|
||
<div class="item">
|
||
<div class="item-datail">
|
||
<div class="item-check {if $checkres['code'] == 0 && $checkres['data']['status'] == 2 }item-checked{/if}">
|
||
<i class="iconfont iconduihao"></i>
|
||
</div>
|
||
<div style="margin-left: 60px;">
|
||
<label>完成支付宝代扣</label>
|
||
<br>
|
||
<p>请完成1688支付宝自动代扣协议<a
|
||
href="{:addon_url('shopcomponent://shop/goods/lists')}">前去添加</a></p>
|
||
</div>
|
||
</div>
|
||
<span>已完成</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="layui-timeline-item">
|
||
<div class="layui-timeline-content layui-text">
|
||
<div class="item">
|
||
<div class="item-datail">
|
||
<div class="item-number {if $checkres['code'] == 0 && $checkres['data']['status'] == 2 }active{/if}">
|
||
<label>3</label>
|
||
</div>
|
||
<div>完成了去选品</div>
|
||
<p>开通成功之后 选品库中的商品 商家到产品库<a href="{:addon_url('ali1688/shop/goods/lists')}" target="_blank">前去添加</a>。
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="layui-timeline-item">
|
||
<div class="layui-timeline-content layui-text">
|
||
<div class="item">
|
||
<div class="item-datail">
|
||
<div class="item-number {if $checkres['code'] == 0 && $checkres['data']['status'] == 2 }active{/if}">
|
||
<label>4</label>
|
||
</div>
|
||
<div>开启自动下单</div>
|
||
<div class="layui-form">
|
||
<div class="layui-form-item">
|
||
<label class="layui-form-label">开启自动下单</label>
|
||
<div class="layui-input-block">
|
||
<input type="checkbox" name="isAutoBuyOrder" lay-skin="switch" value="1"
|
||
lay-filter="switchTest" lay-text="ON|OFF" {if $info.isAutoBuyOrder??''} checked {/if} >
|
||
</div>
|
||
<div class="word-aux">
|
||
<p>客户下单后系统将完成自动化下单到1688精选</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="layui-form">
|
||
</div>
|
||
{/block}
|
||
{block name="script"}
|
||
<script type="text/javascript">
|
||
var laytpl, repeatTag = false;
|
||
layui.use(['form', 'laydate'], function () {
|
||
laytpl = layui.laytpl;
|
||
var form = layui.form, laydate = layui.laydate, repeat_flag = false; //防重复标识
|
||
form.render();
|
||
});
|
||
function apply() {
|
||
$.ajax({
|
||
url: ns.url("shopcomponent://shop/goods/access"),
|
||
dataType: 'JSON',
|
||
type: 'POST',
|
||
success: function (res) {
|
||
if (res.code == 0) {
|
||
layer.msg('开通成功');
|
||
setTimeout(function () {
|
||
location.reload();
|
||
}, 1000)
|
||
} else {
|
||
layer.msg(res.message);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
{/block} |