|
|
|
<!DOCTYPE html>
|
|
|
|
<html>
|
|
|
|
|
|
|
|
<head>
|
|
|
|
<meta charset="utf-8">
|
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
|
|
|
<title>项目中心</title>
|
|
|
|
<link rel="stylesheet" href="../../../lib/css/mui.min.css">
|
|
|
|
<link rel="stylesheet" type="text/css" href="../../../lib/css/basic.css" />
|
|
|
|
<link rel="stylesheet" href="../../css/project_white_paper.css">
|
|
|
|
<link href="../../../lib/css/mui.pullToRefresh.css" rel="stylesheet" />
|
|
|
|
<script src="../../../lib/js/mui.min.js"></script>
|
|
|
|
<script src="../../../lib/js/cropper.js"></script>
|
|
|
|
<script src="../../../lib/js/vue.js"></script>
|
|
|
|
<script src="../../../lib/js/app.js"></script>
|
|
|
|
<script src="../../js/base/rem-layout.js"></script>
|
|
|
|
<script type="text/javascript" src="../../js/my/my_ajax.js"></script>
|
|
|
|
<!--下拉刷新上拉加载js-->
|
|
|
|
<script src="../../../lib/js/mui.pullToRefresh.js"></script>
|
|
|
|
<script src="../../../lib/js/mui.pullToRefresh.material.js"></script>
|
|
|
|
</head>
|
|
|
|
<style>
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
<body>
|
|
|
|
<div id="white-paper">
|
|
|
|
<header class="mui-bar mui-bar-nav app-header app-header-darkly">
|
|
|
|
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
|
|
|
|
<h1 class="mui-title">{{langue.title}}</h1>
|
|
|
|
<!--<a id="search" @click="search" v-if="search_status" class="mui-icon mui-icon-search mui-pull-right mui-icon-right-nav" style="color: #000000;"></a>-->
|
|
|
|
</header>
|
|
|
|
<div class="mui-content">
|
|
|
|
<div class="mui-input-row mui-search">
|
|
|
|
<input type="search" class="mui-input-clear" placeholder="" v-model="search_value">
|
|
|
|
<label @click="Tosearch">{{langue.search}}</label>
|
|
|
|
</div>
|
|
|
|
<div class="mui-table-view-cell mui-collapse" id="optional">
|
|
|
|
<a href="#" class="all-select">{{selectTitle}}</a>
|
|
|
|
<div class="mui-collapse-content">
|
|
|
|
<ul class="item-ul">
|
|
|
|
<li class="item-list mui-active" data-unit='全部' data-id=''>{{langue.all}}</li>
|
|
|
|
<li class="item-list" v-for="(item,index) in currentList" :data-unit='item.name' :data-id='item.id'>{{item.name}}</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<ul class="mui-table-view txt-media">
|
|
|
|
<li class="mui-table-view-cell mui-media" v-for="(item,index) in currentInfo">
|
|
|
|
<a href="javascript:;" :id="item.id" @click="Toinfo(item,index)">
|
|
|
|
<img class="mui-media-object mui-pull-left" :src='base_file_url + item.coinUrl' />
|
|
|
|
<div class="mui-media-body">
|
|
|
|
<span class="product-title">
|
|
|
|
{{item.currencyName}}
|
|
|
|
</span>
|
|
|
|
<div class="product-txt">
|
|
|
|
{{item.descr}}
|
|
|
|
</div>
|
|
|
|
<div class="product-situation">
|
|
|
|
<span class="price">{{item.classifyName}}</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</a>
|
|
|
|
<span class="weight" @click="thumb(item.id)" :id="item.id"><img :src="changThumb(item.star)"/>{{item.starNum}}</span>
|
|
|
|
</li>
|
|
|
|
<!--<li class="mui-table-view-cell mui-media">
|
|
|
|
<a href="javascript:;">
|
|
|
|
<img class="mui-media-object mui-pull-left" src="../../img/yanhuo_logo.jpg" />
|
|
|
|
<div class="mui-media-body">
|
|
|
|
<span class="product-title">
|
|
|
|
焰火网
|
|
|
|
</span>
|
|
|
|
<div class="product-txt">
|
|
|
|
焰火网是一个全球科sadsadsadsadsadsddsadsdsd技创新数字货币融资 交易平台
|
|
|
|
</div>
|
|
|
|
<div class="product-situation">
|
|
|
|
<span class="price">区块链技术</span>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</a>
|
|
|
|
<span class="weight"><img src="../../img/thumb-active.png"/>10</span>
|
|
|
|
</li>-->
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<div class="nothing" v-show="currentInfo.length <= 0">
|
|
|
|
{{langue.nothing}}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</body>
|
|
|
|
|
|
|
|
</html>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
// 国际化
|
|
|
|
var langues = {
|
|
|
|
zh_CN: {
|
|
|
|
title: "项目中心",
|
|
|
|
search: "搜索",
|
|
|
|
all: '全部',
|
|
|
|
nothing: '暂无数据',
|
|
|
|
contentdown: '上拉显示更多',
|
|
|
|
contentrefresh: '正在加载...',
|
|
|
|
|
|
|
|
},
|
|
|
|
zh_HK: {
|
|
|
|
title: "項目中心",
|
|
|
|
search: "搜索",
|
|
|
|
all: '全部',
|
|
|
|
nothing: '暫無數據',
|
|
|
|
contentdown: '上拉顯示更多',
|
|
|
|
contentrefresh: '正在加載...',
|
|
|
|
},
|
|
|
|
en_US: {
|
|
|
|
title: "Project center",
|
|
|
|
search: "Search",
|
|
|
|
all: 'All',
|
|
|
|
nothing: 'No data',
|
|
|
|
contentdown: 'Pull up to show more',
|
|
|
|
contentrefresh: 'Loading...',
|
|
|
|
}
|
|
|
|
};
|
|
|
|
//2、页面上所有需要国际化的文字,包括提示,都通过Vue去引用,例子:
|
|
|
|
var langueKey = app.getLanguageLocalStorage(); //获取国际化语种
|
|
|
|
var langue = langues[langueKey]; // 获取国际化语种数据
|
|
|
|
//3、每个页面都需要加上以下的方法:
|
|
|
|
window.addEventListener('switchLangueData', function(e) {
|
|
|
|
//dataInfo为Vue对象的名称
|
|
|
|
dataInfo.langue = langues[e.detail];
|
|
|
|
});
|
|
|
|
var dataInfo = new Vue({
|
|
|
|
el: "#white-paper",
|
|
|
|
data: {
|
|
|
|
langue: langue,
|
|
|
|
selectTitle: langue.all, //选择列表的标题
|
|
|
|
currentList: [], //白皮书列表
|
|
|
|
currentInfo: [], //白皮书主体内容
|
|
|
|
currentID: '', //列表ID
|
|
|
|
thumbs: '0', //判断用户是否点赞过
|
|
|
|
projectID: '', //项目id
|
|
|
|
userLocalStorage: app.getUserLocalStorage(),
|
|
|
|
base_file_url: app.walletFileUrl, //基础路
|
|
|
|
search_value: '', //搜索框值
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
//点赞点击事件
|
|
|
|
thumb: function(_id) {
|
|
|
|
if(!this.loginType) {
|
|
|
|
app.openWin("../wallet_login.html", "mine/html/wallet_login.html");
|
|
|
|
} else {
|
|
|
|
this.projectID = _id;
|
|
|
|
getThumb();
|
|
|
|
}
|
|
|
|
},
|
|
|
|
//改变点赞图片
|
|
|
|
changThumb: function(star) {
|
|
|
|
if(star == '1') {
|
|
|
|
return '../../img/thumb.png'
|
|
|
|
} else {
|
|
|
|
return '../../img/thumb-active.png'
|
|
|
|
}
|
|
|
|
},
|
|
|
|
Toinfo: function(obj, index) {
|
|
|
|
//跳转详情页
|
|
|
|
openInfo(obj, index);
|
|
|
|
},
|
|
|
|
//搜索
|
|
|
|
Tosearch: function() {
|
|
|
|
getWhitePaperInfo()
|
|
|
|
},
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
loginType: function() {
|
|
|
|
if(JSON.stringify(this.userLocalStorage) != '{}') {
|
|
|
|
return true;
|
|
|
|
} else {
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
</script>
|
|
|
|
<script type="text/javascript">
|
|
|
|
//页码
|
|
|
|
var pageNum = 1;
|
|
|
|
//上下拉刷新控件
|
|
|
|
var pullToRefreshObj = null;
|
|
|
|
mui.plusReady(function() {
|
|
|
|
getWhitePaperList();
|
|
|
|
getWhitePaperInfo();
|
|
|
|
//下拉刷新
|
|
|
|
pullToRefreshObj = mui(".mui-content").pullToRefresh({
|
|
|
|
down: {
|
|
|
|
callback: function() {
|
|
|
|
var self = this;
|
|
|
|
pageNum = 1;
|
|
|
|
getWhitePaperInfo();
|
|
|
|
setTimeout(function() {
|
|
|
|
self.endPullDownToRefresh();
|
|
|
|
}, 1000);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
up: {
|
|
|
|
callback: function() {
|
|
|
|
var self = this;
|
|
|
|
setTimeout(function() {
|
|
|
|
pullUpFunction(self);
|
|
|
|
}, 1000);
|
|
|
|
},
|
|
|
|
contentdown: dataInfo.langue.contentdown,
|
|
|
|
contentrefresh: dataInfo.langue.contentrefresh,
|
|
|
|
contentnomore: "- End -"
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
<script>
|
|
|
|
//搜索点击事件
|
|
|
|
// document.getElementById('search').addEventListener('tap', function() {
|
|
|
|
// dataInfo.search_status = false;
|
|
|
|
// });
|
|
|
|
// 分类列表选择事件
|
|
|
|
mui(".item-ul").on("tap", ".item-list", function() {
|
|
|
|
mui(".item-ul .item-list").each(function(index, item) {
|
|
|
|
item.classList.remove("mui-active");
|
|
|
|
});
|
|
|
|
this.classList.add('mui-active');
|
|
|
|
var unitName = this.getAttribute("data-unit");
|
|
|
|
var unitId = this.getAttribute("data-id");
|
|
|
|
dataInfo.selectTitle = unitName;
|
|
|
|
dataInfo.currentID = unitId;
|
|
|
|
//查询
|
|
|
|
getWhitePaperInfo();
|
|
|
|
console.log(unitId);
|
|
|
|
setTimeout(function() {
|
|
|
|
document.getElementById('optional').classList.remove('mui-active');
|
|
|
|
}, 200)
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
<script>
|
|
|
|
//分类列表查询
|
|
|
|
function getWhitePaperList() {
|
|
|
|
mui.ajax(myAjaxJs.AJAX_WHITE_PAPER_SELECT.getUrl, {
|
|
|
|
headers: {
|
|
|
|
"locale": app.getLanguageLocalStorage() // 语种头部
|
|
|
|
},
|
|
|
|
type: myAjaxJs.AJAX_WHITE_PAPER_SELECT.getType, //HTTP请求类型
|
|
|
|
dataType: 'json', //服务器返回json格式数据
|
|
|
|
timeout: 10000, //超时时间设置为10秒;
|
|
|
|
success: function(data) {
|
|
|
|
if(data.code == 200) {
|
|
|
|
dataInfo.currentList = data.data.rows;
|
|
|
|
} else {
|
|
|
|
mui.toast(data.msg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//列表查询内容
|
|
|
|
function getWhitePaperInfo() {
|
|
|
|
plus.nativeUI.showWaiting(dataInfo.langue.contentrefresh);
|
|
|
|
mui.ajax(myAjaxJs.AJAX_WHITE_PAPER_INFO.getUrl, {
|
|
|
|
headers: {
|
|
|
|
"locale": app.getLanguageLocalStorage(), // 语种头部
|
|
|
|
"X-Requested-Token": app.getTokenStorage() // token头部
|
|
|
|
},
|
|
|
|
type: myAjaxJs.AJAX_WHITE_PAPER_INFO.getType, //HTTP请求类型
|
|
|
|
data: {
|
|
|
|
classifyId: dataInfo.currentID,
|
|
|
|
descr: dataInfo.search_value
|
|
|
|
},
|
|
|
|
dataType: 'json', //服务器返回json格式数据
|
|
|
|
timeout: 10000, //超时时间设置为10秒;
|
|
|
|
success: function(data) {
|
|
|
|
if(data.code == 200) {
|
|
|
|
plus.nativeUI.closeWaiting();
|
|
|
|
//渲染数据
|
|
|
|
console.log(JSON.stringify(data.data))
|
|
|
|
dataInfo.currentInfo = data.data.rows;
|
|
|
|
console.log(JSON.stringify(dataInfo.currentInfo));
|
|
|
|
console.log(JSON.stringify(dataInfo.currentInfo.length))
|
|
|
|
|
|
|
|
dataInfo.search_value = '';
|
|
|
|
//数据小于10条,禁用上拉
|
|
|
|
if(data.data.rows.length < 10) {
|
|
|
|
pullToRefreshObj.endPullUpToRefresh(true);
|
|
|
|
} else {
|
|
|
|
pullToRefreshObj.refresh(true);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
plus.nativeUI.closeWaiting();
|
|
|
|
mui.toast(data.msg);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
error: function(xhr, type, errorThrown) {
|
|
|
|
plus.nativeUI.closeWaiting();
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
//点赞查询内容
|
|
|
|
function getThumb() {
|
|
|
|
console.log(dataInfo.userLocalStorage.id)
|
|
|
|
mui.ajax(myAjaxJs.AJAX_WHITE_PAPER_THUMB.getUrl, {
|
|
|
|
headers: {
|
|
|
|
"locale": app.getLanguageLocalStorage() // 语种头部
|
|
|
|
},
|
|
|
|
type: myAjaxJs.AJAX_WHITE_PAPER_THUMB.getType, //HTTP请求类型
|
|
|
|
data: {
|
|
|
|
projectId: dataInfo.projectID,
|
|
|
|
userId: dataInfo.userLocalStorage.id
|
|
|
|
},
|
|
|
|
dataType: 'json', //服务器返回json格式数据
|
|
|
|
timeout: 10000, //超时时间设置为10秒;
|
|
|
|
success: function(data) {
|
|
|
|
if(data.code == 200) {
|
|
|
|
//渲染数据
|
|
|
|
getWhitePaperInfo();
|
|
|
|
} else {
|
|
|
|
mui.toast(data.msg);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 跳转详情页
|
|
|
|
*/
|
|
|
|
function openInfo(obj, index) {
|
|
|
|
var chang_Obj = {
|
|
|
|
'changeObj': obj
|
|
|
|
};
|
|
|
|
app.openWin("project_white_paper_info.html", "project_white_paper_info.html", {}, chang_Obj);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 上拉加载事件
|
|
|
|
*/
|
|
|
|
function pullUpFunction(_self) {
|
|
|
|
mui.ajax(myAjaxJs.AJAX_WHITE_PAPER_INFO.getUrl, {
|
|
|
|
headers: {
|
|
|
|
"locale": app.getLanguageLocalStorage(),// 语种头部
|
|
|
|
"X-Requested-Token": app.getTokenStorage() // token头部
|
|
|
|
},
|
|
|
|
data: {
|
|
|
|
classifyId: dataInfo.currentID,
|
|
|
|
pageNum: pageNum + 1
|
|
|
|
},
|
|
|
|
dataType: 'json', //服务器返回json格式数据
|
|
|
|
type: myAjaxJs.AJAX_WHITE_PAPER_INFO.getType, //HTTP请求类型
|
|
|
|
timeout: 10000,
|
|
|
|
success: function(data) {
|
|
|
|
if(data.code == "200") {
|
|
|
|
console.log(JSON.stringify(data.data))
|
|
|
|
if(data.data.rows.length > 0) {
|
|
|
|
//渲染数据
|
|
|
|
dataInfo.currentInfo = dataInfo.currentInfo.concat(data.data.rows);
|
|
|
|
//插入数据,渲染数据
|
|
|
|
pageNum += 1;
|
|
|
|
}
|
|
|
|
//如果数据小于10条
|
|
|
|
if(data.data.rows.length < 10) {
|
|
|
|
_self.endPullUpToRefresh(true); //关闭上拉,并禁用,显示没有更多数据了
|
|
|
|
} else {
|
|
|
|
_self.endPullUpToRefresh(false);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
mui.toast(data.msg);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
error: function(xhr, type, errorThrown) {
|
|
|
|
_self.endPullUpToRefresh(false);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
//监听上一页面返回的事件
|
|
|
|
window.addEventListener('refresh', function(e) { //执行刷新
|
|
|
|
getWhitePaperInfo();
|
|
|
|
});
|
|
|
|
</script>
|