|
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/common.css" />
</head>
<style>
html,
body {
background: #efeff4;
}
/*input输入相关*/
.frmbox {
width: 100%;
margin: 2% auto;
border-radius: 6px;
}
.frmtype {
width: 100%;
margin: auto;
line-height: 30px;
padding: 1% 2%;
font-size: 14px;
line-height: 20px;
}
.frmbtn {
width: 100%;
margin: 4% auto;
font-size: 14px;
line-height: 24px;
padding: 1% 2%;
border: 1px solid #FF9900;
border-radius: 6px;
color: #FF9900;
}
.frmbox {
border: none;
width: 90%;
height: 100%;
}
.frmactive {
color: #fff;
background-color: #FF9900;
border: 1px solid #FF9900;
}
.pull-right {
float: right!important
}
.pull-left {
float: left!important
}
.alignCenter {
text-align: center;
}
/*圆角*/
/*头像、资源圆角*/
.headRadius {
border-radius: 4px;
}
.blockGroup {
background: #fff;
}
.mainbox {
width: 96%;
margin: 2% auto;
}
.maincon {
padding: 4% 2%;
overflow: hidden;
}
.listtit {
font-size: 14px;
color: #333333;
}
/*中标题*/
.listtit2 {
font-size: 13px;
color: #666666;
}
/*较小标题*/
.listtit3 {
font-size: 12px;
color: #888888;
}
/*小标题*/
.mui-ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
/*资源图片*/
.ResImgBox {
display: inline-block;
text-align: center;
max-width: 64px;
width: 64px;
height: 60px;
padding: 1px;
background: #FAFAFA;
border: 1px solid #F8F8F8;
overflow: hidden;
padding: 2px;
margin: 6px 0;
border-radius: 4px;
}
.ResImgBox2 {
margin: 6px 0 6px 10px;
}
.ResImgBox .resImg {
max-width: 100%;
max-height: 100%;
vertical-align: middle;
position: relative;
}
.ResImgBox:before {
content: ' ';
display: inline-block;
vertical-align: middle;
width: 0;
height: 100%;
overflow: hidden;
margin-left: -5px;
}
/*专家相关信息*/
.personinfo .listtit3 {
font-size: 14px;
line-height: 24px;
color: #AAAAAA;
margin: 0;
}
.personinfo .listtit {
font-size: 18px;
line-height: 30px;
color: #333333;
}
.personinfo .listtit3 {
font-size: 14px;
line-height: 24px;
color: #AAAAAA;
margin: 0;
}
.headbox .headimg {
width: 100px;
overflow: hidden;
margin: auto;
}
/*咨询记录及等级*/
.peolevelbox {
display: block;
padding: 4% 16px;
border-top: 1px #F0F0F0 solid;
}
.peocountbox {
width: 150px;
}
.peocount {
font-size: 13px;
color: #888888;
overflow: hidden;
}
.peocount span em {
font-size: 14px;
padding: 0 3px;
color: #FF9900;
font-weight: 600;
}
.peocount .dialogicon {
display: block;
width: 20px;
height: 20px;
background: url(images/dialogue.png) center center no-repeat;
background-size: 100% 100%;
margin-right: 6px;
}
.peocount:before {
position: absolute;
right: 0;
top: 0;
left: 15px;
height: 1px;
content: '';
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
background-color: #c8c7cc;
}
.levelbox {
margin: auto;
overflow: hidden;
}
.levelbox .iconfont {
float: left;
margin: 2px;
width: 14px;
height: 14px;
}
.levelbox .icon-favor {
background: url(images/favoricon.png) 0 0 no-repeat;
background-size: 100% auto;
}
.levelbox .icon-favorfill {
background: url(images/favoricon.png) 0 -14px no-repeat;
background-size: 100% auto;
}
.infocontit {
font-size: 14px;
position: relative;
}
.infocon {
padding: 6px 10px;
/*text-align: justify;*/
font-size: 13px;
line-height: 27px;
color: #888888;
}
.infocon ul {
padding: 0;
margin: 0;
overflow: hidden;
}
.infocon .infoapply li {
padding-left: 6px;
padding-right: 2px;
list-style: disc inside;
width: 46%;
float: left;
}
.infocon .infosubject li {
list-style: none;
padding: 2px 16px;
margin: 4px;
border: 1px solid #BBBBBB;
border-radius: 6px;
float: left;
}
.listitembox {
position: static;
width: 100%;
}
.listitembox .listitem {
padding: 4px;
padding-right: 0;
}
.listitembox .listitem .media-body {
width: 73%;
margin-left: 2%;
}
.listitembox .listitem .media-body .resbrief {
width: 100%;
}
.listitembox .listitem .media-object {
width: 30%;
}
.listitembox .listitem .media-object .iconposition {
border-radius: 50%;
max-width: 60px;
height: 60px;
margin: 1% 0;
}
.listitembox .listitem>a .mutlinebox {
white-space: normal;
overflow: auto;
word-break: break-word;
}
.listbox {
margin: 5px 0;
max-width: 100%;
overflow: hidden;
}
.listbrowse {
border: 1px solid #FF9900;
border-radius: 0 6px 6px 0;
text-align: center;
font-size: 13px;
line-height: 27px;
float: left;
padding-right: 8px;
max-width: 60%;
overflow: hidden;
}
.plusbtn {
font-size: 20px;
line-height: 22px;
color: #999999;
margin-left: 4px;
margin-top: 2px;
}
.plusbtn.icon-appreciatefill {
color: #FF9900;
}
.like {
display: block;
float: left;
width: 28px;
font-size: 12px;
background: #FF9900;
color: #fff;
line-height: 27px;
margin-right: 5px;
}
.likenum {
float: right;
max-width: 130px;
overflow: hidden;
}
.likenum .mui-icon {
font-size: 24px;
color: #CCCCCC;
}
.likepeople {
width: 26px;
height: 26px;
line-height: 20px;
float: left;
overflow: hidden;
margin-right: 5px;
}
.likepeople img {
width: 100%;
height: 100%;
}
.likemore {
display: block;
width: 25px;
height: 25px;
border: 1px solid #CCCCCC;
background: url(images/likemore.png) center center no-repeat;
}
.personblock{ margin-left: 2%;}
</style>
<body>
<div class="contentBody2">
<div class="blockGroup mainbox">
<div class="maincon">
<div class="ResImgBox resouimgbox pull-left" style="height:180px;width:180px;max-width:180px;margin:0 6px 0 8px;">
<img class="resImg headRadius" src="images/default-resource.jpg" id="ziyuanimg" data-preview-src data-preview-group="1" />
</div>
<div class="personblock pull-left" id="fess">
<img class="headRadius" style="width: 60px;" src="images/default-photo.jpg" id="proimg">
<p class="listtit" id="proname"><em class="authicon authicon-cu" style="font-size:16px;" id="promodify"></em></p>
<p class="listtit2"><span id="protitle"></span><span id="prooffice"></span></p>
<p class="listtit3"><span id="proorgName"></span></p>
<p class="listtit3"><span id="proadress"></span></p>
</div>
</div>
</div>
<div class="blockGroup mainbox">
<div class="maincon">
<ul class="resouinfobox">
<li>
<div class="infocontit">基本信息</div>
</li>
<li>
<div class="infocon">
<p style="color:#666666;">
<span>资源名称：</span>
<span class="listtit2" id='resourceName'></span>
</p>
<p style="color:#666666;">
<span>应用用途：</span>
<span class="listtit2" id="yongtu"></span>
</p>
</div>
</li>
</ul>
</div>
</div>
<div class="blockGroup mainbox" id="fielddiv">
<div class="maincon">
<div class="infocontit">学术领域</div>
<div class="infocon">
<ul class="infosubject" id="field">
</ul>
</div>
</div>
</div>
<div class="blockGroup mainbox" id="applydiv">
<div class="maincon">
<div class="infocontit">应用行业</div>
<div class="infocon">
<ul id="apply">
</ul>
</div>
</div>
</div>
<div class="blockGroup mainbox" id="hezuodiv">
<div class="maincon">
<ul class="resouinfobox">
<li>
<div class="infocontit">合作备注</div>
<div class="infocon">
<p class="listtit3" id="hezuo"></p>
</div>
</li>
</ul>
</div>
</div>
<div class="blockGroup mainbox" id="detaildiv">
<div class="maincon">
<ul class="resouinfobox">
<li>
<div class="infocontit">详细描述</div>
<div class="infocon">
<p class="listtit3" id="detail">
二维码123456789二维码、语音输入、摇一摇摄像头、文件系统、摇一摇摄像头、文件系统、微信分享……不够？Native.JS
</p>
</div>
</li>
</ul>
</div>
</div>
<div class="blockGroup mainbox" style="padding-bottom:40px;">
<div class="maincon alignCenter">
<p style="margin-top: 30px;"><span style="color:#ff9900; font-size: 16px;line-height: 32px;">[ 科袖 ]</span><br />搭建企业与专家的桥梁</p>
<div class="frmbox" style="margin:20px auto;">
<a href="http://www.ekexiu.com/download/com.ekexiu.app_V1.1.1.apk"><button class="frmbtn frmactive">下载安卓客户端</button></a>
</div>
<div>
<img style="width:120px;" src="images/weixin_code.jpg" />
<p style="color:#CCCCCC;font-size:13px;">关注科袖公众号</p>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script>
$(document).ready(function() {
var resourceId='73FAD17209F7477C8D8537E5F98ADAAA';
var oproname = document.getElementById("proname"); //专家名称
var oprotitle = document.getElementById("protitle"); //专家职称
var oprooffice = document.getElementById("prooffice"); //专家职务
var oproorgName = document.getElementById("proorgName"); //专家所属机构
var oproadress = document.getElementById("proadress"); //专家所在地
var opromodify = document.getElementById("promodify"); //专家认证
var oproimg = document.getElementById("proimg"); //专家头像
var oresourceName = document.getElementById("resourceName"); //资源名称
var oyongtu = document.getElementById("yongtu"); //应用用途
var oziyuanimg = document.getElementById("ziyuanimg"); //资源图片
var ofield = document.getElementById("field"); //学术领域
var oapply = document.getElementById("apply"); //应用行业
var odetail = document.getElementById("detail"); //详细描述
var ohezuo = document.getElementById("hezuo"); //合作备注
var oEnter = document.getElementById("fess");
var ofielddiv = document.getElementById("fielddiv"); //学术领域容器
var oapplydiv = document.getElementById("applydiv"); //应用行业容器
var odetaildiv = document.getElementById("detaildiv"); //详细描述容器
var ohezuodiv = document.getElementById("hezuodiv"); //合作备注容器
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
var context = "";
if(r != null)
context = r[2];
reg = null;
r = null;
return context == null || context == "" || context == "undefined" ? "" : decodeURI(context);
}
function ziyuaninfo(resourceId) {
$.ajax({
url:'/ajax/resource/resourceInfo',
data: {
'resourceId': resourceId
},
dataType: 'json', //服务器返回json格式数据
type: 'get', //HTTP请求类型
timeout: 10000, //超时时间设置为10秒；
success: function(data) {
if(data.success) {
console.log(JSON.stringify(data));
var mydata = data.data;
//资源名称
professorId = mydata['professor']['id'];
var userid = GetQueryString('userid');
if(professorId==userid){
document.getElementsByClassName("footbox")[0].style.display="none";
}
(mydata['resourceName']) ? oresourceName.innerHTML = mydata['resourceName']: oresourceName.innerHTML = '';
//专家信息
proId = mydata['professor']['id']; //专家id
//专家名字
(mydata['professor']["name"]) ? oproname.innerText = mydata['professor']["name"]: oproname.innerText = '';
//职称
(mydata['professor']["title"]) ? oprotitle.innerHTML = mydata['professor']["title"]: oprotitle.innerHTML = '';
//职位
if(mydata['professor']["office"] == null || mydata['professor']["office"] == undefined) {
oprooffice.innerHTML = '';
} else {
if(mydata['professor']["title"]) {
oprooffice.innerHTML = '，' + mydata['professor']["office"]; //职位
}
oprooffice.innerHTML = mydata['professor']["office"]; //职位
};
//所在机构
(mydata['professor']["orgName"]) ? oproorgName.innerHTML = mydata['professor']["orgName"]: oproorgName.innerHTML = '';
//所在地
(mydata['professor']["address"]) ? oproadress.innerHTML = mydata['professor']["address"]: oproadress.innerHTML = '';
/*是否认证*/
(mydata['professor']["authentication"] == true) ? opromodify.classList.add('authicon'): opromodify.classList.add('unauthicon');
/*专家头像*/
(mydata['professor']["hasHeadImage"] == 0) ? oproimg.setAttribute('src', '/images/default-photo.jpg'): oproimg.setAttribute('src', '/images/head/' + mydata['professor']['id'] + '_m.jpg');
//资源基本信息
//(mydata['images']['imageSrc']) ? oziyuanimg.setAttribute('src', mydata['images']['imageSrc']): oziyuanimg.setAttribute('src', '../images/default-resource.jpg'); //资源图片
var imgRes = "/images/resource/" + mydata.resourceId + ".jpg";
if(mydata['images'].length) {
oziyuanimg.setAttribute('src', imgRes)
} else {
oziyuanimg.setAttribute('src', '../images/default-resource.jpg')
}
(mydata['supportedServices']) ? oyongtu.innerHTML = mydata['supportedServices']: oyongtu.innerHTML = ''; //应用用途
//学术领域
if(mydata['subject']) {
if(mydata['subject'].indexOf(',') != -1) { //字符串是否包含,
var fieldlist = mydata['subject'].split(",");
console.log(fieldlist.length);
for(var i = 0; i < fieldlist; i++) {
var oli = document.createElement('li');
oli.innerText = fieldlist[i];
ofield.appendChild(oli);
}
} else {
var oli = document.createElement('li');
oli.innerText = mydata['subject'];
ofield.appendChild(oli);
}
} else {
ofielddiv.style.display = 'none';
}
//应用行业
if(mydata['industry']) {
if(mydata['industry'].indexOf(',') != -1) { //字符串是否包含,
var applylist = mydata['industry'].split(",");
console.log(applylist.length);
for(var i = 0; i < applylist; i++) {
var oli = document.createElement('li');
oli.innerText = fieldlist[i];
oapply.appendChild(oli);
}
} else {
var oli = document.createElement('li');
oli.innerText = mydata['industry'];
oapply.appendChild(oli);
}
} else {
oapplydiv.style.display = 'none';
}
//详细描述
if(mydata['descp']) {
odetail.innerHTML = mydata['descp']
} else {
odetaildiv.style.display = 'none';
}
//合作备注
if(mydata['cooperationNotes']) {
ohezuo.innerHTML = mydata['cooperationNotes'];
} else {
ohezuodiv.style.display = 'none';
}
}
},
error: function(e) {
return;
}
});
}
//资源信息
ziyuaninfo(resourceId);
});
</script>
</body>
</html>
|
