1896 lines
59 KiB
HTML
1896 lines
59 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="renderer" content="webkit">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||
<title>智订宝-e订通</title>
|
||
<link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
|
||
<link rel="stylesheet" href="layuiadmin/layui/css/layui.css">
|
||
<link rel="stylesheet" href="index.css">
|
||
<style>
|
||
@media screen {
|
||
/* 历史畅销款 lscxk */
|
||
#lscxk .detail .single>div { width: 80%; }
|
||
}
|
||
@media screen and (max-width: 600px) {
|
||
/* 通用 */
|
||
.layui-nav .layui-nav-item a { padding: 0 8px;}
|
||
/* 历史畅销款 lscxk */
|
||
#lscxk .detail .single>div { width: 90%; }
|
||
}
|
||
.page-box { display: flex; transform: translateX(0); }
|
||
.page { width: 100%; flex-shrink: 0; }
|
||
.header { padding: 16px; height: 38px; display: block; }
|
||
.menus>a { font-size: 18px; margin: 8px; display: inline-block; cursor: pointer; }
|
||
.menus>a.show-this { cursor: auto; color: #00A1F8; position: relative; }
|
||
.menus>a.show-this:after { content: "\e625"; position: absolute; top: 18px; left: 0; right: 0; }
|
||
.hidden-items { display: none; }
|
||
|
||
/* 历史畅销款 */
|
||
#lscxk { overflow-x: hidden; }
|
||
#lscxk .detail { width: 100%; display: flex; transform: translateX(-100%); }
|
||
#lscxk .detail .single { width: 100%; flex-shrink: 0; }
|
||
#lscxk .detail .single .floor-1 { margin: 16px auto; }
|
||
#lscxk .detail .single .floor-1>div>div { width: 120px; margin: 4px auto; }
|
||
#lscxk .detail .single .floor-1>div>div input { text-align: center; padding-left: 0; border-radius: 8px; }
|
||
#lscxk .detail .single .floor-2>div { display: inline-block; vertical-align: middle; }
|
||
#lscxk .detail .single .floor-2>div img { max-width: 120px; max-height: 120px; }
|
||
#lscxk .detail .single .floor-2>div>div>span.month { display: inline-block; vertical-align: middle; width: 40px; text-align: right; height: 20px; }
|
||
#lscxk .detail .single .floor-2>div>div>span.rect { display: inline-block; vertical-align: middle; text-align: left; background-color: red; height: 20px; }
|
||
#lscxk .detail .single .floor-2>div>div { margin: 8px auto; }
|
||
#lscxk .detail .single .floor-2>div>div>span.rect { margin: auto 4px; }
|
||
#lscxk .detail .single .floor-2>div>div>span.text { display: inline-block; vertical-align: middle; }
|
||
#lscxk .detail .single .floor-3 { margin: 16px auto; }
|
||
#lscxk .detail .single .floor-3>div>div { width: 120px; }
|
||
#lscxk .detail .single .floor-3>div>div input { text-align: center; padding-left: 0; border-radius: 8px; }
|
||
/* end 历史畅销款 */
|
||
|
||
/* 店铺性格 */
|
||
#dpxg .menus { overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100%; white-space: nowrap; }
|
||
#dpxg .detail .select-cate { width: 90%; margin: 16px auto; display: none; }
|
||
#dpxg .detail .select-cate .layui-form-select { width: 150px; margin-left: 0; }
|
||
#dpxg .detail .echart { width: 90%; height: 400px; margin: 16px auto; }
|
||
#dpxg .detail .table { width: 90%; }
|
||
#dpxg .detail .table .layui-table-cell { text-align: center; }
|
||
/* end 店铺性格 */
|
||
|
||
/* 理想订货方案 */
|
||
#lxdhfa .header { display: none; }
|
||
#lxdhfa .detail .dhl { width: 100%; display: flex; }
|
||
#lxdhfa .detail .dhl .single { width: 100%; flex-shrink: 0; }
|
||
#lxdhfa .detail .dhl .single .cl { margin: 16px; }
|
||
#lxdhfa .detail .dhl .single .cl .img img { max-width: 400px; max-height: 300px; }
|
||
#lxdhfa .detail .dhl .single .cl .remark>span { display: block; margin: 16px; }
|
||
#lxdhfa .detail .dhl .single .dks { overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; padding: 0 16px; }
|
||
#lxdhfa .detail .dhl .single .dks>div { display: inline-block; margin: 16px; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-1 { position: relative; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-1 .img>a { display: block; cursor: pointer; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-1 .ydjs { position: absolute; top: 0; left: 0; color: red; border: 1px solid red; padding: 2px; text-align: center; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-2 { margin: 8px 0; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-3>div { margin: 4px 0; display: block; height: 26px; }
|
||
#lxdhfa .detail .dhl .single .dks .floor-3 .text { color: red; border: 1px solid red; padding: 2px 4px; margin-left: 8px; }
|
||
/* end 理想订货方案 */
|
||
|
||
/* 动画 */
|
||
@keyframes move-to-left
|
||
{
|
||
0% { transform: translateX(-100%); }
|
||
100% { transform: translateX(0%); }
|
||
}
|
||
@-webkit-keyframes move-to-left /* Safari 与 Chrome */
|
||
{
|
||
0% { transform: translateX(-100%);}
|
||
100% { transform: translateX(0%); }
|
||
}
|
||
@keyframes with-lscxk-move-to-right
|
||
{
|
||
0% { transform: translateX(-100%); }
|
||
100% { transform: translateX(-200%); }
|
||
}
|
||
@-webkit-keyframes with-lscxk-move-to-right /* Safari 与 Chrome */
|
||
{
|
||
0% { transform: translateX(-100%); }
|
||
100% { transform: translateX(-200%); }
|
||
}
|
||
@keyframes with-lxdhfa-move-to-right
|
||
{
|
||
0% { transform: translateX(0%); }
|
||
100% { transform: translateX(-100%); }
|
||
}
|
||
@-webkit-keyframes with-lxdhfa-move-to-right /* Safari 与 Chrome */
|
||
{
|
||
0% { transform: translateX(0%); }
|
||
100% { transform: translateX(-100%); }
|
||
}
|
||
.animation-move-to-left {
|
||
animation: move-to-left 1s;
|
||
-webkit-animation: move-to-left 1s;
|
||
}
|
||
.animation-with-lscxk-move-to-right {
|
||
animation: with-lscxk-move-to-right 1s;
|
||
-webkit-animation: with-lscxk-move-to-right 1s;
|
||
}
|
||
.animation-with-lxdhfa-move-to-right {
|
||
animation: with-lxdhfa-move-to-right 1s;
|
||
-webkit-animation: with-lxdhfa-move-to-right 1s;
|
||
}
|
||
/* end 滑动动画 */
|
||
</style>
|
||
<script src="layuiadmin/layui/layui.js"></script>
|
||
<script src="js/function.js"></script>
|
||
<!-- echart -->
|
||
<script src="js/echarts.common.min.js"></script>
|
||
<!-- universal -->
|
||
<script src="js/universal/universal.js"></script>
|
||
<link rel="stylesheet" href="js/universal/universal.css">
|
||
<!-- viewer js -->
|
||
<script src="js/viewer/viewer.min.js"></script>
|
||
<link rel="stylesheet" href="js/viewer/viewer.min.css">
|
||
</head>
|
||
|
||
<body style="overflow-x: hidden;">
|
||
<!-- 导航 -->
|
||
<!-- <ul class="layui-nav" lay-filter="nav">
|
||
<li class="layui-nav-item layui-this"><a href="javascript: changeNav(0)">我的店铺</a></li>
|
||
<li class="layui-nav-item"><a href="javascript: changeNav(1)">历史畅销款</a></li>
|
||
<li class="layui-nav-item"><a href="javascript: changeNav(2)">店铺性格</a></li>
|
||
<li class="layui-nav-item"><a href="javascript: changeNav(3)">理想订货方案</a></li>
|
||
</ul> -->
|
||
|
||
<div style="overflow-x: hidden;"><div class="page-box">
|
||
<!-- 我的店铺 -->
|
||
<div id="wddp" class="page">
|
||
<div style="margin-top: 48px; font-size: 24px;">
|
||
<div id="wddp-title" style="display: inline-block; vertical-align: middle; width: 50%;">
|
||
<div style="width: 142px; text-align: left; font-size: 18px; margin-bottom: 8px; padding-left: 4px;">店铺地址：</div>
|
||
<div class="content" style="border: 1px solid #e5e5e5; border-radius: 8px; padding: 8px 16px; width: 108px; text-align: left; min-height: 18px;"></div>
|
||
</div><div id="wddp-dplx" style="display: inline-block; vertical-align: middle; width: 50%;">
|
||
<div style="width: 142px; text-align: left; font-size: 18px; margin-bottom: 8px; padding-left: 4px;">店铺等级：</div>
|
||
<div class="content" style="border: 1px solid #e5e5e5; border-radius: 8px; padding: 8px 16px; width: 108px; text-align: left; min-height: 18px;"></div>
|
||
</div>
|
||
<!-- <span style="margin-right: 16px;" id="wddp_title"></span>
|
||
<span style="margin-left: 16px;" id="wddp_dplx"></span> -->
|
||
</div>
|
||
<div id="qymap" style="display: inline-block; position: relative;">
|
||
<div class="map"></div>
|
||
<div class="hzys">
|
||
<div class="title">合作月数</div>
|
||
<div class="content"></div>
|
||
</div>
|
||
</div>
|
||
<div style="margin-bottom: 48px;">
|
||
<a href="javascript: openPage('lscxk')" style="margin-right: 24px; display: inline-block; cursor: pointer;">
|
||
<img src="./images/fore_cast@150.png">
|
||
</a><a href="javascript: openPage('lxdhfa')" style="margin-left: 24px; display: inline-block; cursor: pointer;">
|
||
<img src="./images/plan@150.png">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 历史畅销款 -->
|
||
<div id="lscxk" class="page">
|
||
<div class="header layui-form">
|
||
<div style="float: left; height: 38px; line-height: 38px;"><a href="javascript: toPageDetailWithLscxk('prev')" class="btn-prev" style="cursor: pointer;">◀︎ 上一款</a></div>
|
||
<div style="display: inline-block; vertical-align: middle; width: 110px; margin-right: 8px;">
|
||
<select id="select-xse" lay-filter="lscxk-xse"><option value="">销售额排行</option></select>
|
||
</div>
|
||
<div style=" display: inline-block; vertical-align: middle; width: 110px; margin-left: 8px;">
|
||
<select id="select-pl" lay-filter="lscxk-pl"><option value="">所有品类</option></select>
|
||
</div>
|
||
<div style="float: right; height: 38px; line-height: 38px;"><a href="javascript: toPageDetailWithLscxk('next')" class="btn-next" style="cursor: pointer;">下一款 ▶︎</a></div>
|
||
</div>
|
||
<div class="detail">
|
||
<div class="single prev"></div>
|
||
<div class="single current"></div>
|
||
<div class="single next"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 店铺性格 -->
|
||
<div id="dpxg" class="page">
|
||
<div class="menus">
|
||
</div>
|
||
<div class="detail">
|
||
<div class="select-cate layui-form" lay-filter="dpxg-cate-box">
|
||
<select lay-filter="dpxg-cate">
|
||
</select>
|
||
</div>
|
||
<div class="echart"></div>
|
||
<div class="table"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 理想订货方案 -->
|
||
<div id="lxdhfa" class="page">
|
||
<!-- <div class="menus">
|
||
<a href="javascript: showLxdhfaDetail('zb')" class="zb layui-icon show-this">总表</a>
|
||
<a href="javascript: showLxdhfaDetail('dhl')" class="dhl layui-icon">订货量</a>
|
||
</div> -->
|
||
<div class="header">
|
||
<div style="float: left; height: 38px; line-height: 38px;"><a href="javascript: showDhl('prev')" class="btn-prev" style="cursor: pointer;">◀︎ 上一杆</a></div>
|
||
<div style="float: right; height: 38px; line-height: 38px;"><a href="javascript: showDhl('next')" class="btn-next" style="cursor: pointer;">下一杆 ▶︎</a></div>
|
||
</div>
|
||
<div class="detail">
|
||
<div class="zb"></div>
|
||
<div class="dhl"></div>
|
||
</div>
|
||
</div>
|
||
</div></div>
|
||
<div class="hidden-items">
|
||
<input id="uid" value="">
|
||
<input id="face" value="">
|
||
</div>
|
||
<script>
|
||
|
||
{ // 历史畅销款相关变量
|
||
var original_lscxk_detail_offset_left
|
||
,touchmoving = false
|
||
}
|
||
{ // 店铺性格相关变量
|
||
var dpxg_chart
|
||
}
|
||
{ // 水印相关
|
||
watermark_data = {
|
||
is_sy: "y"
|
||
,username: "t5"
|
||
}
|
||
}
|
||
var dpxg_menus = [
|
||
{no: 1, title: "月销额同比", tbcate: "line"},
|
||
{no: 2, title: "品类ABC", tbcate: "markArea"}
|
||
]
|
||
layui.config({
|
||
base: './layuiadmin/'
|
||
}).extend({
|
||
index: 'lib/index'
|
||
}).use(['index', 'user','element'], function(){
|
||
const $ = layui.$
|
||
,admin = layui.admin
|
||
,form = layui.form
|
||
,element = layui.element
|
||
|
||
$.ajax({
|
||
url:"./?_m=zdb&_a=init",
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var json_data=$.parseJSON(res);
|
||
|
||
//alert(json_data.ver);
|
||
if(json_data.code==0){
|
||
//------------------本页返回的错误信息
|
||
layer.msg(json_data.msg);
|
||
}else if(json_data.code==1){
|
||
//------------------系统错误
|
||
var msg=json_data.msg;
|
||
var url1="error.htm?msg="+json_data.msg+"&btn_title="+json_data.btn_title+"&btn_url="+json_data.btn_url;
|
||
var obj1=window.parent.parent?window.parent.parent:window.parent;
|
||
obj1.location.href=url1;
|
||
}else if(json_data.code==2){
|
||
//------------------重新登录
|
||
url1="login.htm?error_msg="+json_data.msg;
|
||
var obj1=window.parent.parent?window.parent.parent:window.parent;
|
||
obj1.location.href=url1;
|
||
}else{
|
||
//------------------填充内容
|
||
console.log(["初始", json_data])
|
||
|
||
// 强制body保持一定宽度，临时使用
|
||
$("body").width($("#LAY_app_body", top.document).width())
|
||
// 填充：历史畅销款-选择框-销售额
|
||
|
||
// 填充：历史畅销款-选择框-所有品类
|
||
// 填充：历史畅销款-详情
|
||
// --------选项
|
||
for (var i = 0; i < json_data.lscxk.cxe_options.length; i++) {
|
||
$("#select-xse").append('<option value="'+json_data.lscxk.cxe_options[i].no+'">'+json_data.lscxk.cxe_options[i].title+'</option>')
|
||
}
|
||
for (var i = 0; i < json_data.lscxk.pl_options.length; i++) {
|
||
$("#select-pl").append('<option value="'+json_data.lscxk.pl_options[i].no+'">'+json_data.lscxk.pl_options[i].title+'</option>')
|
||
}
|
||
form.render('select')
|
||
|
||
$('#wddp-title .content').html(json_data.zdb_zd1)
|
||
const len = parseInt(json_data.zdb_zd2 ? json_data.zdb_zd2 : '0')
|
||
for (var i = 0; i < len; i++) {
|
||
$("#wddp-dplx .content").append('<i class="layui-icon" style="color: red;"></i> ')
|
||
}
|
||
// $("#wddp_title").html(json_data.client_title);
|
||
// $("#wddp_dplx").html(json_data.client_dplx);
|
||
$("#wddp #qymap .map").html('<img src="'+json_data.client_map+'" data-original="'+json_data.client_map+'" onerror="noImg(this)" style="max-width: 100%;" watermark>')
|
||
$("#wddp #qymap .hzys .content").html(json_data.zdb_zd3)
|
||
|
||
var img = new Image();
|
||
img.src = json_data.client_map;
|
||
img.onload = function(){
|
||
|
||
const qymapWitdh = $('#qymap').width()
|
||
const qymapHeight = $('#qymap').height()
|
||
|
||
$('#qymap .hzys').css({
|
||
'position': 'absolute',
|
||
'top': '64%',
|
||
'right': '7%',
|
||
'transform': 'translate(-50%, -50%)'
|
||
})
|
||
$('#qymap .hzys .title').css({
|
||
'color': 'white',
|
||
'margin-bottom': '4px',
|
||
'font-size': Math.ceil(innerWidth / 38) + 'px',
|
||
})
|
||
$('#qymap .hzys .content').css({
|
||
'padding': '4px '+Math.ceil(innerWidth / 20)+'px',
|
||
'border-radius': '8px',
|
||
'color': 'white',
|
||
'border': '1px solid white',
|
||
'font-size': Math.ceil(innerWidth / 25) + 'px',
|
||
'font-weight': 'bold',
|
||
'text-shadow': '#1989fa 2px 2px 1px',
|
||
'min-height': '36px'
|
||
})
|
||
};
|
||
|
||
USetWatermark({
|
||
is_sy: watermark_data.is_sy
|
||
,text: watermark_data.username
|
||
})
|
||
new Viewer(document.getElementById("qymap"), {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
|
||
$.each(json_data.dpxg_menu,function(index,arr){
|
||
dpxg_menus.push({no: arr.no, title: arr.title, tbcate:arr.tbcate});
|
||
})
|
||
|
||
$("#uid").val(json_data.uid)
|
||
$("#face").val(json_data.face)
|
||
}
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
}) // end ajax
|
||
|
||
$("#LAY_app_body", top.document).resize(function() {
|
||
$("body").width($(this).width())
|
||
})
|
||
|
||
//---------- 历史畅销款
|
||
var lscxk_detail_elem = $("#lscxk .detail")[0]
|
||
lscxk_detail_elem.addEventListener("animationend",function(e){ // 点击下一款、上一款产生的动画
|
||
if ($(this).hasClass("animation-move-to-left")) {
|
||
loadNewLscxkWithPrev()
|
||
} else if ($(this).hasClass("animation-with-lscxk-move-to-right")) {
|
||
loadNewLscxkWithNext()
|
||
}
|
||
$(this).removeClass("animation-move-to-left animation-with-lscxk-move-to-right")
|
||
})
|
||
|
||
// 鼠标拖动
|
||
lscxk_detail_elem.addEventListener('mousedown', function(event) {
|
||
event.preventDefault()
|
||
// console.log("down: ", event)
|
||
this.addEventListener('mousemove', moveDetailWithLscxk, true)
|
||
}, true)
|
||
lscxk_detail_elem.addEventListener('mouseup', function(event) {
|
||
// console.log("up: ", event)
|
||
this.removeEventListener("mousemove", moveDetailWithLscxk, true)
|
||
animateWithAfterMove1()
|
||
}, true)
|
||
// end 鼠标拖动
|
||
|
||
// 手指拖动
|
||
$(document).on("touchstart", lscxk_detail_elem, function(event) { // 用于辅助 lscxk_detail_elem 启用touchstart，如果在此处直接操作touchstart，会调用两次
|
||
// event.preventDefault() // 会在iOS9上出bug
|
||
})
|
||
lscxk_detail_elem.addEventListener("touchstart", function(event) {
|
||
if (!touchmoving) {
|
||
touchmoving = true
|
||
// console.log("touchstart", event)
|
||
if (event.targetTouches.length == 1) {
|
||
original_lscxk_detail_offset_left = event.pageX
|
||
this.addEventListener('touchmove', touchMoveDetailWithLscxk, true)
|
||
}
|
||
}
|
||
})
|
||
lscxk_detail_elem.addEventListener("touchend", function(event) {
|
||
// console.log("touch end: ", event)
|
||
this.removeEventListener("touchmove", touchMoveDetailWithLscxk, true)
|
||
touchmoving = false
|
||
animateWithAfterMove1()
|
||
})
|
||
// end 手指拖动
|
||
|
||
form.on('select(lscxk-xse)', function(data) {
|
||
setTimeout(function() {
|
||
fillPageDetailWithLscxk()
|
||
}, 100)
|
||
})
|
||
form.on('select(lscxk-pl)', function(data) {
|
||
setTimeout(function() {
|
||
fillPageDetailWithLscxk()
|
||
}, 100)
|
||
})
|
||
//---------- end 历史畅销款
|
||
|
||
//---------- 店铺性格
|
||
form.on('select(dpxg-cate)', function(data) {
|
||
const menu = $("#dpxg .menus .show-this").html()
|
||
,cate = data.elem.innerText
|
||
,type = data.value
|
||
$.ajax({
|
||
url: "./?_m=zdb&_a=get_dpxg_other&title="+menu+"&title2="+cate+"&tbcate="+type
|
||
,success: function(res) {
|
||
const json_data2 = $.parseJSON(res)
|
||
console.log("Data", menu, cate, json_data2)
|
||
|
||
switch(type) {
|
||
case "bar":
|
||
showEchartForBar(json_data2.data)
|
||
break
|
||
case "pie":
|
||
showEchartForPie(json_data2.data, "%")
|
||
break
|
||
case "3":
|
||
showEchartWithCxe(json_data2.data)
|
||
break
|
||
case "4":
|
||
showEchartWithAfg(json_data2.data)
|
||
break
|
||
}
|
||
}
|
||
,beforeSend: function() {u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
})
|
||
//---------- end 店铺性格
|
||
|
||
//---------- 理想订货方案
|
||
var lxdhfa_dhl_elem = $("#lxdhfa .detail .dhl")[0]
|
||
lxdhfa_dhl_elem.addEventListener("animationend",function(e){ // 点击下一杆、上一杆产生的动画
|
||
if ($(this).hasClass("animation-move-to-left")) {
|
||
$(this).css("transform", "")
|
||
$(this).find(".single").last().remove()
|
||
} else if ($(this).hasClass("animation-with-lxdhfa-move-to-right")) {
|
||
$(this).find(".single").first().remove()
|
||
}
|
||
$(this).removeClass("animation-move-to-left animation-with-lxdhfa-move-to-right")
|
||
new Viewer($("#lxdhfa .detail .single .cl")[0], {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
})
|
||
//---------- end 理想订货方案
|
||
}) // end layui
|
||
|
||
// 通用
|
||
// 无图片
|
||
function noImg(node) {
|
||
node.setAttribute("onerror", "")
|
||
node.src = "images/no_pic.png"
|
||
if (node.getAttribute("data-original")) node.setAttribute("data-original", "images/no_pic.png")
|
||
}
|
||
// end 无图片
|
||
// 移动时序动画
|
||
function universalMoveAnimate(duration, draw, timing, beforeAnimation, complete) {
|
||
// https://zh.javascript.info/js-animation
|
||
var start = performance.now()
|
||
if (beforeAnimation) beforeAnimation()
|
||
requestAnimationFrame(function universalMoveAnimate(time) {
|
||
var timeFraction = (time - start) / duration;
|
||
if (timeFraction > 1) timeFraction = 1;
|
||
|
||
var progress = timing(timeFraction)
|
||
|
||
draw(progress);
|
||
|
||
if (timeFraction < 1) {
|
||
requestAnimationFrame(universalMoveAnimate);
|
||
} else {
|
||
complete()
|
||
}
|
||
})
|
||
}
|
||
function changeNav(index) {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
|
||
var complete = function(index) {
|
||
index = index ? index : 0
|
||
const target_translate_x = -1 * window.innerWidth * index
|
||
,current_tarnsform = $(".page-box").css("transform")
|
||
,current_translate_x = parseInt(current_tarnsform.slice(7, current_tarnsform.length - 1).split(', ')[4])
|
||
,displacement = target_translate_x - current_translate_x
|
||
|
||
universalMoveAnimate({
|
||
duration: 300,
|
||
timing: function(timeFraction) {
|
||
return timeFraction;
|
||
},
|
||
draw: function(progress) {
|
||
const translate_x = progress * displacement + current_translate_x
|
||
$(".page-box").css("transform", "translateX("+translate_x+"px)")
|
||
},
|
||
complete: function() {
|
||
// 结束时将 translateX 的数值转换成百分比，使得横竖屏切换时自适应。
|
||
const tarnsform = $(".page-box").css("transform")
|
||
,translate_x = parseInt(tarnsform.slice(7, tarnsform.length - 1).split(', ')[4])
|
||
,dp = translate_x / window.innerWidth * 100
|
||
$(".page-box").css("transform", "translateX("+dp+"%)")
|
||
}
|
||
})
|
||
}
|
||
switch(index) {
|
||
case 0: // 我的店铺
|
||
complete(index)
|
||
break
|
||
case 1: // 历史畅销款
|
||
fillPageDetailWithLscxk({
|
||
index: index,
|
||
complete: complete
|
||
})
|
||
break
|
||
case 2: // 店铺性格
|
||
if ($("#dpxg .menus>a").length < 1) setMenusWithDpxg()
|
||
showDpxgDetail(0, {
|
||
index: index,
|
||
complete: complete
|
||
})
|
||
break
|
||
case 3: // 理想订货方案
|
||
showLxdhfaDetail('dhl', {
|
||
index: index,
|
||
complete: complete
|
||
})
|
||
break
|
||
}
|
||
})
|
||
} // end changeNav
|
||
// end 通用
|
||
// 我的店铺
|
||
function openPage(page) {
|
||
|
||
layui.use(['layer', 'jquery'], function(){
|
||
const layer = parent.layer
|
||
,$ = layui.jquery
|
||
|
||
|
||
const url = "zdb_"+page+".htm"
|
||
layer.open({
|
||
type: 2,
|
||
title: '',
|
||
content: url,
|
||
offset: 'b',
|
||
closeBtn: 0,
|
||
anim: 2
|
||
,success: function(layero, index) {
|
||
layer.full(index);
|
||
}
|
||
});
|
||
});
|
||
}
|
||
// end 我的店铺
|
||
// 历史畅销款
|
||
function fillPageDetailWithLscxk(complete_params) {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const xseVal = $("#select-xse").val()
|
||
,plVal = $("#select-pl").val();
|
||
$.ajax({
|
||
url:"./?_m=zdb&_a=get_lscxk&xseVal="+xseVal+"&plVal="+plVal,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var json_data=$.parseJSON(res);
|
||
console.log("历史畅销款，初始or重置", json_data)
|
||
|
||
if (json_data.cxk_list.length < 1 || json_data.cxk_list[0].id === "-1") $("#lscxk .btn-prev").attr("href", "javascript: void(0);").addClass("layui-disabled")
|
||
else $("#lscxk .btn-prev").attr("href", "javascript: toPageDetailWithLscxk('prev');").removeClass("layui-disabled")
|
||
|
||
if (json_data.cxk_list.length < 3 || json_data.cxk_list[2].id === "-1") $("#lscxk .btn-next").attr("href", "javascript: void(0);").addClass("layui-disabled")
|
||
else $("#lscxk .btn-next").attr("href", "javascript: toPageDetailWithLscxk('next');").removeClass("layui-disabled")
|
||
|
||
initDetailWithSingleLscxk(json_data.cxk_list[0], $("#lscxk .detail .single.prev"))
|
||
initDetailWithSingleLscxk(json_data.cxk_list[1], $("#lscxk .detail .single.current"))
|
||
initDetailWithSingleLscxk(json_data.cxk_list[2], $("#lscxk .detail .single.next"))
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
})
|
||
}
|
||
function initDetailWithSingleLscxk(item_list, single_elem){
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
single_elem.attr("data-id", item_list.id).html("")
|
||
const xseVal = $("#select-xse").val()
|
||
var elem_html = ''
|
||
if (item_list.id != "-1") {
|
||
elem_html += '\
|
||
<div class="floor-1 layui-row">\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>款号</div>\
|
||
<div><input class="layui-input" value="'+item_list.kh+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>品类</div>\
|
||
<div><input class="layui-input" value="'+item_list.pl+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>吊牌价</div>\
|
||
<div><input class="layui-input" value="'+item_list.price+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>名次</div>\
|
||
<div><input class="layui-input" value="'+item_list.ph+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>销售占比</div>\
|
||
<div><input class="layui-input" value="'+item_list.xsje_zb+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>'+(xseVal === 'js' ? '销售量' : '销售额')+'</div>\
|
||
<div><input class="layui-input" value="'+item_list.xsje+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
|
||
elem_html += '\
|
||
<div class="floor-2">\
|
||
<div><img src="../attachments/zdb/ls/'+item_list.kh+'.jpg" onerror="noImg(this)" data-original="../attachments/zdb/ls/'+item_list.kh+'.jpg" watermark></div>\
|
||
<div>\
|
||
'
|
||
for (var i = 0; i < item_list.mouthlist.length; i++) {
|
||
if(item_list.mouthlist[i].val>0){
|
||
elem_html += '<div><span class="month">'+item_list.mouthlist[i].title+'</span><span class="rect" style="width: '+(100*(item_list.mouthlist[i].val/item_list.xszl))+'px; margin-right: '+(100*((item_list.xszl-item_list.mouthlist[i].val)/item_list.xszl)+4)+'px;"></span><span class="text">'+item_list.mouthlist[i].val+'</span></div>'
|
||
}
|
||
}
|
||
elem_html += '\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
|
||
elem_html += '\
|
||
<div class="floor-3 layui-row">\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>累计销售占比</div>\
|
||
<div><input class="layui-input" value="'+item_list.ljxsje_zb+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>Z分数</div>\
|
||
<div><input class="layui-input" value="'+item_list.zfs+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>打折率</div>\
|
||
<div><input class="layui-input" value="'+item_list.dzl+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
}
|
||
single_elem.html(elem_html)
|
||
USetWatermark({
|
||
el: single_elem,
|
||
is_sy: watermark_data.is_sy
|
||
,text: watermark_data.username
|
||
})
|
||
new Viewer(single_elem[0], {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
})
|
||
}
|
||
|
||
function fillDetailWithSingleLscxk(lsid, direction) {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const xseVal=$("#select-xse").val()
|
||
,plVal=$("#select-pl").val();
|
||
$.ajax({
|
||
url:"./?_m=zdb&_a=get_lscxk_id&xseVal="+xseVal+"&plVal="+plVal+"&lsid="+lsid+"&direction="+direction,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var json_data = $.parseJSON(res);
|
||
var data2 = json_data.cxk_detail[0]
|
||
,elem_html = ''
|
||
if(data2.id == "-1"){
|
||
// var elem_html='<div class="single" data-id="-1"></div>';
|
||
$("#lscxk .btn-"+direction).attr("href", "javascript: void(0);").addClass("layui-disabled")
|
||
} else {
|
||
// var elem_html = '<div class="single" data-id="'+data2.id+'">'
|
||
elem_html += '\
|
||
<div class="floor-1 layui-row">\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>款号</div>\
|
||
<div><input class="layui-input" value="'+data2.kh+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>品类</div>\
|
||
<div><input class="layui-input" value="'+data2.pl+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>吊牌价</div>\
|
||
<div><input class="layui-input" value="'+data2.price+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>名次</div>\
|
||
<div><input class="layui-input" value="'+data2.ph+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>销售占比</div>\
|
||
<div><input class="layui-input" value="'+data2.xsje_zb+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4 layui-col-sm4">\
|
||
<div>\
|
||
<div>'+(xseVal === 'js' ? '销售量' : '销售额')+'</div>\
|
||
<div><input class="layui-input" value="'+data2.xsje+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
|
||
elem_html += '\
|
||
<div class="floor-2">\
|
||
<div><img src="../attachments/zdb/ls/'+data2.kh+'.jpg" data-original="../attachments/zdb/ls/'+data2.kh+'.jpg" onerror="noImg(this)" watermark></div>\
|
||
<div>\
|
||
'
|
||
for (var i = 0; i < data2.mouthlist.length; i++) {
|
||
if(data2.mouthlist[i].val>0){
|
||
elem_html += '<div><span class="month">'+data2.mouthlist[i].title+'</span><span class="rect" style="width: '+(100*(data2.mouthlist[i].val/data2.xszl))+'px; margin-right: '+(100*((data2.xszl-data2.mouthlist[i].val)/data2.xszl)+4)+'px;"></span><span class="text">'+data2.mouthlist[i].val+'</span></div>'
|
||
}
|
||
}
|
||
elem_html += '\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
|
||
elem_html += '\
|
||
<div class="floor-3 layui-row">\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>累计销售占比</div>\
|
||
<div><input class="layui-input" value="'+data2.ljxsje_zb+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>Z分数</div>\
|
||
<div><input class="layui-input" value="'+data2.zfs+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
<div class="layui-col-xs4">\
|
||
<div>\
|
||
<div>打折率</div>\
|
||
<div><input class="layui-input" value="'+data2.dzl+'" readonly></div>\
|
||
</div>\
|
||
</div>\
|
||
</div>\
|
||
'
|
||
// elem_html += '</div>'
|
||
}
|
||
$("#lscxk .detail .single."+direction).html(elem_html).attr("data-id", data2.id)
|
||
USetWatermark({
|
||
el: $("#lscxk .detail .single."+direction+" img[watermark]"),
|
||
is_sy: watermark_data.is_sy
|
||
,text: watermark_data.username
|
||
})
|
||
}
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
|
||
})
|
||
}
|
||
// end fillDetailWithSingleLscxk
|
||
// 下一款、上一款
|
||
function toPageDetailWithLscxk(direction) {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
if (direction == "prev") {
|
||
$("#lscxk .detail").addClass("animation-move-to-left")
|
||
} else if (direction == "next") {
|
||
$("#lscxk .detail").addClass("animation-with-lscxk-move-to-right")
|
||
}
|
||
})
|
||
}
|
||
function loadNewLscxkWithPrev() {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const prev_id = $("#lscxk .detail .single.prev").attr("data-id")
|
||
,current_id = $("#lscxk .detail .single.current").attr("data-id")
|
||
// $("#lscxk .detail .single").last().remove()
|
||
$("#lscxk .detail .single.next").html($("#lscxk .detail .single.current").html()).attr("data-id", current_id)
|
||
$("#lscxk .detail .single.current").html($("#lscxk .detail .single.prev").html()).attr("data-id", prev_id)
|
||
$("#lscxk .detail").css("transform", "")
|
||
$("#lscxk .btn-next").attr("href", "javascript: toPageDetailWithLscxk('next')").removeClass("layui-disabled")
|
||
fillDetailWithSingleLscxk(prev_id, 'prev')
|
||
new Viewer($("#lscxk .detail .single.current .floor-2 img")[0], {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
})
|
||
}
|
||
function loadNewLscxkWithNext() {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const next_id = $("#lscxk .detail .single.next").attr("data-id")
|
||
,current_id = $("#lscxk .detail .single.current").attr("data-id")
|
||
// $("#lscxk .detail .single").first().remove()
|
||
$("#lscxk .detail .single.prev").html($("#lscxk .detail .single.current").html()).attr("data-id", current_id)
|
||
$("#lscxk .detail .single.current").html($("#lscxk .detail .single.next").html()).attr("data-id", next_id)
|
||
$("#lscxk .detail").css("transform", "")
|
||
$("#lscxk .btn-prev").attr("href", "javascript: toPageDetailWithLscxk('prev')").removeClass("layui-disabled")
|
||
fillDetailWithSingleLscxk(next_id, 'next')
|
||
new Viewer($("#lscxk .detail .single.current .floor-2 img")[0], {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
})
|
||
}
|
||
// 鼠标拖动：移动中
|
||
function moveDetailWithLscxk() {
|
||
event.preventDefault()
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const current_tarnsform = $("#lscxk .detail").css("transform")
|
||
,current_translate_x = parseInt(current_tarnsform.slice(7, current_tarnsform.length - 1).split(', ')[4])
|
||
,translate_x = current_translate_x + event.movementX
|
||
|
||
$("#lscxk .detail").css("transform", "translateX("+translate_x+"px)")
|
||
// console.log("move: ", event)
|
||
})
|
||
}
|
||
// 手指拖动：移动中
|
||
function touchMoveDetailWithLscxk() {
|
||
event.preventDefault()
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const current_page_x = event.pageX
|
||
,difference = current_page_x - original_lscxk_detail_offset_left
|
||
,current_tarnsform = $("#lscxk .detail").css("transform")
|
||
var translate_x = window.innerWidth*-1 + difference
|
||
$("#lscxk .detail").css("transform", "translateX("+translate_x+"px)")
|
||
// console.log("touch move: ", event)
|
||
touchmoving = true
|
||
})
|
||
}
|
||
// 拖动后归位动画
|
||
function animateWithAfterMove1() {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
const current_tarnsform = $("#lscxk .detail").css("transform")
|
||
//------ 如果上一款/下一款不存在（data-id===-1），则由动画回到当前款
|
||
,prev_data_id = $("#lscxk .detail .single:first-child").attr("data-id")
|
||
,next_data_id = $("#lscxk .detail .single:last-child").attr("data-id")
|
||
,current_translate_x = parseInt(current_tarnsform.slice(7, current_tarnsform.length - 1).split(', ')[4])
|
||
,fff = 1 / 4 // 当拖动距离超过页面宽度的fff时，进行归位动画时就会进入下一款/上一款
|
||
,displacement = (function(current_translate_x) {
|
||
// console.log(current_translate_x, -1*window.innerWidth, -1 * (1 - fff) * window.innerWidth, -1 * (1 + fff) * window.innerWidth)
|
||
if (prev_data_id != "-1" && current_translate_x > -1 * (1 - fff) * window.innerWidth) {
|
||
return current_translate_x - 0 * window.innerWidth
|
||
} else if (next_data_id != "-1" && current_translate_x < -1 * (1 + fff) * window.innerWidth) {
|
||
return current_translate_x - -2 * window.innerWidth
|
||
} else {
|
||
return current_translate_x - -1 * window.innerWidth
|
||
}
|
||
})(current_translate_x)
|
||
universalMoveAnimate({
|
||
duration: 500,
|
||
timing: function(timeFraction) {
|
||
return timeFraction;
|
||
},
|
||
draw: function(progress) {
|
||
$("#lscxk .detail").css("transform", "translateX("+(current_translate_x-displacement*progress)+"px)")
|
||
},
|
||
complete: function() {
|
||
const new_transform = $("#lscxk .detail").css("transform")
|
||
,new_translate_x = parseInt(new_transform.slice(7, new_transform.length - 1).split(', ')[4])
|
||
if (new_translate_x == 0) {
|
||
loadNewLscxkWithPrev()
|
||
} else if (new_translate_x == window.innerWidth * -2) {
|
||
loadNewLscxkWithNext()
|
||
}
|
||
}
|
||
})
|
||
})
|
||
}
|
||
// end 拖动后归位动画
|
||
// end 历史畅销款
|
||
// 店铺性格
|
||
function setMenusWithDpxg() {
|
||
layui.use("jquery", function() {
|
||
const $ = layui.jquery
|
||
|
||
var menus_html = ''
|
||
for (var i = 0; i < dpxg_menus.length; i++) {
|
||
menus_html += '<a href="javascript: showDpxgDetail('+i+');">'+dpxg_menus[i].title+'</a>'
|
||
}
|
||
$("#dpxg .menus").html(menus_html)
|
||
})
|
||
}
|
||
function showDpxgDetail(index, complete_params) {
|
||
layui.use(["jquery", "table", "form"], function() {
|
||
const $ = layui.jquery
|
||
,form = layui.form
|
||
|
||
const original_elem = $("#dpxg .menus>a.show-this")
|
||
,o_index = $("#dpxg .menus>a").index(original_elem[0])
|
||
original_elem.attr("href", "javascript: showDpxgDetail("+o_index+");").removeClass("layui-icon show-this")
|
||
$("#dpxg .menus>a").eq(index).attr("href", "javascript: void(0);").addClass("layui-icon show-this")
|
||
|
||
// 清空当前图表
|
||
$("#dpxg .detail .echart").hide()
|
||
$("#dpxg .detail .table").html("").hide()
|
||
|
||
switch(index) {
|
||
case 0: // 月销额同比，折线图
|
||
$("#dpxg .detail .select-cate").hide()
|
||
$.ajax({
|
||
url:"./?_m=zdb&_a=get_dpxg1&title="+dpxg_menus[0].title,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var json_data=$.parseJSON(res)
|
||
|
||
showEchartForLine(json_data.data)
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
break
|
||
case 1: // 品类ABC，四象限图
|
||
$("#dpxg .detail .select-cate").hide()
|
||
$.ajax({
|
||
url:"./?_m=zdb&_a=get_dpxg2&title="+dpxg_menus[1].title,
|
||
contentType: "application/json",
|
||
method: 'POST',
|
||
success: function (res) {
|
||
var json_data=$.parseJSON(res);
|
||
|
||
showEchartForMarkArea(json_data.data)
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
break
|
||
default:
|
||
const menu = dpxg_menus[index].title
|
||
$.ajax({
|
||
url: "./?_m=zdb&_a=get_dpxg_select&title="+menu
|
||
,success: function(res) {
|
||
const json_data = $.parseJSON(res)
|
||
console.log("Cate", dpxg_menus[index].title, json_data)
|
||
|
||
$("#dpxg .detail .select-cate select").html("")
|
||
for (var i = 0; i < json_data.data.length; i++) {
|
||
$("#dpxg .detail .select-cate select").append("<option value='"+json_data.data[i].tbcate+"'>"+json_data.data[i].title+"</option>")
|
||
}
|
||
form.render("select", "dpxg-cate-box")
|
||
$("#dpxg .detail .select-cate").show()
|
||
|
||
const cate = json_data.data[0].title
|
||
,type = json_data.data[0].tbcate
|
||
$.ajax({
|
||
url: "./?_m=zdb&_a=get_dpxg_other&title="+menu+"&title2="+cate+"&tbcate="+type
|
||
,success: function(res) {
|
||
const json_data2 = $.parseJSON(res)
|
||
console.log("Data", dpxg_menus[index].title, json_data2)
|
||
|
||
switch(type) {
|
||
case "line":
|
||
showEchartForLine(json_data2.data)
|
||
break
|
||
case "markArea":
|
||
showEchartForMarkArea(json_data2.data)
|
||
break
|
||
case "bar":
|
||
showEchartForBar(json_data2.data)
|
||
break
|
||
case "barmore":
|
||
showEchartForBarMore(json_data2.data)
|
||
break
|
||
case "pie":
|
||
showEchartForPie(json_data2.data, "%")
|
||
break
|
||
case "shadow":
|
||
showEchartForShadow(json_data2.data)
|
||
break
|
||
case "3":
|
||
showEchartWithCxe(json_data2.data)
|
||
break
|
||
case "4":
|
||
showEchartWithAfg(json_data2.data)
|
||
break
|
||
}
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
,complete: function() { u_stop_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,error: function () { layui.layer.msg("与服务器通信失败！") }
|
||
})
|
||
break
|
||
}
|
||
|
||
})
|
||
}
|
||
// 展示折线图
|
||
function showEchartForLine(tbdata) {
|
||
layui.use(["jquery", "table"], function() {
|
||
const $ = layui.jquery
|
||
,table = layui.table
|
||
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
$("#dpxg .detail .table").show()
|
||
|
||
var data = tbdata
|
||
,unit = "%"
|
||
|
||
// 图表: 折线图
|
||
var legend = []
|
||
,xAxis = []
|
||
,series = []
|
||
// 表格
|
||
var table_head_html = "<thead><tr><th lay-data=\"{field: 'year', textAlign: 'center'}\"></th>"
|
||
,table_body_html = "<tbody>"
|
||
for (var i = 0; i < data.length; i++) {
|
||
// 图表
|
||
var sery = {
|
||
name: data[i].title,
|
||
type: "line",
|
||
data: [],
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true,
|
||
position: 'inside',
|
||
formatter: function(param) {
|
||
return param.value+"%"
|
||
}
|
||
}
|
||
}
|
||
} // 在折点上显示数值
|
||
}
|
||
legend.push(data[i].title)
|
||
// 表格
|
||
table_body_html += "<tr><td>"+data[i].title+"</td>"
|
||
|
||
for (var j = 0; j < data[i].content.length; j++) {
|
||
const content = data[i].content[j]
|
||
if (i == 0) {
|
||
// 图表
|
||
xAxis.push(data[i].content[j].title)
|
||
// 表格
|
||
table_head_html += "<th lay-data=\"{field: 'month-"+content.title+"'}\">"+content.title+"</th>"
|
||
}
|
||
// 图表
|
||
sery.data.push(data[i].content[j].value)
|
||
// 表格
|
||
table_body_html += "<td>"+content.value+unit+"</td>"
|
||
}
|
||
// 图表
|
||
series.push(sery)
|
||
// 表格
|
||
table_body_html += "</tr>"
|
||
}
|
||
table_body_html += "</tr></thead>"
|
||
$("#dpxg .detail .table").html("<table lay-filter='dpxg-detail-table'>"+table_head_html+table_body_html+"</table>")
|
||
table.init('dpxg-detail-table', {
|
||
limit: 10 //注意：请务必确保 limit 参数（默认：10）是与你服务端限定的数据条数一致
|
||
//支持所有基础参数
|
||
})
|
||
// 绘制图表
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
// 指定图表的配置项和数据
|
||
const option = {
|
||
title: {
|
||
text: ''
|
||
},
|
||
tooltip: {
|
||
formatter: function(parm) {
|
||
return parm.seriesName+parm.name+": "+parm.data + unit
|
||
}
|
||
},
|
||
legend: {
|
||
data:legend
|
||
},
|
||
xAxis: {
|
||
data: xAxis
|
||
},
|
||
yAxis: {
|
||
max: 100
|
||
,axisLabel:{
|
||
formatter:'{value}'+unit
|
||
} // 单位
|
||
},
|
||
series: series
|
||
};
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
// end 展示折线图
|
||
// 展示四象限图
|
||
function showEchartForMarkArea(tbdata) {
|
||
layui.use(["jquery", "table"], function() {
|
||
const $ = layui.jquery
|
||
,table = layui.table
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
const unit = ["%", "%"] // 数值单位，[x轴, y轴]
|
||
var sourceData = tbdata;
|
||
|
||
var seriesData = sourceData.map(function(item, index, array) {
|
||
return {
|
||
name: item['name'],
|
||
value: [item['xAxis'], item['yAxis']]
|
||
}
|
||
})
|
||
|
||
var computeYAxisAvgLine = function() { // Y轴中间线
|
||
var min
|
||
,max
|
||
sourceData.forEach(function(item) {
|
||
if (!min) min = item['yAxis']
|
||
else min = Math.min(item['yAxis'], min)
|
||
if (!max) max = item['yAxis']
|
||
else max = Math.max(item['yAxis'], max)
|
||
})
|
||
return (min + max) / 2
|
||
}
|
||
var computeXAxisAvgLine = function() { // X轴中间线
|
||
var min
|
||
,max
|
||
sourceData.forEach(function(item) {
|
||
if (!min) min = item['xAxis']
|
||
else min = Math.min(item['xAxis'], min)
|
||
if (!max) max = item['xAxis']
|
||
else max = Math.max(item['xAxis'], max)
|
||
})
|
||
return (min + max) / 2
|
||
}
|
||
var avg = {
|
||
servicesAvgLine: computeYAxisAvgLine(),
|
||
salesAvgLine: computeXAxisAvgLine()
|
||
}
|
||
|
||
const option = {
|
||
title: false,
|
||
tooltip: {
|
||
trigger: 'item',
|
||
axisPointer: {
|
||
show: true,
|
||
type: 'cross',
|
||
lineStyle: {
|
||
type: 'dashed',
|
||
width: 1
|
||
},
|
||
},
|
||
formatter: function(obj) {
|
||
if (obj.componentType == "series") {
|
||
return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 18px;padding-bottom: 7px;margin-bottom: 7px">' + obj.name + '</div><span>X</span>: ' + obj.data.value[0] + unit[0] + '<br/>' + '<span>Y</span>: ' + obj.data.value[1] + unit[1]
|
||
}
|
||
}
|
||
},
|
||
label: {
|
||
normal: {
|
||
show: true,
|
||
position: 'bottom',
|
||
formatter: function(params) {
|
||
return params.name
|
||
}
|
||
},
|
||
emphasis: {
|
||
show: true,
|
||
position: 'bottom',
|
||
}
|
||
},
|
||
xAxis: {
|
||
// name: '营业额',
|
||
type: 'value',
|
||
scale: true,
|
||
axisLabel: {
|
||
formatter: '{value} '+unit[0]
|
||
},
|
||
splitLine: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#3259B8'
|
||
}
|
||
}
|
||
},
|
||
yAxis: {
|
||
// name: '服务能力',
|
||
type: 'value',
|
||
scale: true,
|
||
axisLabel: {
|
||
formatter: '{value} '+unit[1]
|
||
},
|
||
splitLine: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: '#3259B8'
|
||
}
|
||
}
|
||
},
|
||
toolbox: {
|
||
feature: {
|
||
dataZoom: {}
|
||
}
|
||
},
|
||
visualMap: {
|
||
min: 0,
|
||
max: 800,
|
||
dimension: 0,
|
||
left: 'right',
|
||
top: 'top',
|
||
text: ['高', '低'], // 文本，默认为数值文本
|
||
calculable: true,
|
||
itemWidth: 18,
|
||
itemHeight: 160,
|
||
textStyle: {
|
||
color: '#3259B8',
|
||
height: 56,
|
||
fontSize: 11,
|
||
lineHeight: 60,
|
||
},
|
||
inRange: {
|
||
color: ['#7AB7F7', '#b45ef7']
|
||
},
|
||
padding: [50, 20],
|
||
orient: 'horizontal',
|
||
},
|
||
series: [{
|
||
type: 'scatter',
|
||
data: seriesData,
|
||
symbolSize: 20,
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true,
|
||
position: 'top',
|
||
formatter: function(param) {
|
||
return param.name
|
||
}
|
||
}
|
||
}
|
||
}, // 在折点上显示数值
|
||
markLine: {
|
||
label: {
|
||
normal: {
|
||
formatter: function(params) {
|
||
if (params.dataIndex == 0) {
|
||
return params.value + unit[0];
|
||
} else if (params.dataIndex == 1) {
|
||
return params.value + unit[1];
|
||
}
|
||
return params.value;
|
||
}
|
||
}
|
||
},
|
||
lineStyle: {
|
||
normal: {
|
||
color: "#626c91",
|
||
type: 'solid',
|
||
width: 1,
|
||
},
|
||
emphasis: {
|
||
color: "#d9def7"
|
||
}
|
||
},
|
||
data: [{
|
||
xAxis: avg.salesAvgLine,
|
||
name: 'X平均线',
|
||
itemStyle: {
|
||
normal: {
|
||
color: "#b84a58",
|
||
}
|
||
}
|
||
}, {
|
||
yAxis: avg.servicesAvgLine,
|
||
name: 'Y平均线',
|
||
itemStyle: {
|
||
normal: {
|
||
color: "#b84a58",
|
||
}
|
||
}
|
||
}]
|
||
},
|
||
markArea: {
|
||
silent: true,
|
||
data: [
|
||
[{
|
||
// name: '改进',
|
||
itemStyle: {
|
||
normal: {
|
||
color: 'transparent'
|
||
},
|
||
},
|
||
label: {
|
||
normal: {
|
||
show: true,
|
||
position: 'insideTopLeft',
|
||
fontStyle: 'normal',
|
||
color: "#409EFF",
|
||
fontSize: 20,
|
||
}
|
||
},
|
||
coord: [avg.salesAvgLine, avg.servicesAvgLine],
|
||
}, {
|
||
coord: [Number.MAX_VALUE, 0],
|
||
}],
|
||
[{
|
||
// name: '淘汰',
|
||
itemStyle: {
|
||
normal: {
|
||
color: 'transparent',
|
||
},
|
||
},
|
||
label: {
|
||
normal: {
|
||
show: true,
|
||
position: 'insideTopRight',
|
||
fontStyle: 'normal',
|
||
color: "#409EFF",
|
||
fontSize: 20,
|
||
}
|
||
},
|
||
coord: [0, 0],
|
||
}, {
|
||
coord: [avg.salesAvgLine, avg.servicesAvgLine],
|
||
}],
|
||
[{
|
||
// name: '保持',
|
||
itemStyle: {
|
||
normal: {
|
||
color: 'transparent',
|
||
},
|
||
},
|
||
label: {
|
||
normal: {
|
||
show: true,
|
||
position: 'insideBottomLeft',
|
||
fontStyle: 'normal',
|
||
color: "#409EFF",
|
||
fontSize: 20,
|
||
}
|
||
},
|
||
coord: [avg.salesAvgLine, avg.servicesAvgLine],
|
||
}, {
|
||
coord: [Number.MAX_VALUE, Number.MAX_VALUE],
|
||
}],
|
||
[{
|
||
// name: '激励',
|
||
itemStyle: {
|
||
normal: {
|
||
color: 'transparent',
|
||
},
|
||
},
|
||
label: {
|
||
normal: {
|
||
show: true,
|
||
position: 'insideBottomRight',
|
||
fontStyle: 'normal',
|
||
color: "#409EFF",
|
||
fontSize: 20,
|
||
}
|
||
},
|
||
coord: [0, Number.MAX_VALUE],
|
||
}, {
|
||
coord: [avg.salesAvgLine, avg.servicesAvgLine],
|
||
}],
|
||
]
|
||
}
|
||
}]
|
||
};
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
// end 展示四象限图
|
||
// 展示柱状图
|
||
function showEchartForBar(data, unit) {
|
||
unit = unit ? unit : ""
|
||
layui.use(["jquery"], function() {
|
||
const $ = layui.jquery
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
|
||
// 图表: 柱状图
|
||
var xAxis = []
|
||
,series = []
|
||
for (var i = 0; i < data.length; i++) {
|
||
xAxis.push(data[i].title)
|
||
series.push(data[i].value)
|
||
}
|
||
// 绘制图表
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
// 指定图表的配置项和数据
|
||
const option = {
|
||
title: {
|
||
text: ''
|
||
},
|
||
tooltip: {
|
||
formatter: function(parm) {
|
||
return parm.seriesName+parm.name+": "+parm.data + unit
|
||
}
|
||
},
|
||
legend: {},
|
||
xAxis: {
|
||
data: xAxis
|
||
},
|
||
yAxis: {},
|
||
series: {
|
||
name: "",
|
||
type: "bar",
|
||
data: series,
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true,
|
||
position: 'top',
|
||
formatter: function(param) {
|
||
return param.value+unit
|
||
}
|
||
}
|
||
}
|
||
} // 在柱形上显示数值
|
||
}
|
||
};
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
// end 展示柱状图
|
||
|
||
// 展示多维柱状图
|
||
function showEchartForBarMore(data, unit) {
|
||
unit = unit ? unit : ""
|
||
layui.use(["jquery"], function() {
|
||
const $ = layui.jquery
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
|
||
//
|
||
var dimensions = []
|
||
,series = []
|
||
dimensions.push("product");
|
||
for (var i = 0; i < data.dimensions.length; i++) {
|
||
dimensions.push(data.dimensions[i])
|
||
series.push({type: 'bar'})
|
||
}
|
||
// 绘制图表
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
// 指定图表的配置项和数据
|
||
const option = {
|
||
legend: {},
|
||
tooltip: {},
|
||
dataset: {
|
||
dimensions: dimensions,
|
||
source: data.dataList
|
||
},
|
||
xAxis: {type: 'category'},
|
||
yAxis: {},
|
||
series: series
|
||
};
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
// end 展示柱状图
|
||
|
||
// 展示饼状图
|
||
function showEchartForPie(data, unit) {
|
||
unit = unit ? unit : ""
|
||
layui.use(["jquery"], function() {
|
||
const $ = layui.jquery
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
|
||
// 图表: 饼状图
|
||
// 绘制图表
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
// 指定图表的配置项和数据
|
||
const option = {
|
||
title: {
|
||
text: ''
|
||
},
|
||
tooltip: {
|
||
formatter: function(parm) {
|
||
return parm.data.title + ": " + parm.value + unit
|
||
}
|
||
},
|
||
// legend: {
|
||
// data: data
|
||
// },
|
||
series: {
|
||
name: "",
|
||
type: "pie",
|
||
data: data,
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true,
|
||
position: 'top',
|
||
formatter: function(param) {
|
||
return param.value + unit
|
||
}
|
||
}
|
||
}
|
||
} // 在柱形上显示数值
|
||
}
|
||
};
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
// end 展示饼状图
|
||
// 展示产销额图表
|
||
function showEchartWithCxe() {
|
||
unit = unit ? unit : ""
|
||
}
|
||
// end 展示产销额图表
|
||
// 展示按风格图表
|
||
function showEchartWithAfg() {
|
||
unit = unit ? unit : ""
|
||
}
|
||
// end 展示按风格图表
|
||
|
||
//堆叠条形图
|
||
function showEchartForShadow(tbdata) {
|
||
layui.use(["jquery"], function() {
|
||
const $ = layui.jquery
|
||
|
||
$("#dpxg .detail .echart").show()
|
||
// 基于准备好的dom，初始化echarts实例
|
||
if (dpxg_chart) dpxg_chart.dispose() // 摧毁旧实例
|
||
dpxg_chart = echarts.init($("#dpxg .detail .echart")[0]); // 公共静态变量
|
||
|
||
var data = tbdata
|
||
//
|
||
option = {
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
||
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
||
}
|
||
},
|
||
legend: {
|
||
data: data.legend
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
data: data.xList
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: data.dataList
|
||
};
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
dpxg_chart.setOption(option);
|
||
})
|
||
}
|
||
|
||
// end 店铺性格
|
||
|
||
|
||
|
||
// 理想订货方案
|
||
function showLxdhfaDetail(menu, complete) {
|
||
layui.use(["jquery"], function() {
|
||
const $ = layui.jquery
|
||
|
||
if ($("#lxdhfa .menus ."+menu).hasClass("show-this")) return true
|
||
$("#lxdhfa .menus .show-this").removeClass("show-this")
|
||
$("#lxdhfa .menus ."+menu).addClass("show-this")
|
||
if (menu === "zb") {
|
||
showZb(complete)
|
||
$("#lxdhfa .detail .zb").show()
|
||
|
||
$("#lxdhfa .header").hide()
|
||
$("#lxdhfa .detail .dhl").hide()
|
||
} else if (menu === "dhl") {
|
||
showDhl('', complete)
|
||
$("#lxdhfa .detail .zb").hide()
|
||
|
||
$("#lxdhfa .header").show()
|
||
$("#lxdhfa .detail .dhl").show()
|
||
}
|
||
})
|
||
}
|
||
// 展示总表
|
||
function showZb(complete_params) {
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
// end 展示总表
|
||
// 展示订货量
|
||
function showDhl(direction, complete_params) {
|
||
layui.use(["jquery", "table"], function() {
|
||
const $ = layui.jquery
|
||
|
||
direction = direction ? direction : ''
|
||
const zsh = $("#lxdhfa .detail .dhl").attr("data-zsh") ? $("#lxdhfa .detail .dhl").attr("data-zsh") : ''
|
||
|
||
$.ajax({
|
||
url: "./?_m=zdb&_a=lxdh&direction="+direction+"&zsh="+zsh
|
||
,success: function(res) {
|
||
const json_data = $.parseJSON(res)
|
||
console.log("订货量", json_data)
|
||
|
||
if (json_data.code === 0) {
|
||
layui.layer.msg(json_data.msg ? json_data.msg : "无法显示更多")
|
||
return true
|
||
}
|
||
const cldata = json_data.cldata
|
||
|
||
if (cldata.zsh === "-1") {
|
||
layer.msg("没有更多了")
|
||
return
|
||
}
|
||
|
||
$("#lxdhfa .detail .dhl").attr("data-zsh", cldata.zsh)
|
||
if (direction === "prev") {
|
||
$("#lxdhfa .detail .dhl").prepend('<div class="single"></div>')
|
||
$("#lxdhfa .detail .dhl").css('transform', "translateX(-100%)")
|
||
} else if (direction === "next") {
|
||
$("#lxdhfa .detail .dhl").append('<div class="single"></div>')
|
||
} else {
|
||
$("#lxdhfa .detail .dhl").html('<div class="single"></div>')
|
||
}
|
||
|
||
var dhl_html = ''
|
||
dhl_html += '<div class="cl">'
|
||
dhl_html += '<div class="img"><img src="'+cldata.pic+'" onerror="noImg(this)" style="width: '+cldata.pic_w+'px; height: '+cldata.pic_h+'px;" watermark></div>'
|
||
dhl_html += '<div class="remark"><span>'+cldata.pic_remark+'</span></div>'
|
||
dhl_html += '</div>'
|
||
dhl_html += '<div class="dks">'
|
||
for (var i = 0; i < cldata.dks.length; i++) {
|
||
const dk = cldata.dks[i]
|
||
dhl_html += '<div data-khid="'+dk.khid+'">'
|
||
dhl_html += '<div class="floor-1">'
|
||
dhl_html += '<div class="img"><a href="javascript: openDksingle(\''+dk.khid+'\')"><img src="'+dk.pic+'" onerror="noImg(this)" style="width: '+dk.pic_w+'px; height: '+dk.pic_h+'px;" watermark></a></div>'
|
||
if (dk.ydjs && dk.ydjs != '0') dhl_html += '<div class="ydjs"><span>'+dk.ydjs+'</span></div>'
|
||
dhl_html += '</div>'
|
||
dhl_html += '<div class="floor-2">'
|
||
dhl_html += '<span>'+dk.kh+'</span><span>'+(dk.kh && dk.remark ? ', ' : '')+'</span><span>'+dk.remark+'</span>'
|
||
dhl_html += '</div>'
|
||
dhl_html += '<div class="floor-3">'
|
||
dhl_html += '<div><span>预测贡献度</span><span class="text">'+(dk.ycgxd ? dk.ycgxd : '0')+'</span></div>'
|
||
dhl_html += '<div><span>推荐订货量</span><span class="text">'+(dk.tjdhl ? dk.tjdhl : '0')+'</span></div>'
|
||
dhl_html += '</div>'
|
||
dhl_html += '<div class="floor-4 hidden-items">'
|
||
dhl_html += '<input class="color" value="'+dk.color+'">'
|
||
dhl_html += "</div>"
|
||
dhl_html += '</div>'
|
||
}
|
||
dhl_html += '</div>'
|
||
if (direction === "prev") {
|
||
$("#lxdhfa .detail .dhl .single").first().html(dhl_html)
|
||
$("#lxdhfa .detail .dhl").addClass("animation-move-to-left")
|
||
} else if (direction === "next") {
|
||
$("#lxdhfa .detail .dhl .single").last().html(dhl_html)
|
||
$("#lxdhfa .detail .dhl").addClass("animation-with-lxdhfa-move-to-right")
|
||
} else {
|
||
$("#lxdhfa .detail .dhl .single").html(dhl_html)
|
||
}
|
||
new Viewer($("#lxdhfa .detail .single .cl")[0], {
|
||
url: 'data-original'
|
||
,toolbar: false
|
||
,title: false
|
||
,rotatable: false
|
||
,backdrop: false // 点击非图片层关闭
|
||
,viewed: function(event) {
|
||
USetWatermark({
|
||
el: $(event.detail.image),
|
||
is_sy: json_data.is_sy,
|
||
text: json_data.username,
|
||
font_size: 64
|
||
})
|
||
}
|
||
})
|
||
USetWatermark({
|
||
el: $("#lxdhfa"),
|
||
is_sy: watermark_data.is_sy,
|
||
text: watermark_data.username,
|
||
mode: "outer"
|
||
})
|
||
if(complete_params && complete_params.complete) complete_params.complete(complete_params.index)
|
||
}
|
||
,beforeSend: function() { u_start_loading() }
|
||
,complete: function() { u_stop_loading() }
|
||
})
|
||
})
|
||
}
|
||
function openDksingle(khid) {
|
||
|
||
layui.use(['layer', 'jquery'], function(){
|
||
const layer = parent.layer
|
||
,$ = layui.jquery
|
||
|
||
|
||
const face = $("#face").val()
|
||
,url = face == '2' ? "dk_single_qj.htm" : "dk_single.htm"
|
||
layer.open({
|
||
type: 2,
|
||
title: '',
|
||
content: url+"?khid="+khid,
|
||
offset: 'b',
|
||
closeBtn: 0,
|
||
anim: 2
|
||
,success: function(layero, index) {
|
||
layer.full(index);
|
||
}
|
||
});
|
||
});
|
||
}
|
||
// end 展示订货量
|
||
// 已订更新
|
||
function update_yd(khid) {
|
||
layui.use(['jquery'], function(){
|
||
const $ = layui.jquery
|
||
|
||
const clienID = $("#uid").val()
|
||
,khcolor = $("#lxdhfa .detail .dhl .dks [data-khid="+khid+"] .floor-4 .color").val()
|
||
|
||
$.ajax({
|
||
url: "./?_m=zdb&_a=get_order_num&clienID="+clienID+"&khid="+khid+"&khcolor="+khcolor
|
||
,success: function(res) {
|
||
const json_data = $.parseJSON(res)
|
||
console.log("update yd", json_data)
|
||
|
||
if (json_data.code === "1") {
|
||
const ydjs = json_data.js
|
||
var ydjs_elem = $("#lxdhfa .detail .dhl .dks [data-khid="+khid+"] .floor-1 .ydjs")
|
||
if (ydjs) {
|
||
if (ydjs_elem.length < 1) $("#lxdhfa .detail .dhl .dks [data-khid="+khid+"] .floor-1").append('<div class="ydjs"><span>'+ydjs+'</span></div>')
|
||
else ydjs_elem.html('<span>'+ydjs+'</span>')
|
||
} else {
|
||
ydjs_elem.remove()
|
||
}
|
||
}
|
||
}
|
||
})
|
||
});
|
||
}
|
||
// end 理想订货方案
|
||
|
||
</script>
|
||
</body>
|
||
</html> |