| | |
| | | |
| | | <div class="layui-carousel" id="test1"> |
| | | <div carousel-item> |
| | | <div style="background-color: red">条目1</div> |
| | | <div style="background-color: gold">条目2</div> |
| | | <div style="background-color: #333333">条目3</div> |
| | | <div style="background-color: #00FF00">条目4</div> |
| | | <div style="background-color: #5FB878">条目5</div> |
| | | <div style="background-color: red"></div> |
| | | <div style="background-color: gold"></div> |
| | | <div style="background-color: #333333"></div> |
| | | <div style="background-color: #00FF00"></div> |
| | | <div style="background-color: #5FB878"></div> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | </div> |
| | | </div> |
| | | <div class="progress-bar-modal"> |
| | | <div class="bar-container"> |
| | | <div class="bar-proportion"><span>实际使用</span></div> |
| | | <div class="layui-progress layui-progress-big" lay-filter="used-progress" style="background-color: #233751;width: 80%;display: inline-block"> |
| | | <div class="layui-progress-bar layui-bg-red" lay-percent="0%"></div> |
| | | </div> |
| | | <!-- <div class="bar-container">--> |
| | | <!-- <div class="bar-proportion"><span>实际使用</span></div>--> |
| | | <!-- </div>--> |
| | | <i class="bar-container-count"><span id="used">0</span></i> |
| | | </div> |
| | | </div> |
| | |
| | | </div> |
| | | </body> |
| | | <script> |
| | | layui.use('carousel', function(){ |
| | | layui.use(['element', 'carousel'], function(){ |
| | | var carousel = layui.carousel; |
| | | var element = layui.element; |
| | | //建造实例 |
| | | carousel.render({ |
| | | elem: '#test1' |
| | |
| | | |
| | | $('#usedPr').text(res.data.usedPr); |
| | | $('#used').text(res.data.used); |
| | | |
| | | layui.element.progress('used-progress', res.data.usedPr + '%'); |
| | | } else if (res.code === 403){ |
| | | top.location.href = "/"; |
| | | } else { |