@@ -0,0 +1,336 @@ | |||||
.main{ | |||||
background: url("../../images/bigData_bg.png") no-repeat center; | |||||
background-size: 100% 100%; | |||||
width: 100vw; | |||||
height: 100vh; | |||||
overflow: hidden; | |||||
} | |||||
#userLogin{ | |||||
padding: 0!important; | |||||
} | |||||
.logoData{ | |||||
position: absolute; | |||||
top: 4vh; | |||||
left: 1vw; | |||||
} | |||||
.time{ | |||||
display: flex; | |||||
align-items: center; | |||||
position: absolute; | |||||
top: 4vh; | |||||
right: 1vw; | |||||
color: #2d8bff; | |||||
} | |||||
.time div:nth-child(1){ | |||||
background: url("../../images/rl.png") no-repeat ; | |||||
padding-left: 30px; | |||||
} | |||||
.time div:nth-child(2){ | |||||
background: url("../../images/sz.png") no-repeat ; | |||||
padding-left: 30px; | |||||
margin: 0 15px; | |||||
} | |||||
.head{ | |||||
background: url("../../images/head_bg.png") no-repeat center; | |||||
width: 100vw; | |||||
height: 10vh; | |||||
position: relative; | |||||
} | |||||
.head_bg{ | |||||
background: url("../../images/head_bg_animal.png") no-repeat center; | |||||
width: 100vw; | |||||
height: 10vh; | |||||
animation: 2s opacity 0.1s infinite; | |||||
position: absolute; | |||||
} | |||||
.head_tit{ | |||||
font-size: 2.45rem; | |||||
text-align: center; | |||||
color: #ffffff; | |||||
font-weight: bold; | |||||
} | |||||
.xuanzhuan { | |||||
-webkit-transition-property: -webkit-transform; | |||||
-webkit-transition-duration: 1s; | |||||
-moz-transition-property: -moz-transform; | |||||
-moz-transition-duration: 1s; | |||||
-webkit-animation: rotate 3s linear infinite; | |||||
-moz-animation: rotate 3s linear infinite; | |||||
-o-animation: rotate 3s linear infinite; | |||||
animation: rotate 3s linear infinite; | |||||
} | |||||
.horizontal { | |||||
display: flex; | |||||
position: absolute; | |||||
right: 32vw; | |||||
top: 4vh; | |||||
} | |||||
.axis { | |||||
width: 1.8vw; | |||||
height: 4vh; | |||||
background: url('../../images/headline_hz.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
margin-left: -.45vw; | |||||
} | |||||
.horizontal1 { | |||||
display: flex; | |||||
position: absolute; | |||||
left: 32vw; | |||||
top: 4vh; | |||||
} | |||||
.axis1 { | |||||
width: 1.8vw; | |||||
height: 4vh; | |||||
background: url('../../images/headline_hz1.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
margin-left: -.45vw; | |||||
} | |||||
.anmia1 { | |||||
opacity: 1; | |||||
animation: 2s horizontalAnmia1 0.1s infinite; | |||||
} | |||||
.anmia2 { | |||||
opacity: 0.5; | |||||
animation: 2s horizontalAnmia2 0.1s infinite; | |||||
} | |||||
.anmia3 { | |||||
opacity: 0; | |||||
animation: 2s horizontalAnmia3 0.1s infinite; | |||||
} | |||||
.tab_main{ | |||||
display: flex; | |||||
align-items: center; | |||||
margin: 15px 0; | |||||
} | |||||
.tab_main div{ | |||||
width: 6vw; | |||||
height: 3vh; | |||||
margin-right: 1vw; | |||||
cursor: pointer; | |||||
} | |||||
.tab_main div:hover img{ | |||||
display: block!important; | |||||
} | |||||
.tab1{ | |||||
background: url('../../images/icon_jj_01.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tab2{ | |||||
background: url('../../images/icon_jj_02.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tab3{ | |||||
background: url('../../images/icon_jj_03.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tab4{ | |||||
background: url('../../images/icon_jj_04.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tab5{ | |||||
background: url('../../images/icon_jj_05.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tab6{ | |||||
background: url('../../images/icon_jj_06.png') no-repeat; | |||||
background-size: 100% 100%; | |||||
} | |||||
.tableList{ | |||||
width: 100%!important; | |||||
height: calc(100vh - 130px - 3vh - 10vh)!important; | |||||
} | |||||
.tableList table tr:nth-child(odd){ | |||||
background-color: #13225e!important; | |||||
} | |||||
.tableList table tr td{ | |||||
color: #ffffff; | |||||
} | |||||
.tableHead{ | |||||
background: #133194!important; | |||||
color: #ffffff!important; | |||||
margin-top: 0!important; | |||||
} | |||||
.tableType{ | |||||
background: #133194!important; | |||||
} | |||||
.bidding input[type='button']{ | |||||
border-color: #ffffff; | |||||
color: #ffffff; | |||||
} | |||||
.select_main{ | |||||
/*border: 10px solid transparent!important;*/ | |||||
/*-webkit-border-image: url(../../images/border_img.png) 1 stretch; !* Safari 3.1-5 *!*/ | |||||
/*-o-border-image: url(../../images/border_img.png) 1 stretch; !* Opera 11-12.1 *!*/ | |||||
} | |||||
select{ | |||||
color: #2d8bff; | |||||
border-image: url(../../images/border_img.png) 3 stretch!important; | |||||
margin-left: 1vw; | |||||
} | |||||
.tab_select{ | |||||
display: flex; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
width: 98%; | |||||
margin: 0 auto; | |||||
} | |||||
.bidding{ | |||||
width: 98%; | |||||
margin: 0 auto; | |||||
} | |||||
.tableType p{ | |||||
color: #ffffff!important; | |||||
} | |||||
@keyframes horizontalAnmia1 { | |||||
0% { | |||||
opacity: 1; | |||||
} | |||||
50% { | |||||
opacity: 0; | |||||
} | |||||
100% { | |||||
opacity: 1; | |||||
} | |||||
} | |||||
@keyframes horizontalAnmia2 { | |||||
0% { | |||||
opacity: 0.5; | |||||
} | |||||
25% { | |||||
opacity: 1; | |||||
} | |||||
75% { | |||||
opacity: 0; | |||||
} | |||||
100% { | |||||
opacity: 0.5; | |||||
} | |||||
} | |||||
@keyframes horizontalAnmia3 { | |||||
0% { | |||||
opacity: 0; | |||||
} | |||||
50% { | |||||
opacity: 1; | |||||
} | |||||
100% { | |||||
opacity: 0; | |||||
} | |||||
} | |||||
@-webkit-keyframes rotate { | |||||
from { | |||||
-webkit-transform: rotate(0deg) | |||||
} | |||||
to { | |||||
-webkit-transform: rotate(360deg) | |||||
} | |||||
} | |||||
@-moz-keyframes rotate { | |||||
from { | |||||
-moz-transform: rotate(0deg) | |||||
} | |||||
to { | |||||
-moz-transform: rotate(359deg) | |||||
} | |||||
} | |||||
@-o-keyframes rotate { | |||||
from { | |||||
-o-transform: rotate(0deg) | |||||
} | |||||
to { | |||||
-o-transform: rotate(359deg) | |||||
} | |||||
} | |||||
@keyframes rotate { | |||||
from { | |||||
transform: rotate(0deg) | |||||
} | |||||
to { | |||||
transform: rotate(359deg) | |||||
} | |||||
} | |||||
@-webkit-keyframes opacity { | |||||
0% { | |||||
opacity: 1; | |||||
} | |||||
50% { | |||||
opacity: 0.5; | |||||
} | |||||
100% { | |||||
opacity: 1; | |||||
} | |||||
} | |||||
@-moz-keyframes opacity { | |||||
0% { | |||||
opacity: 1; | |||||
} | |||||
50% { | |||||
opacity: 0.5; | |||||
} | |||||
100% { | |||||
opacity: 1; | |||||
} | |||||
} | |||||
@-o-keyframes opacity { | |||||
0% { | |||||
opacity: 1; | |||||
} | |||||
50% { | |||||
opacity: 0.5; | |||||
} | |||||
100% { | |||||
opacity: 1; | |||||
} | |||||
} | |||||
@keyframes opacity { | |||||
0% { | |||||
opacity: 1; | |||||
} | |||||
50% { | |||||
opacity: 0.5; | |||||
} | |||||
100% { | |||||
opacity: 1; | |||||
} | |||||
} |
@@ -0,0 +1,87 @@ | |||||
/** | |||||
* Created by Administrator on 2021/4/5. | |||||
*/ | |||||
define(['jquery', "template", "Tools"], function ($, template, Tools ) { | |||||
//数据存储 | |||||
var module = { | |||||
data: { | |||||
}, | |||||
}; | |||||
var tools = new Tools(); | |||||
module.init = function (page) { | |||||
//查询挂牌项目浏览总次数 | |||||
tools.doGet(biddingHallList + '/0/10', {}, module.biddingHallList, true); | |||||
//竞价大厅-滚动 | |||||
// module.hallRolling(); | |||||
}; | |||||
//竞价大厅列表 | |||||
module.biddingHallList = function (data) { | |||||
if (data.code == 200) { | |||||
var content = data.data; | |||||
//console.log(content) | |||||
module.data.biddingHallListList = content; | |||||
for(var i = 0 ; i < content.length ; i++){ | |||||
if(content[i].biddingStopTime == null || content[i].biddingStartTime == null){continue;} | |||||
var endTimes=content[i].biddingStopTime.substring(0,10).split('-'); | |||||
var biddingStopTime=endTimes[1]+'/'+endTimes[2]+'/'+endTimes[0]+' '+content[i].biddingStopTime.substring(10,19); | |||||
var startTimes=content[i].biddingStartTime.substring(0,10).split('-'); | |||||
var biddingStartTime=startTimes[1]+'/'+startTimes[2]+'/'+startTimes[0]+' '+content[i].biddingStartTime.substring(10,19); | |||||
var nowTime = Date.parse(new Date()); | |||||
var leftTime = Date.parse(biddingStopTime)-nowTime; | |||||
var rightTime = Date.parse(biddingStartTime)-nowTime; | |||||
//console.log(biddingStopTime) | |||||
//console.log(leftTime) | |||||
if(leftTime>0){ | |||||
//console.log('进行中') | |||||
content[i].timeType = '进行中' | |||||
} | |||||
if(leftTime<0){ | |||||
//console.log('已结束') | |||||
content[i].timeType = '已结束' | |||||
} | |||||
if(rightTime>0){ | |||||
//console.log('未开始') | |||||
content[i].timeType = '未开始' | |||||
} | |||||
} | |||||
//console.log(content) | |||||
var biddingHallListData = template('biddingHallListData', module.data); | |||||
$("#biddingHallListContent").html(biddingHallListData); | |||||
} | |||||
} | |||||
///竞价大厅-滚动 | |||||
module.hallRolling = function () { | |||||
var divScroll = document.getElementById('tableList'); | |||||
window.onmousewheel = divScroll.onmousewheel = function () { return false } | |||||
module.timeInter(divScroll); | |||||
divScroll.onmouseover = function () { | |||||
clearInterval(time); | |||||
} | |||||
divScroll.onmouseout = function () { | |||||
module.timeInter(divScroll); | |||||
} | |||||
} | |||||
module.timeInter = function (divScroll) { | |||||
time = setInterval(function () { | |||||
var oldTop = divScroll.scrollTop; | |||||
var newTop = oldTop + 1; | |||||
divScroll.scrollTop = newTop; | |||||
var counst = divScroll.scrollHeight - divScroll.scrollTop - divScroll.clientHeight; | |||||
if (1 > counst) { | |||||
divScroll.scrollTop = 0; | |||||
} | |||||
}, 30) | |||||
} | |||||
return module; | |||||
}); |
@@ -0,0 +1,112 @@ | |||||
<!DOCTYPE html | |||||
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |||||
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="zh-CN" xml:lang="zh-CN"> | |||||
<head> | |||||
<meta charset="utf-8"> | |||||
<title>农燊高科-新闻列表</title> | |||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |||||
<meta name="keywords" content="" /> | |||||
<meta name="description" cxontent="" /> | |||||
<link href="../../static/css/main.css" rel="stylesheet" type="text/css" /> | |||||
<link href="../../static/css/bidding/biddingBigData.css" rel="stylesheet" type="text/css" /> | |||||
<link href="../../static/css/index.css" rel="stylesheet" type="text/css" /> | |||||
</head> | |||||
<body> | |||||
<div class="main" id="page"> | |||||
<div id="userLogin" style="display: none;"></div> | |||||
<div id="userInfo" style="display: none;"></div> | |||||
<div class="head"> | |||||
<div class="head_bg"></div> | |||||
<p class="head_tit">竞价大厅</p> | |||||
<div class="horizontal"> | |||||
<div class="axis anmia1"></div> | |||||
<div class="axis anmia2"></div> | |||||
<div class="axis anmia3"></div> | |||||
</div> | |||||
<div class="horizontal1"> | |||||
<div class="axis1 anmia1"></div> | |||||
<div class="axis1 anmia2"></div> | |||||
<div class="axis1 anmia3"></div> | |||||
</div> | |||||
<img src="../../static/images/bigData_logo.png" alt="" class="logoData"> | |||||
<div class="time"> | |||||
<div>2023.03.20</div> | |||||
<div>13:44:00</div> | |||||
<img src="../../static/images/home.png" alt=""> | |||||
</div> | |||||
</div> | |||||
<div class="tab_select"> | |||||
<div class="tab_main"> | |||||
<div class="tab1"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
<div class="tab2"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
<div class="tab3"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
<div class="tab4"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
<div class="tab5"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
<div class="tab6"><img src="../../static/images/icon_jj_bg.png" alt="" style="width: 6vw;height: 3vh;display: none;"></div> | |||||
</div> | |||||
<div class="select_main"> | |||||
<select name=""> | |||||
<option value="">请选择地点</option> | |||||
<option value="">请选择1</option> | |||||
<option value="">请选择2</option> | |||||
<option value="">请选择3</option> | |||||
</select> | |||||
<select name=""> | |||||
<option value="">请选择类型</option> | |||||
<option value="">请选择1</option> | |||||
<option value="">请选择2</option> | |||||
<option value="">请选择3</option> | |||||
</select> | |||||
</div> | |||||
</div> | |||||
<div class="bidding"> | |||||
<table width="100%" class="tableHead" style="table-layout: fixed;" > | |||||
<tr> | |||||
<td>项目名称</td> | |||||
<td>竞价方式</td> | |||||
<td>报名截止时间</td> | |||||
<td>竞价开始时间</td> | |||||
<td>标的底价</td> | |||||
<td>当前报价</td> | |||||
<td>竞价剩余时间</td> | |||||
<td>操作</td> | |||||
</tr> | |||||
</table> | |||||
<div class="tableList" id="tableList"> | |||||
<script id="biddingHallListData" type="text/html"> | |||||
{{each biddingHallListList as value i}} | |||||
<tr class="{{value.timeType == '未开始' ? 'notStart-row':''}}{{value.timeType == '进行中' ? 'now-row':''}}"> | |||||
<td title="{{value.projectName}}">{{value.projectName}}</td> | |||||
<td>{{value.biddingType}}</td> | |||||
<td>{{value.signupStopTime}}</td> | |||||
<td>{{value.biddingStartTime}}</td> | |||||
<td>{{value.price}}</td> | |||||
<td>{{value.money}}</td> | |||||
<td>{{value.timeType}}</td> | |||||
<td><input type="button" onclick="goDetail({{value.id}})" value="我要竞价" /></td> | |||||
</tr> | |||||
{{/each}} | |||||
</script> | |||||
<table width="100%;" cellpadding="0" cellspacing="0" style="table-layout: fixed;" id="biddingHallListContent"></table> | |||||
</div> | |||||
<div class="tableType"> | |||||
<p><i></i>未开始</p> | |||||
<p><i></i>进行中</p> | |||||
<p><i></i>已结束</p> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</body> | |||||
<!--target-module="./static/js/project/index.js"--> | |||||
<script src="../../static/js/common/require.js" data-main="../../static/js/common/main.js?t=101" id="require-page" | |||||
target-module="../../static/js/project/bidding/biddingBigData.js" defer type="text/javascript"></script> | |||||
</html> |