From f641bad60c3c50f2bf66845252e73fa28ecaab67 Mon Sep 17 00:00:00 2001 From: lsh <lsh@163.com> Date: 星期二, 10 九月 2024 13:19:08 +0800 Subject: [PATCH] #fs --- src/main/webapp/views/index.html | 237 ++++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 152 insertions(+), 85 deletions(-) diff --git a/src/main/webapp/views/index.html b/src/main/webapp/views/index.html index 5d362b2..f4bb567 100644 --- a/src/main/webapp/views/index.html +++ b/src/main/webapp/views/index.html @@ -2,97 +2,164 @@ <html> <head> <meta charset="utf-8"> - <title>鑷姩浠撳簱WCS绯荤粺</title> - <link rel="stylesheet" href="../static/css/index.css"> - <script src="../static/js/jquery/jquery-3.3.1.min.js"></script> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>鐜舰绌挎杞︽櫤鑳介〉闈�</title> + <script type="text/javascript" src="../static/js/vue.min.js"></script> + <script type="text/javascript" src="../static/js/element.js"></script> + <style> + body { + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + margin: 0; + padding: 0; + background-color: #dbd8d8; + color: #ffffff; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + } + header { + background-color: #2196F3; + color: white; + padding: 15px 20px; + text-align: center; + font-size: 24px; + letter-spacing: 1px; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3); + } + .map { + position: relative; + width: 80vh; + height: 80vh; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + } + .inner-ring, .outer-ring { + position: absolute; + border-radius: 50%; + } + .inner-ring { + width: 72vh; + height: 72vh; + border: 4px solid #00E676; + box-shadow: inset 0 0 30px rgba(0, 230, 118, 0.5), 0 0 20px rgba(0, 230, 118, 0.5); + } + .outer-ring { + width: 80vh; + height: 80vh; + border: 4px solid #00E676; + box-shadow: inset 0 0 30px rgba(0, 230, 118, 0.5), 0 0 20px rgba(0, 230, 118, 0.5); + } + .station, .bus { + position: absolute; + width: 24px; + height: 24px; + border-radius: 50%; + text-align: center; + line-height: 24px; + font-weight: bold; + transition: transform 0.3s ease; + } + .station { + background-color: #FF5722; + transform: scale(1.2); + } + .bus { + background-color: #2196F3; + border: 2px solid #ffffff; + } + .station:hover, .bus:hover { + transform: scale(1.4); + } + </style> </head> <body> -<!-- 瀵艰埅鏍� --> -<!-- <div class="nav">--> -<!-- <li class="right">娉ㄩ攢<a id="about" class="nav-unselect" onclick="logout()" href="#"></a></li>--> -<!-- </div>--> -<div class="sidebar"> - <div class="nav"> - <ul class="cl-effect-4"> - <li><a id="console" onclick="nav(this.id)" class="nav-select" href="#">涓�妤间竴鍖�</a></li> - <li><a id="pipeline" onclick="nav(this.id)" class="nav-unselect" href="#">杈撻�佽澶�</a></li> - <li><a id="rgv" onclick="nav(this.id)" class="nav-unselect" href="#">RGV</a></li> - <li><a id="ste" onclick="nav(this.id)" class="nav-unselect" href="#">绌挎杞�</a></li> - </ul> - </div> -</div> -<!--<div style="z-index: 999; position: absolute; top: 250px; left: 900px; width: 200px; height: 200px; opacity: 0.5;background-color: #0000FF">--> -<!--</div>--> -<!-- 涓讳綋鍐呭 --> -<iframe id="content" src="console.html"></iframe> -<footer class="footer"> - Copyright 漏 2023 All Rights Reserved. <a href="https://www.zoneyung.com" target="_blank">娴欐睙涓壃</a> 淇濈暀鎵�鏈夋潈鍒� -</footer> +<!--<header>--> +<!-- 鐜舰绌挎杞︽櫤鑳界郴缁�--> +<!--</header>--> +<div id="app" class="map"> + <div class="inner-ring"></div> + <div class="outer-ring"></div> + + <!-- Stations on outer ring --> + <div class="station" style="top: -10px; left: 50%;">1</div> + <div class="station" style="top: 30%; left: 100%;">2</div> + <div class="station" style="top: 70%; left: 100%;">3</div> + <div class="station" style="top: 110%; left: 50%;">4</div> + <div class="station" style="top: 70%; left: 0;">5</div> + <div class="station" style="top: 30%; left: 0;">6</div> + + <!-- Stations on inner ring --> + <div class="station" style="top: 5%; left: 50%;">7</div> + <div class="station" style="top: 25%; left: 80%;">8</div> + <div class="station" style="top: 75%; left: 80%;">9</div> + <div class="station" style="top: 95%; left: 50%;">10</div> + <div class="station" style="top: 75%; left: 20%;">11</div> + <div class="station" style="top: 25%; left: 20%;">12</div> + + <!-- Buses --> + <div class="bus" style="top: 15%; left: 60%;">A</div> + <div class="bus" style="top: 45%; left: 85%;">B</div> + <div class="bus" style="top: 80%; left: 55%;">C</div> + <div class="bus" style="top: 65%; left: 25%;">D</div> + <div class="bus" style="top: 45%; left: 35%;">E</div> +</div> + </body> <script> - // 瀵艰埅鏍� - function nav(id) { - $('.nav-select').attr("class", "nav-unselect"); - $('#'+id).attr("class", "nav-select"); - $('#content').attr("src", id+".html"); - } - - function logout() { - localStorage.removeItem("token"); - window.location.href = baseUrl + "/login"; - } - - // 绯荤粺杩愯鐘舵�� - var systemRunning = true; - - - news();layx.min('wcs-news'); - function news() { - layx.iframe( - 'wcs-news' // id - , '绯荤粺鍒嗘瀽鎶ュ憡' - , "news.html" - , { - shadow:false - , storeStatus:false - // , skin: 'news' - , width:800 - , height:600 - , position:'rb' - // , control:false - , opacity:0.9 - , border:false - , icon:'<img src="../static/images/login.png" style="height:22px;display:block;" alt=""/>' - , stickMenu:true - , maxMenu:false - , closeMenu:false - , moveLimit:{ - leftOut: false, - rightOut: false, - topOut: false, - bottomOut: false, + var app = new Vue({ + el: '#app', + data: { + ringThroughringThrough: [], + addWeekPlanDataWeeklySign: [ + { + value: '1', + label: '涓婂懆' + }, + { + value: '2', + label: '鏈懆' + }, + { + value: '3', + label: '涓嬪懆' } - , minWidth:300 - , minHeight:300 - , borderRadius: '8px' - , shadeDestroy:true - , escKey: false - , event:{ - onmin: { - after: function () { - $('.layx-min-statu').css("left", "inherit").css("right", "10px") - } - } - , onrestore:{ - after: function () { - let win = layx.getFrameContext('wcs-news'); - win.autoScroll = true - } - } - } + ] + }, + created(){ + this.init(); + }, + watch: { + filterText(val) { + this.$refs.tree.filter(val); } - ); - } + }, + computed:{ + // cstmrLabel () { + // return (val) => { + // let item = this.options.find(o => o.value === val); + // return item ? item.label : 'Item not found'; + // } + // } + }, + methods: { + init(){ + let that = this + $.ajax({ + url: baseUrl + '/weekly/list/auth', + headers: {'token': localStorage.getItem('token')}, + method: "get", + success: (res) => { + that.tableData = res.data.records; + console.log(that.tableData) + } + }); + } + } + }) + </script> </html> -- Gitblit v1.9.1