223 行
8.1 KiB
HTML
可执行文件
223 行
8.1 KiB
HTML
可执行文件
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport"
|
|
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<link rel="stylesheet" type="text/css" href="__PUBLIC__/layui/css/layui.css"/>
|
|
<title>收银机模板</title>
|
|
<style>
|
|
.label_radio {
|
|
height: 18px;
|
|
align-items: center;
|
|
font-size: 14px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
line-height: 19px;
|
|
color: #313131;
|
|
}
|
|
|
|
.label_radio > input {
|
|
width: 16px;
|
|
height: 16px;
|
|
opacity: 0;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.label_radio > span {
|
|
width: 20px;
|
|
height: 20px;
|
|
border-radius: 50%;
|
|
border: 2px solid #ccc;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
cursor: pointer;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.label_radio > input:checked + span:after {
|
|
background-color: #009688 !important;
|
|
}
|
|
|
|
.label_radio > input:checked + span {
|
|
border-color: #009688 !important;
|
|
}
|
|
|
|
.label_radio > span::after {
|
|
position: absolute;
|
|
content: "";
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
background-color: #ddd;
|
|
top: 4px;
|
|
left: 4px;
|
|
transition: .5s;
|
|
}
|
|
|
|
.model_con {
|
|
width: 45%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin: 2.5%;
|
|
}
|
|
|
|
.model_img {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.list {
|
|
display: flex;
|
|
}
|
|
|
|
.see_img {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
|
|
.save {
|
|
width: 100px;
|
|
height: 36px;
|
|
color: white;
|
|
background-color: #009688;
|
|
margin: 20px auto;
|
|
text-align: center;
|
|
line-height: 36px;
|
|
font-size: 16px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.save:hover {
|
|
background-color: #409688;
|
|
}
|
|
.layui-carousel{
|
|
margin-bottom: 20px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<input type="hidden" id="id" value="{$id}">
|
|
<div class="list">
|
|
<div class="model_con">
|
|
<div class="layui-carousel" id="test1">
|
|
<div carousel-item>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-01.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-01.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-02.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-02.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-03.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-03.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-04.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-04.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-05.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-05.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-06.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-06.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model1-07.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model1-07.png">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<label class="label_radio" for="model1">
|
|
<input id='model1' type="radio" name="status"
|
|
<if condition="$status eq 1">checked</if>
|
|
value="1">模板一(默认)
|
|
<span></span>
|
|
</label>
|
|
</div>
|
|
<div class="model_con">
|
|
<div class="layui-carousel" id="test2">
|
|
<div carousel-item>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-01.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-01.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-02.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-02.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-03.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-03.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-04.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-04.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-05.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-05.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-06.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-06.png">
|
|
</a>
|
|
<a class="see_img" target="_blank" href="__PUBLIC__/Retail/images/model/model2-07.png">
|
|
<img class="model_img" src="__PUBLIC__/Retail/images/model/model2-07.png">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<label class="label_radio" for="model2">
|
|
<input id='model2' type="radio" name="status"
|
|
<if condition="$status eq 2">checked</if>
|
|
value="2">模板二（商超版）
|
|
<span></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="save">保存</div>
|
|
</body>
|
|
<script type="text/javascript" src="__PUBLIC__/jquery/js/jquery-3.2.1.min.js"></script>
|
|
<script type="text/javascript" src="__PUBLIC__/layui/layui.js"></script>
|
|
<script>
|
|
function useImg() {
|
|
layui.use(['carousel', 'layer'], function () {
|
|
var carousel = layui.carousel;
|
|
//建造实例
|
|
var width = $('.model_con').width();
|
|
var heigth = 0.5625*width;
|
|
console.log(width)
|
|
carousel.render({
|
|
elem: '#test1',
|
|
width: '100%',
|
|
height: heigth
|
|
});
|
|
carousel.render({
|
|
elem: '#test2',
|
|
width: '100%',
|
|
height: heigth
|
|
});
|
|
})
|
|
}
|
|
useImg();
|
|
|
|
$(window).resize(function() {
|
|
useImg();
|
|
});
|
|
|
|
layui.use(['layer'], function () {
|
|
$('.save').click(function () {
|
|
if (!$("input[name='status']:checked").val()) {
|
|
layer.msg('请选择模板', {time: 1000});
|
|
return;
|
|
}
|
|
var tips = "<php>if(I('get.type')==1){</php>确认统一设置所有收银员模板吗？<php>}else{</php>确认为该收银员设置模板吗<php>}</php>";
|
|
layer.confirm(tips, function () {
|
|
$.post("{:U('setModel')}", {
|
|
type: "{$type}",
|
|
id: $('#id').val(),
|
|
status: $("input[name='status']:checked").val()
|
|
}, function (res) {
|
|
layer.msg(res.msg, {time: 1000});
|
|
})
|
|
})
|
|
})
|
|
})
|
|
|
|
</script>
|
|
</html> |