优化页面
This commit is contained in:
parent
5892b79b38
commit
7b86fc1e1d
@ -1,5 +1,6 @@
|
||||
module.exports = [
|
||||
{ name: 'vue', library: 'Vue', js: 'https://cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js', css: '' },
|
||||
// { name: 'vue-i18n', library: 'VueI18n', js: 'https://cdn.jsdelivr.net/npm/vue-i18n@8.17.4/dist/vue-i18n.min.js', css: '' },
|
||||
{ name: 'vue-router', library: 'VueRouter', js: 'https://cdn.jsdelivr.net/npm/vue-router@3.1.6/dist/vue-router.min.js', css: '' },
|
||||
{ name: 'axios', library: 'axios', js: 'https://cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js', css: '' },
|
||||
// { name: 'brace', library: 'ace', js: 'https://cdn.jsdelivr.net/npm/brace@0.11.1/index.min.js', css: '' },
|
||||
|
@ -33,6 +33,7 @@
|
||||
window.gds = JSON.parse(
|
||||
JSON.stringify(authConfig.roots.map((it) => it.name))
|
||||
);
|
||||
window.current_drive_order = 0;
|
||||
// window.MODEL = { q: "the" };
|
||||
</script>
|
||||
</head>
|
||||
|
@ -63,6 +63,22 @@ body {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.video-content{
|
||||
width: 100%;
|
||||
background: #000;
|
||||
position: relative;
|
||||
padding-bottom: 56.25%;
|
||||
height: 0;
|
||||
iframe{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.golist {
|
||||
min-height: 240px;
|
||||
position: relative;
|
||||
|
@ -10,7 +10,7 @@ var styles = [
|
||||
'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css',
|
||||
'https://cdn.jsdelivr.net/npm/font-awesome@latest/css/font-awesome.min.css',
|
||||
'https://cdn.jsdelivr.net/npm/font-awesome-animation@0.2.1/dist/font-awesome-animation.min.css',
|
||||
'https://cdn.jsdelivr.net/npm/bulma-pageloader@0.3.0/dist/css/bulma-pageloader.min.css'
|
||||
// 'https://cdn.jsdelivr.net/npm/bulma-pageloader@0.3.0/dist/css/bulma-pageloader.min.css'
|
||||
]
|
||||
styles.forEach(item=>{
|
||||
document.write(`<link rel="stylesheet" href="${item}">`);
|
||||
|
@ -3,9 +3,9 @@ const _import = require('@/libs/util.import.' + process.env.NODE_ENV)
|
||||
|
||||
const frameIn = [
|
||||
{ path: '/:id:/*.(html|php|css|go|java|py|js|json|txt|sh|md)', component: _import('page/GoText') },
|
||||
{ path: '/:id:/*.(mp4|webm|mkv)\\?a=view', component: _import('page/GoVideo') },
|
||||
{ path: '/:id:/*.(bmp|jpg|jpeg|png|gif)\\?a=view', component: _import('page/GoImg') },
|
||||
{ path: '/:id::cmd?(/??.*)', component: _import('page/GoList') },
|
||||
{ path: '/:id:/*.(mp4|webm|mkv)', component: _import('page/GoVideo') },
|
||||
{ path: '/:id:/*.(bmp|jpg|jpeg|png|gif)', component: _import('page/GoImg') },
|
||||
{ path: '/:id::cmd?(/?/??.*)', component: _import('page/GoList') },
|
||||
]
|
||||
|
||||
export default frameIn
|
||||
|
@ -1,5 +1,42 @@
|
||||
import axios from "@utils/axios";
|
||||
|
||||
const exts = [
|
||||
"html",
|
||||
"php",
|
||||
"css",
|
||||
"go",
|
||||
"java",
|
||||
"js",
|
||||
"json",
|
||||
"py",
|
||||
"txt",
|
||||
"sh",
|
||||
"md",
|
||||
"mp4",
|
||||
"webm",
|
||||
"mkv",
|
||||
"bmp",
|
||||
"jpg",
|
||||
"jpeg",
|
||||
"png",
|
||||
"gif",
|
||||
];
|
||||
|
||||
export const checkoutPath = (path, file) => {
|
||||
// 解决/css这种也会匹配的问题
|
||||
var ext = path.split(".").length > 1 ? path.split(".").pop() : "";
|
||||
if (exts.indexOf(`${ext}`) >= 0) {
|
||||
path += "?a=view";
|
||||
} else {
|
||||
if (file.mimeType === "application/vnd.google-apps.folder") {
|
||||
if (path.substr(-1) !== "/") {
|
||||
path += "/";
|
||||
}
|
||||
}
|
||||
}
|
||||
return path;
|
||||
};
|
||||
|
||||
export const getQueryString = (path, param) => {
|
||||
if (!path) {
|
||||
return "";
|
||||
|
@ -39,6 +39,7 @@ export default {
|
||||
let path = window.location.pathname;
|
||||
// 如果是搜索不进行渲染
|
||||
if (path.match("/[0-9]+:search")) {
|
||||
this.navs = [];
|
||||
return;
|
||||
}
|
||||
var arr = path.trim("/").split("/");
|
||||
|
@ -53,6 +53,16 @@
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar-item has-dropdown is-hoverable">
|
||||
<a class="navbar-link">
|
||||
<i class="fa fa-language"></i>
|
||||
</a>
|
||||
<div class="navbar-dropdown is-boxed">
|
||||
<a class="navbar-item">中文简体</a>
|
||||
<a class="navbar-item">中文繁体</a>
|
||||
<a class="navbar-item">English</a>
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
class="navbar-item"
|
||||
target="_blank"
|
||||
@ -109,8 +119,6 @@ export default {
|
||||
this.$router.push({
|
||||
path: this.currgd.id.match("/[0-9]+:") + "search?q=" + this.param
|
||||
});
|
||||
// location.href =
|
||||
// this.currgd.id.match("/[0-9]+:") + "search?q=" + this.param;
|
||||
}
|
||||
},
|
||||
burgerClick() {
|
||||
|
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<hr/>
|
||||
<figure class="image">
|
||||
<img :src="imgurl" :class="!display?'is-hidden':''" @load="loading" />
|
||||
<center :class="display?'is-hidden':''">
|
||||
@ -7,6 +8,7 @@
|
||||
<span class="sr-only">Loading...</span>
|
||||
</center>
|
||||
</figure>
|
||||
<hr/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma-pageloader@0.3.0/dist/css/bulma-pageloader.min.css" />
|
||||
<headmd :option="headmd" v-show="headmd.display"></headmd>
|
||||
<div class="golist">
|
||||
<table class="table is-hoverable">
|
||||
@ -31,15 +32,15 @@
|
||||
<i class="fa fa-copy" title="copy link" aria-hidden="true"></i>
|
||||
</span>-->
|
||||
<span class="icon" @click.stop="go(file,'_blank')">
|
||||
<i class="fa fa-external-link" title="Open a new tab" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span class="icon">
|
||||
<i
|
||||
class="fa fa-download faa-shake animated-hover"
|
||||
title="Download"
|
||||
@click="go(file,'down')"
|
||||
class="fa fa-external-link faa-shake animated-hover"
|
||||
title="Open a new tab"
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</span>
|
||||
<span class="icon" @click="go(file,'down')">
|
||||
<i class="fa fa-download faa-shake animated-hover" title="Download"></i>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
@ -55,7 +56,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { utc2beijing, formatFileSize } from "@utils/AcrouUtil";
|
||||
import { utc2beijing, formatFileSize, checkoutPath } from "@utils/AcrouUtil";
|
||||
import axios from "@/utils/axios";
|
||||
import Markdown from "../common/Markdown";
|
||||
export default {
|
||||
data: function() {
|
||||
@ -148,53 +150,27 @@ export default {
|
||||
page_token: body.nextPageToken,
|
||||
page_index: body.curPageIndex
|
||||
};
|
||||
var exts = [
|
||||
"html",
|
||||
"php",
|
||||
"css",
|
||||
"go",
|
||||
"java",
|
||||
"js",
|
||||
"json",
|
||||
"py",
|
||||
"txt",
|
||||
"sh",
|
||||
"md",
|
||||
"mp4",
|
||||
"webm",
|
||||
"mkv",
|
||||
"bmp",
|
||||
"jpg",
|
||||
"jpeg",
|
||||
"png",
|
||||
"gif"
|
||||
];
|
||||
try {
|
||||
this.files = data.files.map(item => {
|
||||
var p = path + item.name;
|
||||
var p =
|
||||
path.replace("search", "search/") +
|
||||
checkoutPath(item.name, item);
|
||||
if (!path.match("/[0-9]+:search")) {
|
||||
// HEAD.md
|
||||
if (item.name === "HEAD.md") {
|
||||
this.headmd = {
|
||||
this.$emit("headmd", {
|
||||
display: true,
|
||||
file: item,
|
||||
path: p
|
||||
};
|
||||
path: path + item.name
|
||||
});
|
||||
}
|
||||
// REDEME.md
|
||||
if (item.name === "README.md") {
|
||||
this.readmemd = {
|
||||
this.$emit("readmemd", {
|
||||
display: true,
|
||||
file: item,
|
||||
path: p
|
||||
};
|
||||
}
|
||||
|
||||
var ext = p.split(".").pop();
|
||||
if (exts.indexOf(`${ext}`) >= 0) {
|
||||
p += "?a=view";
|
||||
} else {
|
||||
if (item.mimeType === "application/vnd.google-apps.folder") {
|
||||
p += "/";
|
||||
path: path + item.name
|
||||
});
|
||||
}
|
||||
}
|
||||
return {
|
||||
@ -229,24 +205,48 @@ export default {
|
||||
// },
|
||||
go(file, target) {
|
||||
let path = file.path;
|
||||
let cmd = this.$route.params.cmd || "";
|
||||
if (cmd === "search") {
|
||||
this.$refs.goSearchResult.go(file, target);
|
||||
if (path.match("/[0-9]+:search/")) {
|
||||
this.goSearchResult(file, target);
|
||||
return;
|
||||
}
|
||||
if (target === "down") {
|
||||
path = path.replace("?a=view", "");
|
||||
window.open(path)
|
||||
window.open(path);
|
||||
return;
|
||||
}
|
||||
if(target === '_blank'){
|
||||
window.open(path)
|
||||
}else{
|
||||
if (target === "_blank") {
|
||||
window.open(path);
|
||||
} else {
|
||||
this.$router.push({
|
||||
path: path
|
||||
});
|
||||
}
|
||||
},
|
||||
goSearchResult(file, target) {
|
||||
this.loading = true;
|
||||
let cur = window.current_drive_order;
|
||||
axios
|
||||
.post(`/${cur}:id2path`, { id: file.id })
|
||||
.then(res => {
|
||||
this.loading = false;
|
||||
let data = res.data;
|
||||
if (data) {
|
||||
var href = `/${cur}:${data}`;
|
||||
href = checkoutPath(href, file);
|
||||
if (target === "_blank") {
|
||||
window.open(href);
|
||||
} else {
|
||||
this.$router.push({
|
||||
path: href
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(e => {
|
||||
this.loading = false;
|
||||
console.log(e);
|
||||
});
|
||||
},
|
||||
getIcon(type) {
|
||||
return "#" + (this.icon[type] ? this.icon[type] : "icon-weizhi");
|
||||
}
|
||||
|
@ -1,8 +1,9 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<div class="video-content">
|
||||
<iframe
|
||||
width="100%"
|
||||
height="600px;"
|
||||
height="100%"
|
||||
:src="apiurl"
|
||||
frameborder="0"
|
||||
border="0"
|
||||
@ -12,6 +13,7 @@
|
||||
allowtransparency="true"
|
||||
allowfullscreen="true"
|
||||
></iframe>
|
||||
</div>
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<p class="card-header-title">
|
||||
@ -27,6 +29,12 @@
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<div class="field">
|
||||
<label class="label">下载地址</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" :value="decodeURIComponent(videourl)" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns is-mobile is-multiline has-text-centered">
|
||||
<div class="column" v-for="(item,index) in players" v-bind:key="index">
|
||||
<p class="heading">
|
||||
@ -47,30 +55,40 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data: function () {
|
||||
data: function() {
|
||||
return {
|
||||
apiurl: "",
|
||||
videourl: "",
|
||||
players: [
|
||||
{
|
||||
name: 'IINA',
|
||||
icon: 'https://www.iina.io/images/iina-icon-60.png',
|
||||
scheme: 'iina://weblink?url='
|
||||
name: "IINA",
|
||||
icon: "https://www.iina.io/images/iina-icon-60.png",
|
||||
scheme: "iina://weblink?url="
|
||||
},
|
||||
{
|
||||
name: 'PotPlayer',
|
||||
icon: 'https://cloud.jsonpop.cn/go2index/player/potplayer.png',
|
||||
scheme: 'potplayer://'
|
||||
name: "PotPlayer",
|
||||
icon: "https://cloud.jsonpop.cn/go2index/player/potplayer.png",
|
||||
scheme: "potplayer://"
|
||||
},
|
||||
{
|
||||
name: 'VLC',
|
||||
icon: 'https://cloud.jsonpop.cn/go2index/player/vlc.png',
|
||||
scheme: 'vlc://'
|
||||
name: "VLC",
|
||||
icon: "https://cloud.jsonpop.cn/go2index/player/vlc.png",
|
||||
scheme: "vlc://"
|
||||
},
|
||||
{
|
||||
name: 'Thunder',
|
||||
icon: 'https://cloud.jsonpop.cn/go2index/player/thunder.png',
|
||||
scheme: 'thunder://'
|
||||
name: "Thunder",
|
||||
icon: "https://cloud.jsonpop.cn/go2index/player/thunder.png",
|
||||
scheme: "thunder://"
|
||||
},
|
||||
{
|
||||
name: "MXPlayer",
|
||||
icon: "https://cloud.jsonpop.cn/go2index/player/mxplayer.png",
|
||||
scheme: "intent:"
|
||||
},
|
||||
{
|
||||
name: "nPlayer",
|
||||
icon: "https://cloud.jsonpop.cn/go2index/player/nplayer.png",
|
||||
scheme: "nplayer-"
|
||||
}
|
||||
]
|
||||
};
|
||||
@ -88,9 +106,9 @@ export default {
|
||||
this.apiurl = "https://api.jsonpop.cn/demo/blplyaer/?url=" + this.videourl;
|
||||
},
|
||||
computed: {
|
||||
getThunder () {
|
||||
return Buffer.from("AA" + this.videourl + "ZZ").toString("base64")
|
||||
getThunder() {
|
||||
return Buffer.from("AA" + this.videourl + "ZZ").toString("base64");
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user