1.Echarts项目源码
2.前端部分代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>电商后台</title>
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/scanboard.css" />
<link rel="stylesheet" type="text/css" href="css/animsition.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.shCircleLoader.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.shCircleLoader-min.js"></script>
</head>
<body>
<div id="loader"></div>
<script type="text/javascript">
$('#loader').shCircleLoader({color: "#00deff"});
</script>
<!--Top Start!-->
<div class="scanboardWp animsition">
<div id="top">
<div class="wp clearfix">
<div class="left pageTit">
<a class="summaryBtn" href="javascript:;">物流汇总后台</a>
</div>
<div class="center topLogo">
<a href="https://paycloud.vip"><img src="images/logo.png"></a>
</div>
<div class="right topBar">
<div class="topTime">时间加载中...</div>
<div class="clearfix">
<a href="index.html" class="signOut fr">退出</a>
<div class="company fr">
<h3 style="">资源优选</h3>
<div class="dropdown">
<a href="https://paycloud.vip">资源淘宝店</a>
<a href="https://paycloud.vip">可视化模板精选</a>
<a href="https://paycloud.vip">优质资源</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Top End!-->
<!--Main Start!-->
<div id="main" class="wp clearfix">
<div class="left">
<!--今日运单数量-->
<div class="item waybill">
<div class="itemTit">
<span class="border-yellow">今日运单数量</span>
</div>
<div class="itemCon itembg">
<div class="progress" progress="80%">
<h3 class="clearfix"><span>正常单</span><i>80单</i></h3>
<div class="progressBar">
<span></span>
</div>
<h4>0%</h4>
</div>
<div class="progress" progress="15%">
<h3 class="clearfix"><span>临时单</span><i>15单</i></h3>
<div class="progressBar">
<span></span>
</div>
<h4>0%</h4>
</div>
<div class="progress" progress="5%">
<h3 class="clearfix"><span>异常单</span><i>5单</i></h3>
<div class="progressBar">
<span></span>
</div>
<h4>0%</h4>
</div>
</div>
</div>
<!--各阶段平均用时统计-->
<div class="item">
<div class="itemTit">
<span class="border-green">各阶段平均用时统计</span>
</div>
<div class="itemCon">
<ul class="listStyle">
<li class="clearfix">
<span>下单…配车</span>
<span><strong>3.4</strong>秒</span>
</li>
<li class="clearfix">
<span>配车…装货</span>
<span><strong>24</strong>分钟</span>
</li>
<li class="clearfix">
<span>到厂卸货</span>
<span><strong>14</strong>分钟</span>
</li>
<li class="clearfix">
<span>装回收器具</span>
<span><strong>7</strong>分钟</span>
</li>
<li class="clearfix">
<span>卸回收器具</span>
<span><strong>5</strong>分钟</span>
</li>
</ul>
</div>
</div>
<!--人员信息-->
<div class="item">
<div class="itemTit">
<span class="border-blue">人员信息</span>
</div>
<div class="itemCon itembg">
<ul class="listStyle">
<li class="clearfix">
<span>领导：<strong>5</strong>人</span>
<span>司机：<strong>36</strong>人</span>
<span>门卫：<strong>6</strong>人</span>
<span>器具中心：<strong>15</strong>人</span>
<span>派单员：<strong>20</strong>人</span>
<span>售后卸载：<strong>29</strong>人</span>
<span>财务：<strong>3</strong>人</span>
<span>售后回收：<strong>10</strong>人</span>
</li>
</ul>
</div>
</div>
</div>
<div class="center">
<div class="centerWp">
<!--中间大地图-->
<div class="mapContainer">
<div class="btnLayer">
<div class="search">
<div class="searchInner">
<a href="javascript:;" class="searchBtn"><span class="icoSearch"></span></a>
<form class="searchForm">
<button class="icoSearch"></button>
<input type="text" name="" placeholder="请搜索车辆">
</form>
</div>
</div>
<a href="javascript:;" class="infoBtn"><span class="icoCar"></span></a>
</div>
<div id="myMap" class="item"></div>
</div>
<!--月运单量统计图-->
<div class="billChart">
<div class="itemTit">
<span class="border-blue">月运单量统计图<small>(2017年12月)</small></span>
</div>
<div id="myChart1"></div>
</div>
</div>
</div>
<div class="right">
<!--总计运单数-->
<div class="item total itembg">
<div class="itemTit">
<span class="border-yellow">总计运单数</span>
</div>
<div class="itemCon">
<div class="totalNum"><strong id="totalNum" total="368082">0</strong><span>单</span></div>
</div>
</div>
<!--基本信息-->
<div class="item basicInfo">
<div class="itemTit">
<span class="border-green">基本信息</span>
</div>
<div class="itemCon itembg">
<div class="infoPie">
<ul class="clearfix">
<li class="color-yellow">
<span class="border-yellow" id="indicator1" total="32">0</span>
<p>在途车辆</p>
</li>
<li class="color-green">
<span class="border-green" id="indicator2" total="65">0</span>
<p>出车次数</p>
</li>
<li class="color-blue">
<span class="border-blue" id="indicator3" total="100">0</span>
<p>今日订单</p>
</li>
</ul>
<div id="indicatorContainer"></div>
</div>
</div>
</div>
<!--运单状态-->
<div class="item billState">
<div class="itemTit">
<span class="border-green">运单状态</span>
</div>
<div class="itemCon">
<div class="StateBox">
<div class="StateTit">
<span>订单编号</span>
<span>使用时间</span>
<span>满载率</span>
</div>
<div id="FontScroll">
<ul>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="78%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="80%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="49%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="7%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="55%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="100%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="94%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="23%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="67%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="42%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="38%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
<li>
<div class="fontInner clearfix">
<span>ZC1712120023</span>
<span>2小时15分</span>
<span>
<div class="progress" progress="76%">
<div class="progressBar">
<span></span>
</div>
<h3><i><h4></h4></i></h3>
</div>
</span>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Main End!-->
</div>
<div class="filterbg"></div>
<div class="popup">
<a href="javascript:;" class="popupClose"></a>
<div class="summary">
<div class="summaryTop">
<div id="summaryPie1" class="summaryPie"></div>
<div id="summaryPie2" class="summaryPie"></div>
<div id="summaryPie3" class="summaryPie"></div>
</div>
<div class="summaryBottom">
<div class="summaryBar">
<div class="summaryTit">
<img src="images/tit1.png">
</div>
<div id="summaryBar"></div>
</div>
<div class="summaryLine">
<div class="summaryTit">
<img src="images/tit2.png">
</div>
<div id="summaryLine"></div>
</div>
</div>
</div>
</div>
3登陆注册界面
4.主界面功能演示
5.后台物流
6.联系我
| QQ | 微信 |
 |  |
扫一扫
863
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
