supply-chain
/
supply-chain-web


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173
							<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>农产品价格监控大数据</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="../../layui/css/layui.css" />
    <link rel="stylesheet" href="css/style.css">
</head>

<body class="screen-wrap">
    <div class="screen-bg">
        <img src="img/bg.png">
        <div class="screen-header">
            <img src="img/title.png">
            <h2 class="title">农产品价格监控大数据</h2>
            <div id='full-screen' close="buttonFull" class="screenfull right-menu-item el-tooltip">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"

                    width="32" height="32" class="screenfull-svg">
                    <path d="M333.493443 428.647617 428.322206 333.832158 262.572184 168.045297 366.707916 64.444754 64.09683 64.444754 63.853283 366.570793 167.283957 262.460644Z"

                        p-id="2070"></path>
                    <path data-v-31cdf04b="" d="M854.845439 760.133334 688.61037 593.95864 593.805144 688.764889 759.554142 854.56096 655.44604 958.161503 958.055079 958.161503 958.274066 656.035464Z"

                        p-id="2071"></path>
                    <path data-v-31cdf04b="" d="M688.535669 428.550403 854.31025 262.801405 957.935352 366.921787 957.935352 64.34754 655.809313 64.081481 759.919463 167.535691 593.70793 333.731874Z"

                        p-id="2072"></path>
                    <path data-v-31cdf04b="" d="M333.590658 594.033341 167.8171 759.804852 64.218604 655.67219 64.218604 958.270996 366.342596 958.502263 262.234493 855.071589 428.421466 688.86108Z"

                        p-id="2073"></path>
                </svg>
            </div>
        </div>
        <div class="screen-body">
            <div class="layui-row layui-col-space12" style="height: 100%;">
                <div class="layui-col-xs24 layui-col-md3" style="height: 100%;">
                    <div class="grid-demo grid-demo-bg" style="height: 12%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <ul class="left-top ui-absolute" id="left-top">
                            <li>
                                <h4 class="name">农产品种类</h4>
                                <div class="number">
                                    <ul class="number-list">
                                        <li>3</li>
                                        <li>2</li>
                                        <li>4</li>
                                    </ul>
                                    <span class="unit">种</span>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="grid-demo grid-demo-bg" style="height: 45%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <div id="riseFallChart" class="ui-absolute" style="width:100%;"></div>
                        <div class="productBox ui-absolute" style="top: auto; bottom: 3%;">
                            <ul class="left-body" id="priceIndex">
                                <!-- <li class="active">

                                    <div>

                                        <h4 class="number">101.9<span class="arrow rise-arrow"></span></h4>

                                        <p class="name">农产品指数</p>

                                    </div>

                                </li> -->
                            </ul>
                        </div>

                    </div>
                    <div class="grid-demo grid-demo-bg" style="height: 36.8%;">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <div class="left-bot">
                            <ul class="table-head">
                                <li>产品名称</li>
                                <li>价格</li>
                                <li>涨跌</li>
                            </ul>
                            <div class="table-body ui-absolute left-bot-table" style=" overflow: hidden">
                                <ul id="left-bot-table">
                                    <!-- <li class="ui-flex table-row"><span>大白菜</span><span>3.21</span><span>5.89</span><span class="number rise-number"><b class="num">5.89</b><b class="arrow"></b></span></li> -->
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-xs24 layui-col-md6" style="height: 100%;">
                    <div class="grid-demo grid-demo-bg" style="height: 97.2%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <!-- <div class="middle-top ui-absolute" style="bottom: auto; top: -3.1%">

                            <ul>

                                <li>

                                    <h4 class="name">批发</h4>

                                </li>

                                <li class="active">

                                    <h4 class="name">零售</h4>

                                </li>

                            </ul>

                        </div> -->
                        <div class="middle-panel" style="bottom: auto; top: -2%">
                            <ul id="avgPrice" class="ui-absolute">
                                <li>
                                    <p class="title">市场批发均价(元／斤)</p><span class="num nationalAvg">-</span>
                                </li>
                                <!-- <li>

                                    <p class="title">省内均价(元／斤)</p><span class="num provinceAvg">-</span>

                                </li> -->
                            </ul>
                        </div>
                        <div id="mapChart" class="ui-absolute" style="width:100%; bottom: 29%"></div>
                        <div class="middle-body ui-absolute" style="top: auto; bottom: 23%; display: flex; align-items: center; width: 475px; margin: 0 auto;">
                            <span class="btn left-btn"></span>
                            <div class="mapIndexBox">
                                <ul id="mapIndex">
                                    <!-- <li> <h4 class="name">羊肉</h4></li> -->
                                </ul>
                                <!-- <div class="bar"></div> -->
                            </div>
                            <span class="btn right-btn"></span>
                        </div>
                        <div class="middle-bot ui-absolute">
                            <div id="priceLineChart" class="ui-absolute" style="width: 50%"></div>
                            <div id="axisBarChart" class="ui-absolute" style="width: 50%; left: 50%;"></div>
                        </div>
                    </div>
                    <!-- <div class="grid-demo grid-demo-bg" style="height: 23.5%;">

                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>


                    </div> -->
                </div>
                <div class="layui-col-xs24 layui-col-md3" style="height: 100%;">
                    <div class="grid-demo grid-demo-bg" style="height: 36%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <div id="poarChart" class="ui-absolute" style="width:100%;"></div>
                    </div>
                    <div class="grid-demo grid-demo-bg" style="height: 29%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <div class="left-bot">
                            <ul class="table-head">
                                <li>排名</li>
                                <li>商户名称</li>
                                <li>批发量(吨)</li>
                            </ul>
                            <div class="table-body ui-absolute right-middle-table" style=" overflow: hidden">
                                <ul id="right-middle-table">
                                    <!-- <li class="ui-flex table-row"><span class="index"><b>1</b></span><span>3.21</span><span>5.89</span><span>5.89</span></li> -->
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="grid-demo grid-demo-bg" style="height: 29%">
                        <b class="bg-left-top"></b><b class="bg-right-top"></b><b class="bg-left-bottom"></b><b class="bg-right-bottom"></b>
                        <div class="left-bot">
                            <ul class="table-head">
                                <li>排名</li>
                                <li>商品名称</li>
                                <li>批发量(吨)</li>
                            </ul>
                            <div class="table-body ui-absolute right-bot-table" style=" overflow: hidden">
                                <ul id="right-bot-table">
                                    <!-- <li class="ui-flex table-row"><span class="index"><b>1</b></span><span>3.21</span><span>5.89</span><span>5.89</span></li> -->
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="../../layui/layui.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/echarts.min.js" charset="utf-8"></script>
    <script src="js/scroll.js" type="text/javascript" charset="utf-8"></script>
    <script src="index.js" type="text/javascript" charset="utf-8"></script>
</body>

</html>