@@ -70,4 +70,6 @@ var homePage = '/webSite/operators/homePage' //发布供求服务 | |||||
var productDetails = '/webSite/operators/productDetails' //产品分类子集查询 | var productDetails = '/webSite/operators/productDetails' //产品分类子集查询 | ||||
var supplyDetails = '/webSite/operators/supplyDetails' //产品分类子集查询 | |||||
var dictType = '/webSite/operators/data/type' //首页-字典查询 | var dictType = '/webSite/operators/data/type' //首页-字典查询 |
@@ -1,4 +1,4 @@ | |||||
var serverApi = 'http://192.168.31.104:8080'; | |||||
var serverApi = 'http://192.168.31.109:8080'; | |||||
var friendsLinksList = []; | var friendsLinksList = []; | ||||
var themeColor = ''; | var themeColor = ''; | ||||
var logo = ''; | var logo = ''; | ||||
@@ -0,0 +1,120 @@ | |||||
define(['jquery', "template", "Tools",'swiper',], function ($, template, Tools, swiper) { | |||||
//数据存储 | |||||
var module = { | |||||
data: { | |||||
//服务器地址 | |||||
serverApi: '', | |||||
trainStudentsList:[{ | |||||
name:'', | |||||
phone:'', | |||||
sex: '', | |||||
trainId:'' | |||||
}] | |||||
}, | |||||
}; | |||||
var tools = new Tools(); | |||||
module.init = function (page) { | |||||
//新闻管理列表 | |||||
tools.doGet(dictType + '/training_type', {}, module.dictType , true); | |||||
tools.doGet(dictType + '/apply_state', {}, function(data){module.data.studentsTypeOptions = data.data;} , true); | |||||
module.data.trainStudentsList[0].trainId = getQueryVariable('id'); | |||||
}; | |||||
module.dictType = function (data) { | |||||
module.data.trainingTypeOptions = data.data; | |||||
tools.doGet(supplyDetails + '/' + getQueryVariable('id'), {}, module.technologyTrainingDetails, true); | |||||
} | |||||
//获取地址栏参数 | |||||
function getQueryVariable(variable){ | |||||
var query = window.location.search.substring(1); | |||||
var vars = query.split("&"); | |||||
for (var i=0;i<vars.length;i++) { | |||||
var pair = vars[i].split("="); | |||||
if(pair[0] == variable){return pair[1];} | |||||
} | |||||
return(false); | |||||
} | |||||
//焦点图滚动 | |||||
module.swiperBanner = function (type) { | |||||
var viewSwiper = new Swiper('.view .swiper-container', { | |||||
onSlideChangeStart: function() { | |||||
updateNavPosition() | |||||
} | |||||
}) | |||||
$('.view .arrow-left,.preview .arrow-left').on('click', function(e) { | |||||
e.preventDefault() | |||||
if (viewSwiper.activeIndex == 0) { | |||||
viewSwiper.swipeTo(viewSwiper.slides.length - 1, 1000); | |||||
return | |||||
} | |||||
viewSwiper.swipePrev() | |||||
}) | |||||
$('.view .arrow-right,.preview .arrow-right').on('click', function(e) { | |||||
e.preventDefault() | |||||
if (viewSwiper.activeIndex == viewSwiper.slides.length - 1) { | |||||
viewSwiper.swipeTo(0, 1000); | |||||
return | |||||
} | |||||
viewSwiper.swipeNext() | |||||
}) | |||||
var previewSwiper = new Swiper('.preview .swiper-container', { | |||||
visibilityFullFit: true, | |||||
slidesPerView: 'auto', | |||||
onlyExternal: true, | |||||
onSlideClick: function() { | |||||
viewSwiper.swipeTo(previewSwiper.clickedSlideIndex) | |||||
} | |||||
}) | |||||
function updateNavPosition() { | |||||
$('.preview .active-nav').removeClass('active-nav') | |||||
var activeNav = $('.preview .swiper-slide').eq(viewSwiper.activeIndex).addClass('active-nav') | |||||
if (!activeNav.hasClass('swiper-slide-visible')) { | |||||
if (activeNav.index() > previewSwiper.activeIndex) { | |||||
var thumbsPerNav = Math.floor(previewSwiper.width / activeNav.width()) - 1 | |||||
previewSwiper.swipeTo(activeNav.index() - thumbsPerNav) | |||||
} else { | |||||
previewSwiper.swipeTo(activeNav.index()) | |||||
} | |||||
} | |||||
} | |||||
} | |||||
//专家列表 | |||||
module.technologyTrainingDetails = function (data) { | |||||
if (data.code == 200) { | |||||
var content = data.data; | |||||
content.trainingType = module.selectDictLabel(module.data.trainingTypeOptions,content.trainingType); | |||||
const masterMapList = content.supplyMasterMap.split(","); | |||||
for (var i = 0 ; i < masterMapList.length ; i++){ | |||||
masterMapList[i] = serverApi + masterMapList[i]; | |||||
} | |||||
content.supplyMasterMap = masterMapList; | |||||
module.data.technologyDetail = content; | |||||
var technologyData = template('technologyData', module.data); | |||||
$("#technologyContent").html(technologyData); | |||||
module.swiperBanner(); | |||||
} | |||||
} | |||||
module.selectDictLabel = function (datas, value) { | |||||
var actions = []; | |||||
Object.keys(datas).some((key) => { | |||||
if (datas[key].dictValue == ('' + value)) { | |||||
actions.push(datas[key].dictLabel); | |||||
return true; | |||||
} | |||||
}) | |||||
return actions.join(''); | |||||
} | |||||
return module; | |||||
}) |
@@ -12,6 +12,99 @@ | |||||
<link href="../../static/css/main.css" rel="stylesheet" type="text/css" /> | <link href="../../static/css/main.css" rel="stylesheet" type="text/css" /> | ||||
<link href="../../static/css/index.css" rel="stylesheet" type="text/css" /> | <link href="../../static/css/index.css" rel="stylesheet" type="text/css" /> | ||||
<link href="../../static/css/supply.css" rel="stylesheet" type="text/css" /> | <link href="../../static/css/supply.css" rel="stylesheet" type="text/css" /> | ||||
<link href="../../static/css/swiper-bundle.min.css" rel="stylesheet" type="text/css"/> | |||||
<style type="text/css"> | |||||
.swiperDiv{ | |||||
border: 1px solid #eaeaea; | |||||
margin-top: 20px; | |||||
} | |||||
.pc-slide { | |||||
width: 37%; | |||||
margin: 0 auto; | |||||
} | |||||
.view .swiper-container { | |||||
width: 100%; | |||||
height: 350px; | |||||
} | |||||
.view .arrow-left { | |||||
background: url(../../static/images/feel3.png) no-repeat left top; | |||||
position: absolute; | |||||
left: 10px; | |||||
top: 50%; | |||||
margin-top: -25px; | |||||
width: 30px; | |||||
height: 30px; | |||||
z-index: 10; | |||||
background-size: 100%; | |||||
} | |||||
.view .arrow-right { | |||||
background: url(../../static/images/feel4.png) no-repeat left bottom; | |||||
position: absolute; | |||||
right: 10px; | |||||
top: 50%; | |||||
margin-top: -25px; | |||||
width: 30px; | |||||
height: 30px; | |||||
z-index: 10; | |||||
background-size: 100%; | |||||
} | |||||
.preview { | |||||
width: 100%; | |||||
margin-top: 10px; | |||||
position: relative; | |||||
} | |||||
.preview .swiper-container { | |||||
width: calc(100% - 70px); | |||||
height: 82px; | |||||
margin-left: 35px; | |||||
} | |||||
.preview .swiper-slide { | |||||
width: 87px; | |||||
height: 82px; | |||||
} | |||||
.preview .slide6 { | |||||
width: 82px; | |||||
} | |||||
.preview .arrow-left { | |||||
background: url(../../static/images/feel6.png) no-repeat left top; | |||||
position: absolute; | |||||
left: 10px; | |||||
top: 50%; | |||||
margin-top: -9px; | |||||
width: 9px; | |||||
height: 18px; | |||||
z-index: 10; | |||||
} | |||||
.preview .arrow-right { | |||||
background: url(../../static/images/feel5.png) no-repeat left bottom; | |||||
position: absolute; | |||||
right: 10px; | |||||
top: 50%; | |||||
margin-top: -9px; | |||||
width: 9px; | |||||
height: 18px; | |||||
z-index: 10; | |||||
} | |||||
.preview img { | |||||
padding: 1px; | |||||
} | |||||
.preview .active-nav img { | |||||
padding: 0; | |||||
border: 1px solid #F00; | |||||
} | |||||
</style> | |||||
</head> | </head> | ||||
<body> | <body> | ||||
@@ -41,11 +134,50 @@ | |||||
<div class="partition"></div> | <div class="partition"></div> | ||||
<div class="w-1200"> | <div class="w-1200"> | ||||
<p class="crumbs">首页 > 供求信息 > 供应信息</p> | <p class="crumbs">首页 > 供求信息 > 供应信息</p> | ||||
<div class="detail_box"> | |||||
<script id="technologyData" type="text/html"> | |||||
<p class="recommendTit">大量蔬菜上市,批发价供应</p> | <p class="recommendTit">大量蔬菜上市,批发价供应</p> | ||||
<div class="detail_box_comm"> | <div class="detail_box_comm"> | ||||
<img src="../../static/images/img5.jpg" alt="" width="32%" class="fl"/> | |||||
<table class="fr" width="63%"> | |||||
<div class="pc-slide fl"> | |||||
<div class="view"> | |||||
<div class="swiper-container"> | |||||
<a class="arrow-left" href="#"></a> | |||||
<a class="arrow-right" href="#"></a> | |||||
<div class="swiper-wrapper"> | |||||
{{each technologyDetail.supplyMasterMap as value i}} | |||||
{{if technologyDetail.supplyMasterMap == ''}} | |||||
<div class="swiper-slide"> | |||||
<a href="javascript:void(0);" ><img src="../../static/images/zwtp.jpg" alt=""></a> | |||||
</div> | |||||
{{else}} | |||||
<div class="swiper-slide"> | |||||
<a href="javascript:void(0);" ><img src="{{value}}" alt=""></a> | |||||
</div> | |||||
{{/if}} | |||||
{{/each}} | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<div class="preview"> | |||||
<a class="arrow-left" href="#"></a> | |||||
<a class="arrow-right" href="#"></a> | |||||
<div class="swiper-container"> | |||||
<div class="swiper-wrapper"> | |||||
{{each technologyDetail.supplyMasterMap as value i}} | |||||
{{if technologyDetail.supplyMasterMap == ''}} | |||||
<div class="swiper-slide active-nav"> | |||||
<img src="../../static/images/zwtp.jpg" alt=""> | |||||
</div> | |||||
{{else}} | |||||
<div class="swiper-slide {{i==0?'active-nav':''}}"> | |||||
<img src="{{value}}" alt=""> | |||||
</div> | |||||
{{/if}} | |||||
{{/each}} | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<table class="fr" width="60%"> | |||||
<tr> | <tr> | ||||
<td>品牌</td> | <td>品牌</td> | ||||
<td>无</td> | <td>无</td> | ||||
@@ -93,7 +225,8 @@ | |||||
<p>欢迎咨询够买。</p> | <p>欢迎咨询够买。</p> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | |||||
</script> | |||||
<div class="detail_box" id="technologyContent"></div> | |||||
</div> | </div> | ||||
@@ -126,7 +259,7 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</body> | </body> | ||||
<!--<script src="../static/js/common/require.js" data-main="../static/js/common/main.js?t=101" id="require-page"--> | |||||
<!-- target-module="../static/js/project/index.js" defer type="text/javascript"></script>--> | |||||
<script src="../../static/js/common/require.js" data-main="../../static/js/common/main.js?t=101" id="require-page" | |||||
target-module="../../static/js/project/supply/detail.js" defer type="text/javascript"></script> | |||||
</html> | </html> |
@@ -180,7 +180,7 @@ | |||||
<script id="supplyInformationData" type="text/html"> | <script id="supplyInformationData" type="text/html"> | ||||
{{each supplyInformationList as value i}} | {{each supplyInformationList as value i}} | ||||
<li> | <li> | ||||
<a href="detail.html"> | |||||
<a href="detail.html?id={{value.id}}"> | |||||
{{if value.supplyMasterMap.indexOf(null) == -1}} | {{if value.supplyMasterMap.indexOf(null) == -1}} | ||||
<img src="{{value.supplyMasterMap}}" width="25%" height="128" alt="" class="fl"/> | <img src="{{value.supplyMasterMap}}" width="25%" height="128" alt="" class="fl"/> | ||||
{{else}} | {{else}} | ||||