|
@@ -0,0 +1,266 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
+ <link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
|
|
|
+ <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
|
|
|
+ <title>双子星浏览器</title>
|
|
|
+ <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
|
|
|
+ <script src="../static/js/vender/vue/axios.min.js"></script>
|
|
|
+ <script src="../static/js/vender/vue/vue.min.js"></script>
|
|
|
+ <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css">
|
|
|
+ <link rel="stylesheet" href="../static/css/browserDetail.css">
|
|
|
+ <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
|
|
|
+ <script src="../static/js/vender/config.js"></script>
|
|
|
+ <script src="../static/js/vender/toastr/toastr.min.js"></script>
|
|
|
+ <script src="../static/js/vender/vue/config.js"></script>
|
|
|
+ <script type="text/javascript">
|
|
|
+ var deviveWidth = document.documentElement.clientWidth;
|
|
|
+ document.documentElement.style.fontSize = deviveWidth / 7.5 + 'px';
|
|
|
+ </script>
|
|
|
+ <script>
|
|
|
+ toastr.options.positionClass = 'toast-center-center';
|
|
|
+ // toastr.options.timeOut = '1500';
|
|
|
+ </script>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <div class="container">
|
|
|
+ <div class="header-wrap">
|
|
|
+ <div class="search-wrap" id="search-wrap">
|
|
|
+ <img class="search-icon" src="../static/img/browser/search-icon2.png" />
|
|
|
+ <div class="ipt" id="ipt">双子星浏览器</div>
|
|
|
+ </div>
|
|
|
+ <div class="title-wrap">
|
|
|
+ <img class="left-arrow" src="../static/img/browser/left-arrow.png" />
|
|
|
+ <div class="title"></div>
|
|
|
+ </div>
|
|
|
+ <div class="tag-wrap"></div>
|
|
|
+ </div>
|
|
|
+ <div class="download-wrap">
|
|
|
+ <div class="download-content"></div>
|
|
|
+ <div class="loading"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+<script type="text/javascript">
|
|
|
+ let title = decodeURIComponent(GetRequest().plateName);
|
|
|
+ let timer,flag = true;
|
|
|
+ let labelId = '', pageNum = 1, pageSize = 10, index = 0, recordFlag = true, total = 0, nowlength = 0;
|
|
|
+ $('.title').eq(0).text(title);
|
|
|
+ (function(){
|
|
|
+ init();
|
|
|
+ })();
|
|
|
+ function init(){
|
|
|
+ if(nowlength === 0) {
|
|
|
+ toastr.error('加载中...');
|
|
|
+ }
|
|
|
+ $.ajax({
|
|
|
+ url: `${baseUrl}/api/public/v1/browserLabel/client/query/${GetRequest().plateId}`,
|
|
|
+ type: 'get',
|
|
|
+ contentType:"application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ let list = res.data;
|
|
|
+ labelId = list[0].id;
|
|
|
+ rankingGet();
|
|
|
+ let node = '';
|
|
|
+ for(let i=0; i < list.length; i++){
|
|
|
+ node += `<div class="tag-item ${i === index ? 'active' : ''}" data-id="${list[i].id}" data-index="${i}">${list[i].labelName}</div>`
|
|
|
+ }
|
|
|
+ $('.tag-wrap').eq(0).append(node);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ };
|
|
|
+ function getType() {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ $.ajax({
|
|
|
+ url: `http://192.168.211.215:9000/getType`,
|
|
|
+ type: 'get',
|
|
|
+ contentType:"application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if(res.code === 200){
|
|
|
+ let cardType = res.data.devType;
|
|
|
+ let phoneObj = {
|
|
|
+ 'RK_3399': 'SVIP'
|
|
|
+ }
|
|
|
+ phoneType = phoneObj[cardType];
|
|
|
+ resolve(phoneType);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ function rankingGet(){
|
|
|
+ getType().then((phoneType) => {
|
|
|
+ $.ajax({
|
|
|
+ url: `${baseUrl}/api/public/v1/ranking/client/get`,
|
|
|
+ type: 'post',
|
|
|
+ data: JSON.stringify({
|
|
|
+ labelId: +labelId,
|
|
|
+ phoneType: phoneType,
|
|
|
+ pageNum: pageNum,
|
|
|
+ pageSize: pageSize
|
|
|
+ }),
|
|
|
+ contentType:"application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if(res.status === 0){
|
|
|
+ let list = res.data.records;
|
|
|
+ nowlength += list.length;
|
|
|
+ total = res.data.total;
|
|
|
+ recordFlag = true;
|
|
|
+ let node = '';
|
|
|
+ for(let i=0; i < list.length; i++){
|
|
|
+ node += `<div class="download-item">
|
|
|
+ <div class="main-wrap">
|
|
|
+ <img class="app-icon" src=${fileCenterApi}/document/newFile/download/0/3dn9b4585511476691c6?fileKey=${list[i].iconKey} />
|
|
|
+ <div class="app-wrap">
|
|
|
+ <div class="app-title">${list[i].appName}</div>
|
|
|
+ <div class="app-description">${list[i].introduction}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="btn-wrap" data-key="${list[i].fileKey}" data-id="${list[i].id}" data-index="${i}" data-md5="${list[i].md5}">
|
|
|
+ <div class="progress" data-key="${list[i].fileKey}" data-id="${list[i].id}" data-index="${i}" data-md5="${list[i].md5}"></div>
|
|
|
+ <text class="text" data-key="${list[i].fileKey}" data-id="${list[i].id}" data-index="${i}" data-md5="${list[i].md5}">下载</text>
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+ }
|
|
|
+ if(nowlength !== total){
|
|
|
+ $('.loading').eq(0).text('正在努力加载中...');
|
|
|
+ } else {
|
|
|
+ $('.loading').eq(0).text('已加载全部内容');
|
|
|
+ }
|
|
|
+ if(list.length === 0){
|
|
|
+ node = `<div class="none-wrap">
|
|
|
+ <img class="none-img" src="../static/img/browser/none.png" />
|
|
|
+ <div class="none-text">没有更多内容哦~</div>
|
|
|
+ </div>`
|
|
|
+ }
|
|
|
+ $('.download-content').eq(0).append(node);
|
|
|
+ }else{
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ };
|
|
|
+ //点击切换
|
|
|
+ $('.tag-wrap')[0].addEventListener('click',(e)=>{
|
|
|
+ labelId = e.target.dataset.id;
|
|
|
+ let className = e.target.className;
|
|
|
+ if(className.includes('tag-item')){
|
|
|
+ pageNum = 1;
|
|
|
+ nowlength = 0;
|
|
|
+ total = 0;
|
|
|
+ toastr.error('加载中...');
|
|
|
+ $('.loading').eq(0).text('');
|
|
|
+ $('.download-content').eq(0).text('');
|
|
|
+ $('.tag-item')[index].className = 'tag-item';
|
|
|
+ index = e.target.dataset.index;
|
|
|
+ $('.tag-item')[index].className = 'tag-item active';
|
|
|
+ rankingGet();
|
|
|
+ }
|
|
|
+ },false);
|
|
|
+ // 点击下载按钮
|
|
|
+ $('.download-wrap')[0].addEventListener('click',(e)=>{
|
|
|
+ let key = e.target.dataset.key;
|
|
|
+ let md5 = e.target.dataset.md5;
|
|
|
+ let index = e.target.dataset.index;
|
|
|
+ let id = e.target.dataset.id;
|
|
|
+ let className = e.target.className;
|
|
|
+ if(className === 'btn-wrap btn-active'){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(['btn-wrap','progress', 'text'].includes(className)){
|
|
|
+ $('.btn-wrap')[index].className = 'btn-wrap btn-active';
|
|
|
+ $.ajax({
|
|
|
+ url: `${baseUrl}/api/public/v1/ranking/getstatus/${id}`,
|
|
|
+ type: 'get',
|
|
|
+ contentType:"application/json",
|
|
|
+ dataType: 'json',
|
|
|
+ cache: false,
|
|
|
+ success: function (res) {
|
|
|
+ if(res.status === 0){
|
|
|
+ const downloadUrl = `${fileCenterApi}/document/newFile/breakpointDownloadFile/3dn9b4585511476691c6?fileKey=${key}`;
|
|
|
+ window.location.href = downloadUrl;
|
|
|
+ let xhr = new XMLHttpRequest();
|
|
|
+ xhr.open('GET', downloadUrl, true);
|
|
|
+ xhr.addEventListener('progress', function (event) {
|
|
|
+ // 响应头要有Content-Length
|
|
|
+ if (event.lengthComputable) {
|
|
|
+ let percentComplete = event.loaded / event.total;
|
|
|
+ // 进度条的位置也是translate,一开始是用translateX(-100%)挪到外面去
|
|
|
+ $('.progress')[0].style.transform = `translateX(${percentComplete * 100}%)`;
|
|
|
+ $('.text').eq(0).text(`${(percentComplete * 100).toFixed(1)}%`);
|
|
|
+ }
|
|
|
+ }, false);
|
|
|
+ xhr.send();
|
|
|
+ // var formData = new FormData();
|
|
|
+ // formData.append("file",$("#photo")[0].files[0]);
|
|
|
+ // $.ajax({
|
|
|
+ // url: `${baseUrl}/document/file/breakUpload`,
|
|
|
+ // type: 'post',
|
|
|
+ // headers: {
|
|
|
+ // 'file-access-key': '3dn9b4585511476691c6',
|
|
|
+ // 'md5': md5
|
|
|
+ // },
|
|
|
+ // data: formData,
|
|
|
+ // contentType: false,
|
|
|
+ // processData: false,
|
|
|
+ // cache: false,
|
|
|
+ // success: function (res) {
|
|
|
+ // console.log(res)
|
|
|
+ // if(res.status === 0){
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ } else {
|
|
|
+ stopManyClick(() => {
|
|
|
+ toastr.error(res.msg);
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },false);
|
|
|
+ //点击返回按钮
|
|
|
+ $('.left-arrow')[0].addEventListener('click',()=>{
|
|
|
+ location.href = './browser.html'
|
|
|
+ },false);
|
|
|
+ //数据下拉加载
|
|
|
+ $('.download-wrap')[0].addEventListener('scroll',function () {
|
|
|
+ let scrollTop = $('.download-wrap')[0].scrollTop;
|
|
|
+ let clientHeight = $('.download-wrap')[0].clientHeight;
|
|
|
+ let scrollHeight = $('.download-wrap')[0].scrollHeight;
|
|
|
+ if(scrollTop + clientHeight + 10 > scrollHeight){
|
|
|
+ if(recordFlag && nowlength < total && total > 0){
|
|
|
+ recordFlag = false;
|
|
|
+ pageNum++;
|
|
|
+ rankingGet();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ //防止提示一秒内重复显示
|
|
|
+ function stopManyClick(fn) {
|
|
|
+ if (flag) {
|
|
|
+ fn();
|
|
|
+ }
|
|
|
+ flag = false;
|
|
|
+ if(timer){clearTimeout(timer);}
|
|
|
+ timer = setTimeout(() => {flag = true}, 1500);
|
|
|
+ }
|
|
|
+ //点击按钮搜索
|
|
|
+ const searchDom = document.getElementById("search-wrap");
|
|
|
+ searchDom.addEventListener('click',()=>{
|
|
|
+ var wd = "https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&rsv_idx=1&tn=baidu";
|
|
|
+ window.open(wd);
|
|
|
+ },false);
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|