From 29470086e5d10b134bd2c70f53c39e58b5706ed5 Mon Sep 17 00:00:00 2001 From: chenhuan <czj123456> Date: 星期一, 27 五月 2024 14:46:39 +0800 Subject: [PATCH] main & login --- javaweb-plus/javaweb-admin/src/main/resources/static/css/skins.css | 2 javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/password1.png | 0 /dev/null | 0 javaweb-plus/javaweb-admin/src/main/resources/static/css/style.css | 17 javaweb-plus/javaweb-admin/src/main/resources/templates/main2.html | 622 +++++++++++++++++++++++++++++++++++++++++ javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/login.html | 47 +- javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user1.png | 0 javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/bg2.png | 0 javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/logincopy.html | 211 ++++++++++++++ 9 files changed, 868 insertions(+), 31 deletions(-) diff --git a/javaweb-plus/javaweb-admin/src/main/resources/static/css/skins.css b/javaweb-plus/javaweb-admin/src/main/resources/static/css/skins.css index c5c725a..306c930 100644 --- a/javaweb-plus/javaweb-admin/src/main/resources/static/css/skins.css +++ b/javaweb-plus/javaweb-admin/src/main/resources/static/css/skins.css @@ -162,7 +162,7 @@ } .skin-blue .content-tabs { - border-bottom: 1px solid #e5e5e5; + /*border-bottom: 1px solid #e5e5e5;*/ } .skin-blue.layout-top-nav>.logo { diff --git a/javaweb-plus/javaweb-admin/src/main/resources/static/css/style.css b/javaweb-plus/javaweb-admin/src/main/resources/static/css/style.css index 76b2d02..7150c80 100644 --- a/javaweb-plus/javaweb-admin/src/main/resources/static/css/style.css +++ b/javaweb-plus/javaweb-admin/src/main/resources/static/css/style.css @@ -3048,7 +3048,7 @@ } .border-bottom { - border-bottom: 1px solid #e7eaec !important; + /*border-bottom: 1px solid #e7eaec !important;*/ } .font-bold { @@ -3247,9 +3247,9 @@ /*CONTENTTABS*/ .content-tabs { position: relative; - height: 39px; - background: #fafafa; - line-height: 38px; + height: 45px; + background: #ffffff; + line-height: 43px; } .content-tabs .roll-nav, .page-tabs-list { @@ -3287,7 +3287,7 @@ nav.page-tabs { margin-left: 30px; width: 100000px; - height: 38px; + height: 45px; overflow: hidden; } @@ -3298,8 +3298,8 @@ .page-tabs a { display: block; float: left; - border-right: solid 1px #eee; - padding: 0 15px; + /*border-right: solid 1px #eee;*/ + padding: 0 30px; } .page-tabs a i:hover { @@ -6567,8 +6567,9 @@ } .page-tabs a.active { - background: #eaedf1; + /*background: #eaedf1;*/ color: #23508e; + border-bottom: 2px solid #409eff; } .page-tabs a.active:hover, .page-tabs a.active i:hover { diff --git a/javaweb-plus/javaweb-admin/src/main/resources/templates/main2.html b/javaweb-plus/javaweb-admin/src/main/resources/templates/main2.html new file mode 100644 index 0000000..09db381 --- /dev/null +++ b/javaweb-plus/javaweb-admin/src/main/resources/templates/main2.html @@ -0,0 +1,622 @@ +<!DOCTYPE html> +<html lang="zh" xmlns:th="http://www.thymeleaf.org"> +<head> +<th:block th:include="include :: header('寮瑰眰缁勪欢')" /> +<link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet" /> +<link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet" /> +<link href="../static/css/main/animate.min.css" th:href="@{/css/main/animate.min.css}" rel="stylesheet" /> +<link href="../static/css/main/style.min862f.css" th:href="@{/css/main/style.min862f.css}" rel="stylesheet" /> +<link rel="stylesheet" th:href="@{/css/custom/main.css}" /> +<link href="../static/js/elementUI/index.css" th:href="@{/js/elementUI/index.css}" rel="stylesheet" /> + +<style type="text/css"> + .content { + width: 100%; + background-color: rgba(0,0,0,0.01) !important; + padding:10px; + } + [v-cloak]{ + display: none; + } + .el-card__header{ + height: 40px; + padding: 8px 20px; + } + .active-red{ + width: 20px; + height: 20px; + border-radius: 50%; + font-size: 14px; + color: white; + background: #F56C6C; + text-align: center; + line-height: 20px; + float: left; + } + + .active-yellow{ + width: 20px; + height: 20px; + border-radius: 50%; + font-size: 14px; + color: white; + background: #E6A23C; + text-align: center; + line-height: 20px; + float: left; + } + + .active-blue{ + width: 20px; + height: 20px; + border-radius: 50%; + font-size: 14px; + color: white; + background: #67C23A; + text-align: center; + line-height: 20px; + float: left; + } + .cdcode{ + width: 15%; + float: left; + margin-left: 10px; + font-size: 16px; + line-height: 20px; + } + .cdstatus{ + width: 15%; + float: left; + margin-left: 0px; + font-size: 16px; + line-height: 20px; + } + .cdprocess{ + width: 60%; + float: left; + margin-left: 10px; + } + .rankrow{ + margin-top: 12px; + cursor: pointer; + } + .ilblock{ + border-left: 1px solid #e3e5e7; + padding: 0 40px; + align-content: center; + } + .ilblock span{ + display: block; + line-height: 30px; + } + +</style> +</head> + +<body class="gray-bg"> + <div class="content" id="app" v-cloak> + <el-row style="height: 127px;"> + <el-col :span="6"> + <el-card class="box-card"> + <div style="flex:4;padding-right: 20px;" > + <div> + <li class="el-icon-s-promotion" style="font-size: 18px;margin-right: 5px;margin-left: -5px;color: #409eff;"></li> + <span style="color:rgba(0,0,0,.65);font-size: 15px;font-weight: bold;">鍦哄湴鏁伴噺</span> + </div> + <div style="text-align: center;"> + <span style="color:#000;font-size: 30px;word-break: break-all;line-height: 70px">34 + </span> + </div> + </div> + + <div style="flex:6;" class="ilblock"> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 鍗忚皟涓� + <span style="float: right"> + {{indexDataCount.projectStatus0}} + </span> +<!-- <li class="el-icon-caret-bottom" style="color: #f56c6c">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 寰呭紑宸� + <span style="float: right">{{indexDataCount.projectStatus1}}</span> +<!-- <li class="el-icon-caret-bottom" style="color: #e6a23c">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 杩涜涓� + <span style="float: right">{{indexDataCount.projectStatus2}}</span> +<!-- <li class="el-icon-caret-top" style="color: #409eff">--> + </span> + + </div> + </el-card> + </el-col> + + <el-col :span="6"> + <el-card class="box-card"> + <div style="flex:4;padding-right: 20px;"> + <div> + <li class="el-icon-coin" style="font-size: 18px;margin-right: 5px;margin-left: -5px;color: #085abe"></li> + <span style="color:rgba(0,0,0,.65);font-size: 15px;font-weight: bold;">閽诲瓟杩涘昂</span> + </div> + <div style="text-align: center"> + <span style="color:#000;font-size: 30px;word-break: break-all;line-height: 70px;">647 + </span> + </div> + </div> + + <div style="flex:6;" class="ilblock"> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 鎬昏繘灏� <span style="float: right">{{indexDataCount.footageCount}}m</span> +<!-- <li class="el-icon-caret-bottom" style="color: #f56c6c">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 宸插畬鎴� <span style="float: right">{{indexDataCount.footageCplCount}}m</span> +<!-- <li class="el-icon-caret-bottom" style="color: #409eff">--> + </span> + </div> + </el-card> + </el-col> + + <el-col :span="6"> + <el-card class="box-card"> + <div style="flex:4;padding-right: 20px;"> + <div> + <li class="el-icon-video-camera" style="font-size: 18px;margin-right: 5px;margin-left: -5px;color: #11d713"></li> + <span style="color:rgba(0,0,0,.65);font-size: 15px;font-weight: bold;">瀹炴椂鐩戞帶</span> + </div> + <div style="text-align: center"> + <span style="color:#000;font-size: 30px;word-break: break-all;line-height: 70px">68 + </span> + </div> + </div> + + <div style="flex:6;" class="ilblock"> + <div> + + </div> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 宸插畨瑁� <span style="float: right">0</span> +<!-- <li class="el-icon-caret-bottom" style="color: #f56c6c">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 鏈畨瑁� <span style="float: right">68</span> +<!-- <li class="el-icon-caret-bottom" style="color: #409eff">--> + </span> + </div> + </el-card> + </el-col> + <el-col :span="6"> + <el-card class="box-card"> + <div style="flex:4;padding-right: 20px;"> + <div> + <li class="el-icon-s-order" style="font-size: 18px;margin-right: 5px;margin-left: -5px;color: #917ed0"></li> + <span style="color:rgba(0,0,0,.65);font-size: 15px;font-weight: bold;">璧勬枡鏂囦欢</span> + </div> + <div style="text-align: center"> + <span style="color:#000;font-size: 30px;word-break: break-all;line-height: 70px;"> + {{indexDataCount.fileCount}} + </span> + </div> + </div> + + <div style="flex:6;" class="ilblock"> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 鏂藉伐璧勬枡 <span style="float: right">0</span> +<!-- <li class="el-icon-caret-bottom" style="color: #f56c6c">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 瀹夊叏璧勬枡 <span style="float: right">0</span> +<!-- <li class="el-icon-caret-bottom" style="color: #409eff">--> + </span> + <span style="color:rgba(0,0,0,.65);font-size: 15px;"> + 璐ㄩ噺璧勬枡 <span style="float: right">0</span> +<!-- <li class="el-icon-caret-bottom" style="color: #409eff">--> + </span> + </div> + + </el-card> + </el-col> + </el-row> + <el-row> + <el-col :span="16"> + <el-card class="box-card"> + <div style="height: 200px;"> + <h3>鏉愭枡缁熻</h3> + </div> + </el-card> + + <el-card class="box-card" style="margin-top: 20px;"> + <div id="map_div" style="width: 100%;height: 550px;"></div> + </el-card> + + </el-col> + + <el-col :span="8"> + <el-card class="box-card"> + <div style="height: 200px;"> + <div style="width: 100%;height: 20px;"> + <h3>椤圭洰鎬讳綋杩涘害(%)</h3> + </div> + <div id="Chart1" style="width: 80%;height: 180px;margin-left: 10%;"></div> + </div> + </el-card> + + <el-card class="box-card" style="margin-top: 20px;"> + <div style="width: 100%;height: 20px;margin-bottom: 10px;text-align: center;"> + <h3>鍦哄湴璇︾粏杩涘害(%)</h3> + </div> + <div style="width: 100%;height: 500px;overflow: auto"> + + <el-row class="rankrow" v-for='entity in stationProcessData' @click.native='viewStation(entity)'> + <el-col :span="2" > + <div v-if="entity.status=='鍗忚皟涓�'" class="active-red">{{entity.ranking}}</div> + <div v-if="entity.status=='寰呭紑宸�'" class="active-yellow">{{entity.ranking}}</div> + <div v-if="entity.status=='杩涜涓�'" class="active-blue">{{entity.ranking}}</div> + + </el-col> + + <el-col :span="7"> + <div style="font-size: 16px">{{entity.station}}</div> + </el-col > + + <el-col :span="5"> + <div style="font-size: 16px">{{entity.status}}</div> + </el-col> + + <el-col :span="8"> + <div> + <el-progress :stroke-width="10" :percentage="entity.value"></el-progress> + </div> + </el-col> + </el-row> + + </div> + + </el-card> + + </el-col> + + </el-row> + + </div> + + <script th:src="@{/js/jquery.min.js}"></script> + <script th:src="@{/js/bootstrap.min.js}"></script> + <script th:src="@{/ajax/libs/flot/jquery.flot.js}"></script> + <script th:src="@{/ajax/libs/report/echarts/echarts-all.js}"></script> + <script th:src="@{/js/tdt.js}" type="text/javascript"></script> + <script src="http://lbs.tianditu.gov.cn/js/lib/d3/d3.min.js" type="text/javascript"></script> + <script src="http://lbs.tianditu.gov.cn/api/js4.0/opensource/openlibrary/D3SvgOverlay.js" type="text/javascript"></script> + <script th:src="@{/js/custom/main.js}"></script> + + <script th:src="@{/js/vue.min.js}"></script> + <script th:src="@{/js/elementUI/index.js}"></script> + + <th:block th:include="include :: sparkline-js" /> + <th:block th:include="include :: footer" /> + + <script th:inline="javascript"> + + $(function() { + loadMap(); + getReallyData(); + totalProcess(); + stationProcess(); + indexCount(); + }) + function viewStation(station) { + var lng = station.lng; + var lat = station.lat; + map.centerAndZoom(new T.LngLat(lng, lat), 13); + // $.modal.openTab("鍦哄湴瀵艰埅",ctx+"/geo/project/navigate?ids="+id); + } + + function indexCount() { + let url = ctx + "/system/indexDataCount"; + $.ajaxSettings.async = false; + $.get(url,{},function(res){ + vm.indexDataCount = res.data; + }) + $.ajaxSettings.async = false; + } + + function stationProcess() { + let url = ctx + "/system/projectProcess"; + $.ajaxSettings.async = false; + $.get(url,{},function(res){ + vm.stationProcessData = res.projectData; + }) + $.ajaxSettings.async = false; + console.log(vm.stationProcessData); + + } + var vm = new Vue({ + el: "#app", + data() { + return { + stationProcessData: [], + indexDataCount :"", + }; + }, + methods: { + } + }); + // 鍔犺浇鍦板浘 + let map=null; + var countries = []; + var countriesOverlay = new T.D3Overlay(init,redraw); + var countriesOverlay1 = new T.D3Overlay(init1,redraw1); + function loadMap() { + map = new T.Map('map_div'); + map.centerAndZoom(new T.LngLat(116.38, 40.2), 9); + + var control = new T.Control.Zoom(); + control.setPosition(T_ANCHOR_TOP_RIGHT); + map.addControl(control);// 娣诲姞缂╂斁骞崇Щ鎺т欢 + var scale = new T.Control.Scale();// 鍒涘缓姣斾緥灏烘帶浠跺璞� + d3.json("/bjfw/js/custom/beijing.json", function (data) { + countries = data.features; + map.addOverLay(countriesOverlay) + countriesOverlay.bringToBack(); + map.addOverLay(countriesOverlay1) + countriesOverlay.bringToBack(); + }); + } + + function init(sel, transform) { + var upd = sel.selectAll('path.geojson').data(countries); + upd.enter() + .append('path') + .attr("class", "geojson") + .attr('stroke', 'grey') + .attr('fill', function (d, i) { + //return d3.hsl(Math.random() * 360, 0.9, 0.5) + return "transparent" + }) + .attr('fill-opacity', '0') + } + function redraw(sel, transform) { + sel.selectAll('path.geojson').each( + function (d, i) { + d3.select(this).attr('d', transform.pathFromGeojson) + } + ) + } + function init1(sel, transform) { + var upd = sel.selectAll('path.geojson1').data(countries); + upd.enter() + .append('path') + .attr("class", "geojson1") + .attr('stroke', 'grey') + .attr('fill', function (d, i) { + return d3.hsl(Math.random() * 360, 0.9, 0.5) + }) + .attr('fill-opacity', '0.1') + } + + function redraw1(sel, transform) { + sel.selectAll('path.geojson1').each( + function (d, i) { + d3.select(this).attr('d', transform.pathFromGeojson) + } + ) + } + + // 鑾峰彇鏁版嵁搴撶湡瀹炴暟鎹� + function getReallyData() { + let url = window.location.protocol + "//" + window.location.host + "/bjfw/system/project"; + $.get(url,function(res){ + var data = res.projects; + showProjectPoint(data); + }) + } + //鍦板浘涓婂睍绀洪」鐩偣 + function showProjectPoint(data){ + var projectIcon = new T.Icon({ + iconUrl: '/bjfw/images/icon/6.png', + iconSize: new T.Point(30, 30), + iconAnchor: new T.Point(6, 40), + }); + for(let i =0;i<data.length;i++){ + let lng = data[i].lng; + let lat = data[i].lat; + let marker = new T.Marker(new T.LngLat(lng, lat), { title: "鍦哄湴浣嶇疆",icon:projectIcon}); + let proj = infoWindowProject(data[i]); + addClickHandler(proj, marker); + map.addOverLay(marker); + } + + } + + function infoWindowProject(e){ + + let ids = e.ids + ""; + var sContent = + "<div style='margin:0px;'>" + + "<div>" + + "<div style='margin:1px 0px 1px 2px;width: 200px;'>" + + "<font style='font-weight: bolder;'>鍦哄湴缂栧彿 :</font>" + e.code + "<br>" + + "<font style='font-weight: bolder;'>鍦哄湴鍚嶅瓧 :</font>" + e.fullName + "<br>" + + "<font style='font-weight: bolder;'>璐熻矗浜� :</font>" + e.leader + "<br>" + + "<a class='btn' onclick=viewdata(" +"'" + ids+ "'" + ")>鍦哄湴鏁版嵁</a>" + + "</div>" + + "</div>" + + "</div>"; + return sContent; + } + function viewdata (id) { + $.modal.openTab("鍦哄湴瀵艰埅",ctx+ "/geo/project/navigate?ids="+id); + } + + function addClickHandler(content, marker) { + marker.addEventListener("click", function (e) { + openInfo(content, e) + }); + } + + function openInfo(content, e) { + var point = e.lnglat; + var markerInfoWin = new T.InfoWindow(content, { offset: new T.Point(0, -30) }); // 鍒涘缓淇℃伅绐楀彛瀵硅薄 + map.openInfoWindow(markerInfoWin, point); //寮�鍚俊鎭獥鍙� + } + + //鎬昏繘搴︿华琛ㄧ洏 + function totalProcess() { + var Chart1 = echarts.init(document.getElementById('Chart1')); + var pointerData = 0; // 浠〃鎸囬拡鏁版嵁 + let url = ctx + "/system/totalProcess"; + $.ajaxSettings.async = false; + $.get(url,{},function(res){ + pointerData = res.pointerData; + pointerData = (pointerData*100).toFixed(0); + }) + $.ajaxSettings.async = false; + var option = { + backgroundColor: "#fff", + series: [ + { + type: "gauge", + radius: 80, + z: 1, + startAngle: 225, + endAngle: -45, + splitNumber: 50, + title: { + color: "red", + }, + splitLine: { + show: true, + length: 15, + distance: -10, + lineStyle: { + color: "#fff", + width: 1, + }, + }, + detail: { + show: true, + offsetCenter: [0, 60], + fontSize: 22, + formatter: (val) => [`{a|${val}}`, `{b|%}`].join(""), + rich: { + a: { + fontSize: 20, + color: "rgba(84, 108, 198, 0.65)", + }, + b: { + fontSize: 24, + color: "rgba(84, 108, 198, 0.65)", + }, + }, + }, + // 浠〃鐩樼殑绾匡紝棰滆壊鍊间负涓�涓暟缁� + axisLine: { + show: true, + // 涓ょ鏄惁璁剧疆涓哄渾瑙掞紱鍦�5.0涔嬪悗鐨勭増鏈湁鏁� + roundCap: false, + lineStyle: { + width: 15, + shadowColor: "#0093ee", //榛樿閫忔槑 + shadowOffsetX: 0, + shadowOffsetY: 0, + shadowBlur: 20, + opacity: 1, + color: [ + [ + pointerData / 100, + { + x: 0, + y: 0, + x1: 1, + y1: 0, + colorStops: [ + { + offset: 0, + color: "rgba(0, 255, 255, 0.6)", + }, + { + offset: 1, + color: "rgba(0, 0, 255, .6)", + }, + ], + }, + ], + [1, "rgba(0,0,0,0.15)"], + ], + }, + }, + // 浠〃鐩樺埢搴︽爣绛� + axisLabel: { + show: true, + color: "rgba(84, 108, 198, 0.65)", + fontSize: 14, + distance: 20, + formatter: (val) => { + const num = Math.floor(val); + return num % 20 === 0 ? num : ""; + }, + }, + // 鍒诲害 + axisTick: { + show: false, + }, + // 鎸囬拡锛屾璁剧疆浠呭5.0浠ヤ笂鐨勭増鏈敓鏁� + anchor: { + show: true, + icon: "circle", + showAbove: true, + size: 20, + itemStyle: { + borderWidth: 6, + borderColor: "rgba(84, 108, 198, 0.85)", + }, + }, + data: [pointerData], + }, + { + // 鑳屾櫙娓愬彉鑹� + type: "pie", + radius: "80%", + // 涓嶅搷搴斿強瑙﹀彂榧犳爣浜嬩欢 + silent: true, + // 鍏抽棴鑳屾櫙鍔ㄧ敾 + animation: false, + z: 0, + itemStyle: { + color: { + type: "radial", // 寰勫悜娓愬彉 + x: 0.5, + y: 0.5, + r: 0.25, + colorStops: [ + { + offset: 0, + color: "rgba(84, 103, 198, 0.6)", + }, + { + offset: 0.1, + color: "rgba(84, 103, 198, 0.35)", + }, + { + offset: 1, + color: "rgba(84, 103, 198, 0)", + }, + ], + }, + }, + data: [pointerData], + }, + ], + }; + Chart1.setOption(option); + } + + + + + +</script> + +</body> +</html> diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/bg2.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/bg2.png new file mode 100644 index 0000000..f311c7f --- /dev/null +++ b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/bg2.png Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass.png deleted file mode 100644 index 1935578..0000000 --- a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass.png +++ /dev/null Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass1.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass1.png deleted file mode 100644 index bc63a0a..0000000 --- a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/pass1.png +++ /dev/null Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/password1.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/password1.png new file mode 100644 index 0000000..21c530f --- /dev/null +++ b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/password1.png Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user1.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user1.png new file mode 100644 index 0000000..b307a85 --- /dev/null +++ b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user1.png Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user2.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user2.png deleted file mode 100644 index a6fb053..0000000 --- a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user2.png +++ /dev/null Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user3.png b/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user3.png deleted file mode 100644 index 2e90a68..0000000 --- a/javaweb-plus/javaweb-cms/src/main/resources/static/images/loginPage/user3.png +++ /dev/null Binary files differ diff --git a/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/login.html b/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/login.html index 98b9c13..38206f8 100644 --- a/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/login.html +++ b/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/login.html @@ -16,10 +16,12 @@ if(window.top!==window.self){window.top.location=window.location}; </script> <style> - body,html{color:#000;margin:0;overflow:hidden;font:400 13px arial,Microsoft Yahei!important}a{font-size:inherit;text-decoration:none;color:#666;cursor:pointer} + body,html{color:#000;margin:0;overflow:hidden;font:400 13px arial,Microsoft Yahei!important} + a{font-size:inherit;text-decoration:none;color:#666;cursor:pointer} .txt{width:90%;padding:4px 20px;border-radius:22px;border:solid 1px #ccc;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:3.6em;outline:0} .txt:focus{border-color:#4386f5}.button{background:#4386f5;color:#fff;padding:6px 0;height:25px;line-height:25px;border-radius:5px;width:90%;border-radius:22px;display:inline-block;cursor:pointer} - .container{text-align:center; + .container{ + /*text-align:center;*/ /*width:400px;*/ margin:0 auto; /*height:362px;*/ @@ -48,7 +50,7 @@ } #logo-text .logo-dot{width:68px;height:6px;display:inline-block;position:absolute;left:50%;top:50%;margin-left:-34px;margin-top:-3px;display:none}#logo-text .logo-dot:after{width:6px;background:#4386f5;height:6px;display:inline-block;position:absolute;right:-4px;border-radius:50%;content:""}#logo-text label{display:inline-block;background:#4386f5;border-radius:50%;color:#fff;padding:11px 8px;margin-left:6px;position:relative;box-shadow:1px 1px 6px #ccc}.login-input{position:relative}.login-input a{position:absolute;right:33px;top:13px;width:auto;height:20px;line-height:20px;text-align:right;color:#888;z-index:1}.weixin-con{display:none;padding:15px;background:#fff;position:absolute;z-index:9;width:362px;height:410px;left:50%;top:50%;margin-left:-181px;margin-top:-205px;text-align:center;border-raidus:5px;box-shadow:1px 1px 4px #ccc}.error-tip{height:30px;line-height:30px;position:absolute;right:32px;color:red;bottom:6px;font-size:12px;z-index:2;background:#fff}.success-tip{position:absolute;width:194px;top:155px;display:none;right:96px;padding:5px 8px;border:1px solid green;border-radius:3px;box-shadow:1px 1px 5px #d6e9c6;background-color:#dff0d8;color:#468847;text-shadow:0 1px 0 rgba(255,255,255,.5)}.icons{background:url(/resources/images/login_processon.png) no-repeat;display:inline-block;width:42px;height:42px;cursor:pointer;}.icons.weixin{background-position:0 0;background-size:42px}.icons.qq{background-position:0 -85px;background-size:43px}.icons.weibo{background-position:0 -131px;background-size:44px}.icons.google{background-position:0 -45px;background-size:44px}.icons.somemore{border-radius:100%;border:1px solid #ddd;background-position:-1px -165px;background-size:42px;width:38px;height:38px}.icons.somemore:hover{-webkit-box-shadow:inset 0 0 1px rgba(0,0,0,.2);-moz-box-shadow:inset 0 0 1px rgba(0,0,0,.2);box-shadow:inset 0 0 1px rgba(0,0,0,.2);cursor:pointer}.morelogo-con{background-color:#fff;padding:10px;position:absolute;left:249px;opacity:0;top:30px;z-index:3;border-radius:5px;box-shadow:0 1px 2px 0 rgba(0,0,0,.2);-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}.morelogo-con.popover{opacity:1;top:45px}.morelogo-con>span{display:block;font-size:13px;color:#3d474d}.morelogo-con .mingdao{display:inline-block;vertical-align:middle;background-position:0 -257px;background-size:44px;margin-right:11px}.rotate{animation:.8s infinite rotate;-webkit-animation:.8s infinite rotate;-o-animation:.8s infinite rotate;-moz-animation:.8s infinite rotate;-ms-animation:.8s infinite rotate}@-webkit-keyframes rotate{from{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(360deg)}}@-moz-keyframes rotate{from{-moz-transform:rotate(0)}to{-moz-transform:rotate(360deg)}}@-ms-keyframes rotate{from{-ms-transform:rotate(0)}to{-ms-transform:rotate(360deg)}}@-o-keyframes rotate{from{-o-transform:rotate(0)}to{-o-transform:rotate(360deg)}}@keyframes rotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}.bind{width:600px;margin-left:-300px}.bind .button,.bind .txt{width:55%}.bind #logo-text{vertical-align:-7px}.bind .icons{background:url(/resources/images/login_processon.png) no-repeat;display:inline-block;width:74px;height:74px;vertical-align:top}.bind .icons.weixin{background-position:0 0;background-size:70px;width:70px;height:68px}.bind .icons.qq{background-position:0 -141px;background-size:70px;width:70px;height:68px}.bind .icons.weibo{background-position:0 -211px;background-size:70px;width:70px;height:68px}.bind .icons.google{background-position:0 -73px;background-size:70px;width:70px;height:68px}.bind_item{position:relative}.bind-arrow{margin-left:30px;display:inline-block;position:relative;color:#666;margin-right:30px}.bind-tip{margin-top:40px}.des{margin-top:10px;font-size:14px}@media screen and (max-width:760px){.page-con{width:100%;left:0;margin-left:0}} body{ - background-image :url(images/loginPage/bg0521.png); + background-image :url(images/loginPage/bg2.png); background-size:100% 100%; } html,body{ @@ -60,21 +62,21 @@ } #logo-text{ /*color: rgba(51, 51, 51, 1);*/ - font-size: 32px; + font-size: 36px; /*margin-left: 25px;*/ - color: #065deb; + color: #000000; /*margin-bottom: 20px;*/ } .container{ width: 495px; height: 621px; border-radius: 24px; - background-color: #ffffff; - box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05); + /*background-color: #ffffff;*/ + /*box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05);*/ border-width: 0px; margin-left: 0px; /*text-align: left;*/ - left: 60%; + left: 70%; padding: 0px; color: white; } @@ -91,31 +93,32 @@ .txt{ border-radius: 0px; border-width: 0px; - font-size: 18px; + font-size: 26px; padding: 0px 0px 0px 10px; height: 45px; } .input-container{ /*border-bottom: 1px solid rgba(187, 187, 187, 1);*/ - margin: auto; + /*margin: auto;*/ box-sizing: border-box; - width:340px; + width:418px; height:60px; - border:1px solid #065deb; - padding: 18px 28px 18px 28px; - border-radius: 10px; + border-bottom:1px solid #999999; + /*padding: 18px 28px 18px 28px;*/ + padding: 10px 0px; + /*border-radius: 10px;*/ display: flex; align-items: center; } #signin_btn{ - width: 340px; - height: 60px; - line-height: 60px; + width: 418px; + height: 88px; + line-height: 88px; border-radius: 10px; - background-color: #065deb; + background-color: #008BFD; /*background-color: rgba(94, 131, 248, 1);*/ color: rgba(255, 255, 255, 1); - font-size: 20px; + font-size: 24px; text-align: center; padding: 0px; } @@ -145,15 +148,15 @@ <span class="bar-line"></span> <form name="loginform" id="loginform"> <input type="hidden" id="redirectUrl" name="redirectUrl" value="${redirectUrl}" > - <div><span id="logo-text">鍖椾含甯傚湴闈㈡矇闄嶇洃娴嬬綉寤鸿宸ョ▼</span></div> + <div><span id="logo-text">鎮ㄥソ锛屾杩庣櫥褰曪紒</span></div> <div style="width:100%"> <div class="input-container" style="margin-top:124px;position:relative;"> - <img src="images/loginPage/user0521.png" style="margin-right:5px;"/> + <img src="images/loginPage/user1.png" style="margin-right:5px;"/> <input id="username" name="username" class="txt" value="admin" type="text" autocomplete="off" placeholder="璇疯緭鍏ョ敤鎴峰悕/閭" > <div class="error-tip"></div> </div> <div class="login-input input-container" style="margin-top:42px;position:relative;"> - <img class="password-icon" src="images/loginPage/pass0521.png"style="margin-top:-5px"/> + <img class="password-icon" src="images/loginPage/password1.png"style="margin-top:-5px"/> <input name="password" id="password" value="admin123" class="txt" type="password" placeholder="璇疯緭鍏ョ櫥褰曞瘑鐮�" autocomplete="off" > <div class="error-tip"></div> </div> diff --git a/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/logincopy.html b/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/logincopy.html new file mode 100644 index 0000000..98b9c13 --- /dev/null +++ b/javaweb-plus/javaweb-cms/src/main/resources/templates/loginPage/process/logincopy.html @@ -0,0 +1,211 @@ +<!DOCTYPE html> +<html lang="zh" xmlns:th="http://www.thymeleaf.org"> +<head> + <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> + <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" name="viewport" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> + <title>閽绘帰宸ョ▼淇℃伅鍖栫郴缁�</title> + <meta name="description" content="閽绘帰宸ョ▼淇℃伅鍖栫郴缁�"> + <!--[if lt IE 9]> + <meta http-equiv="refresh" content="0;ie.html" /> + <![endif]--> + <link rel="shortcut icon" href="../static/favicon.ico" th:href="@{favicon.ico}"/> + <style type="text/css">label.error { position:inherit; }</style> + <script> + if(window.top!==window.self){window.top.location=window.location}; + </script> + <style> + body,html{color:#000;margin:0;overflow:hidden;font:400 13px arial,Microsoft Yahei!important}a{font-size:inherit;text-decoration:none;color:#666;cursor:pointer} + .txt{width:90%;padding:4px 20px;border-radius:22px;border:solid 1px #ccc;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:3.6em;outline:0} + .txt:focus{border-color:#4386f5}.button{background:#4386f5;color:#fff;padding:6px 0;height:25px;line-height:25px;border-radius:5px;width:90%;border-radius:22px;display:inline-block;cursor:pointer} + .container{text-align:center; + /*width:400px;*/ + margin:0 auto; + /*height:362px;*/ + position:absolute; + top:30%; + margin-top:-181px; + /*left:50%;*/ + margin-left:-200px; + /*background-color:#fff;*/ + /*padding:27px;*/ + /*border-radius:5px;*/ + /*border:1px solid #e8e1e1;*/ + } + .page-con .sep{border-top:1px solid #ddd;height:20px;text-align:center} + .page-con label{color:#666;display:inline-block;padding:0 10px;} + .page-con .signup{font-size:12px;margin-top:19px;color:#666;text-align:left;padding-left:26px} + .page-con .signup a{color:#333}#bg-canvas{position:absolute;z-index:-1} + #logo-text{ + display:inline-block; + /*margin-left:8px;*/ + font-size:35px; + vertical-align:7px; + font-family:arial; + /*height:60px;*/ + text-shadow:1px 1px 2px #bbb inset + } + #logo-text .logo-dot{width:68px;height:6px;display:inline-block;position:absolute;left:50%;top:50%;margin-left:-34px;margin-top:-3px;display:none}#logo-text .logo-dot:after{width:6px;background:#4386f5;height:6px;display:inline-block;position:absolute;right:-4px;border-radius:50%;content:""}#logo-text label{display:inline-block;background:#4386f5;border-radius:50%;color:#fff;padding:11px 8px;margin-left:6px;position:relative;box-shadow:1px 1px 6px #ccc}.login-input{position:relative}.login-input a{position:absolute;right:33px;top:13px;width:auto;height:20px;line-height:20px;text-align:right;color:#888;z-index:1}.weixin-con{display:none;padding:15px;background:#fff;position:absolute;z-index:9;width:362px;height:410px;left:50%;top:50%;margin-left:-181px;margin-top:-205px;text-align:center;border-raidus:5px;box-shadow:1px 1px 4px #ccc}.error-tip{height:30px;line-height:30px;position:absolute;right:32px;color:red;bottom:6px;font-size:12px;z-index:2;background:#fff}.success-tip{position:absolute;width:194px;top:155px;display:none;right:96px;padding:5px 8px;border:1px solid green;border-radius:3px;box-shadow:1px 1px 5px #d6e9c6;background-color:#dff0d8;color:#468847;text-shadow:0 1px 0 rgba(255,255,255,.5)}.icons{background:url(/resources/images/login_processon.png) no-repeat;display:inline-block;width:42px;height:42px;cursor:pointer;}.icons.weixin{background-position:0 0;background-size:42px}.icons.qq{background-position:0 -85px;background-size:43px}.icons.weibo{background-position:0 -131px;background-size:44px}.icons.google{background-position:0 -45px;background-size:44px}.icons.somemore{border-radius:100%;border:1px solid #ddd;background-position:-1px -165px;background-size:42px;width:38px;height:38px}.icons.somemore:hover{-webkit-box-shadow:inset 0 0 1px rgba(0,0,0,.2);-moz-box-shadow:inset 0 0 1px rgba(0,0,0,.2);box-shadow:inset 0 0 1px rgba(0,0,0,.2);cursor:pointer}.morelogo-con{background-color:#fff;padding:10px;position:absolute;left:249px;opacity:0;top:30px;z-index:3;border-radius:5px;box-shadow:0 1px 2px 0 rgba(0,0,0,.2);-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}.morelogo-con.popover{opacity:1;top:45px}.morelogo-con>span{display:block;font-size:13px;color:#3d474d}.morelogo-con .mingdao{display:inline-block;vertical-align:middle;background-position:0 -257px;background-size:44px;margin-right:11px}.rotate{animation:.8s infinite rotate;-webkit-animation:.8s infinite rotate;-o-animation:.8s infinite rotate;-moz-animation:.8s infinite rotate;-ms-animation:.8s infinite rotate}@-webkit-keyframes rotate{from{-webkit-transform:rotate(0)}to{-webkit-transform:rotate(360deg)}}@-moz-keyframes rotate{from{-moz-transform:rotate(0)}to{-moz-transform:rotate(360deg)}}@-ms-keyframes rotate{from{-ms-transform:rotate(0)}to{-ms-transform:rotate(360deg)}}@-o-keyframes rotate{from{-o-transform:rotate(0)}to{-o-transform:rotate(360deg)}}@keyframes rotate{from{transform:rotate(0)}to{transform:rotate(360deg)}}.bind{width:600px;margin-left:-300px}.bind .button,.bind .txt{width:55%}.bind #logo-text{vertical-align:-7px}.bind .icons{background:url(/resources/images/login_processon.png) no-repeat;display:inline-block;width:74px;height:74px;vertical-align:top}.bind .icons.weixin{background-position:0 0;background-size:70px;width:70px;height:68px}.bind .icons.qq{background-position:0 -141px;background-size:70px;width:70px;height:68px}.bind .icons.weibo{background-position:0 -211px;background-size:70px;width:70px;height:68px}.bind .icons.google{background-position:0 -73px;background-size:70px;width:70px;height:68px}.bind_item{position:relative}.bind-arrow{margin-left:30px;display:inline-block;position:relative;color:#666;margin-right:30px}.bind-tip{margin-top:40px}.des{margin-top:10px;font-size:14px}@media screen and (max-width:760px){.page-con{width:100%;left:0;margin-left:0}} + body{ + background-image :url(images/loginPage/bg0521.png); + background-size:100% 100%; + } + html,body{ + height: 100%; + touch-action: manipulation; + } + html { + touch-action: manipulation; + } + #logo-text{ + /*color: rgba(51, 51, 51, 1);*/ + font-size: 32px; + /*margin-left: 25px;*/ + color: #065deb; + /*margin-bottom: 20px;*/ + } + .container{ + width: 495px; + height: 621px; + border-radius: 24px; + background-color: #ffffff; + box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05); + border-width: 0px; + margin-left: 0px; + /*text-align: left;*/ + left: 60%; + padding: 0px; + color: white; + } + .page-con{ + padding:20px; + } + .bar-line{ + display: block; + width: 66px; + height: 8px; + background-color: rgba(64, 149, 229, 0); + margin-bottom: 27px; + } + .txt{ + border-radius: 0px; + border-width: 0px; + font-size: 18px; + padding: 0px 0px 0px 10px; + height: 45px; + } + .input-container{ + /*border-bottom: 1px solid rgba(187, 187, 187, 1);*/ + margin: auto; + box-sizing: border-box; + width:340px; + height:60px; + border:1px solid #065deb; + padding: 18px 28px 18px 28px; + border-radius: 10px; + display: flex; + align-items: center; + } + #signin_btn{ + width: 340px; + height: 60px; + line-height: 60px; + border-radius: 10px; + background-color: #065deb; + /*background-color: rgba(94, 131, 248, 1);*/ + color: rgba(255, 255, 255, 1); + font-size: 20px; + text-align: center; + padding: 0px; + } + .signup{ + display: none; + } + .password-icon{ + position: relative; + top: 4px; + margin-right: 5px; + } + .verification-icon{ + position: absolute; + left: 0px; + top: 5px; + width: 28px; + } + .validate-line{ + border-bottom: 1px solid rgba(187, 187, 187, 0); + } + </style> +</head> + +<body> +<div class="container"> + <div class="page-con" > + <span class="bar-line"></span> + <form name="loginform" id="loginform"> + <input type="hidden" id="redirectUrl" name="redirectUrl" value="${redirectUrl}" > + <div><span id="logo-text">鍖椾含甯傚湴闈㈡矇闄嶇洃娴嬬綉寤鸿宸ョ▼</span></div> + <div style="width:100%"> + <div class="input-container" style="margin-top:124px;position:relative;"> + <img src="images/loginPage/user0521.png" style="margin-right:5px;"/> + <input id="username" name="username" class="txt" value="admin" type="text" autocomplete="off" placeholder="璇疯緭鍏ョ敤鎴峰悕/閭" > + <div class="error-tip"></div> + </div> + <div class="login-input input-container" style="margin-top:42px;position:relative;"> + <img class="password-icon" src="images/loginPage/pass0521.png"style="margin-top:-5px"/> + <input name="password" id="password" value="admin123" class="txt" type="password" placeholder="璇疯緭鍏ョ櫥褰曞瘑鐮�" autocomplete="off" > + <div class="error-tip"></div> + </div> + + <div style="margin-top:25px;position:relative;" th:if="${captchaEnabled==true}"> + <img class="verification-icon" src="images/loginPage/validate.svg" /> + <input name="validateCode" id="validateCode" style="float: left;margin-left: 30px;width: 230px;" class="txt" type="text" placeholder="楠岃瘉鐮�" /> + <a href="javascript:void(0);" title="鐐瑰嚮鏇存崲楠岃瘉鐮�"> + <img th:src="@{captcha/captchaImage(type=${captchaType})}" class="radius imgcode" width="100" height="30" style="position:absolute;right:40px;top:7px;"/> + </a> + <div style="display: inline-block;float: left;position: relative;top:10px;right: 150px;" class="error-tip"></div> + </div> + </div> + + <div class="validate-line" style="clear:both;"></div> + <div style="margin-top:96px;"> + <span id="signin_btn" onclick="login.login();" class="button">鐧诲綍</span> + </div> + <div class="signup"> + <label for="rememberMe" style="float:right;margin-right: 15px;color:#000;" > + <input type="checkbox" id="rememberMe" name="rememberMe" >璁颁綇瀵嗙爜</label> + </div> + </form> + + </div> +</div> + +<div class="weixin-con" id="weixin_dlg"><div style="margin-top:200px;">鍔犺浇涓�...</div></div> + +<script th:inline="javascript"> var ctx = [[@{/}]]; var captchaType = [[${captchaType}]];var captchaEnabled= [[${captchaEnabled}]]; </script> +<script th:src="@{/js/jquery.min.js}"></script> +<script th:src="@{/ajax/libs/layer/layer.min.js}"></script> +<script th:src="@{/ajax/libs/blockUI/jquery.blockUI.js}"></script> +<script th:src="@{/ruoyi/js/ry-ui.js?v=4.1.0}"></script> +<script th:src="@{/ajax/libs/encrypt/jsencrypt.min.js}"></script> +<script th:src="@{/loginPage/process/login.js}"></script> + +<script type="text/javascript"> + window.addEventListener('wheel', function (event) { + if (event.ctrlKey === true || event.metaKey) { + event.preventDefault(); + } + }, { passive: false }); + + //firefox + window.addEventListener('DOMMouseScroll', function (event) { + if (event.ctrlKey === true || event.metaKey) { + event.preventDefault(); + } + }, { passive: false }) + +</script> + +</body> +</html> -- Gitblit v1.9.1