Commit 64e82f42 authored by wanli's avatar wanli

更新前端以及修复一处bug

parent e92b215e
......@@ -27,6 +27,7 @@
"vue-codemirror": "^4.0.6",
"vue-count-to": "^1.0.13",
"vue-grid-layout": "^2.3.12",
"vue-loading-spinner": "^1.0.11",
"vue-plyr": "^7.0.0",
"vue-router": "^3.1.3",
"vuex": "^3.1.2"
......
<!DOCTYPE html>
<html lang="cn">
<html lang="zh">
<head id="head">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
......@@ -16,6 +16,7 @@
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.1.1/gsap.min.js"></script>
</body>
</html>
\ No newline at end of file
......@@ -11,7 +11,7 @@ export default {
mounted() {
let divTemp = document.createElement("title");
divTemp.innerHTML = defaultSetting.title;
document.getElementById("head").appendChild(divTemp)
document.querySelector("head").appendChild(divTemp)
},
}
</script>
......@@ -235,30 +235,30 @@ export function getTopicList(params) {
return request({
url: "/uowap/index",
method: "get",
params,
params
});
}
export function addFramework(params) {
export function getTabList(params) {
return request({
url: "/api/v1/evm_store/framework/add",
method: "post",
data: params,
url: "/uowap/index",
method: "get",
params
});
}
export function updateFramework(id, params) {
export function getAppList(params) {
return request({
url: `/api/v1/evm_store/framework/update/${id}`,
method: "post",
data: params,
url: "/uowap/index",
method: "get",
params
});
}
export function deleteFramework(params) {
export function getDataList(params) {
return request({
url: "/api/v1/evm_store/framework/delete",
method: "post",
data: params,
url: "/uowap/index",
method: "get",
params
});
}
......@@ -5,7 +5,6 @@ Vue.use(Router);
/* Layout */
import Layout from "@/layout";
import DevLayout from "@/layout/developer";
import StoreLayout from "@/layout/store";
/**
......@@ -74,7 +73,7 @@ export const constantRoutes = [
path: 'list',
name: 'AppList',
component: () => import('@/views/app-store/list'),
meta: { title: '更多应用', icon: 'home' }
meta: { title: '游戏', icon: 'home' }
}]
},
{
......@@ -146,22 +145,22 @@ export const constantRoutes = [
{
path: '/',
redirect: '/developer',
component: DevLayout,
component: StoreLayout,
children: [{
path: 'developer',
name: 'Developer',
component: () => import('@/views/developer/index'),
component: () => import('@/views/app-store/developer'),
meta: { title: '开发者中心', icon: 'home' }
}]
},
{
path: '/',
redirect: '/docs',
component: Layout,
component: StoreLayout,
children: [{
path: 'docs',
name: 'Document',
component: () => import('@/views/developer/docs'),
component: () => import('@/views/app-store/docs'),
meta: { title: '开发文档', icon: 'shangcheng' }
}]
},
......@@ -252,7 +251,19 @@ export const constantRoutes = [
component: () => import('@/views/error-pages/403'),
meta: { title: '403', icon: 'home' }
}]
}
},
{
path: '/',
redirect: '/not-found',
component: StoreLayout,
children: [{
path: 'not-found',
name: 'NotFound',
component: () => import('@/views/error-pages/not-found'),
meta: { title: 'not-found', icon: 'home' }
}]
},
{ path: '*', redirect: '/404', hidden: true }
];
// 404 page must be placed at the end !!!
......
<template>
<div class="app-container">
<div class="top">
<label>大家都在用</label>
</div>
<div class="content">
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
<p class="title">应用分类</p>
<div class="categories">
<p>分类</p>
<ul>
<li
:class="tabIndex == index ? 'active' : ''"
v-for="(item, index) in tabList"
:key="index"
@click="onTabClick(index)"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
{{ item.tabName }}
</li>
</ul>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
<div class="categories">
<p>子分类</p>
<ul>
<li
:class="tabChildIndex == index ? 'active' : ''"
v-for="(item, index) in tabChildList"
:key="index"
@click="onTabChildClick(index)"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
{{ item.tabName }}
</li>
</ul>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div v-show="!loading" class="content">
<div class="item" v-for="(item, index) in dataList" :key="index">
<img :src="item.icon" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="title">{{ item.name }}</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
......@@ -60,107 +44,128 @@
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
<p class="subtitle">{{ item.memo }}</p>
</div>
<button class="install">安装</button>
</div>
</div>
<circle5 v-show="loading"></circle5>
</div>
</template>
<script>
import { getTabList, getDataList } from "@/api/app-store";
import { Circle5 } from "vue-loading-spinner";
import StarRating from "vue-star-rating";
export default {
name: "AppCategory",
components: {
StarRating,
Circle5,
},
data() {
return {};
return {
loading: false,
tabIndex: 0,
tabChildIndex: 0,
tabList: [],
tabChildList: [],
query: {
method: "internal.getTabDetail",
serviceType: 20,
reqPageNum: 1,
uri: "b2b4752f0a524fe5ad900870f88c11ed",
maxResults: 25,
zone: "",
locale: "zh",
},
dataList: [],
};
},
methods: {
getTabList() {
this.loading = true;
getTabList(this.query)
.then((res) => {
if (res.tabInfo && res.tabInfo.length) {
this.tabList = res.tabInfo;
this.tabChildList = this.tabList[this.tabIndex].tabInfo;
}
})
.catch((err) => {
if (err.tabInfo && err.tabInfo.length) {
this.tabList = err.tabInfo;
this.tabChildList = this.tabList[this.tabIndex].tabInfo;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getDataList();
}
})
.finally(() => {
this.loading = false;
});
},
getDataList() {
getDataList(this.query)
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
if (err.layoutData && err.layoutData.length) {
this.dataList = err.layoutData[0].dataList;
}
});
},
onTabClick(index) {
this.tabIndex = index;
this.tabChildList = this.tabList[index].tabInfo;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getTabList();
},
onTabChildClick(index) {
this.tabChildIndex = index;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getTabList();
},
},
created() {
this.getTabList();
},
computed: {},
methods: {},
beforeMount() {},
};
</script>
<style lang="scss" scoped>
div.app-container {
margin: 20px 0px;
& > div.top {
display: flex;
justify-content: space-between;
& > label {
& > p {
margin: 0px;
font-size: 20px;
font-size: 18px;
}
& > div.categories {
display: flex;
flex-direction: row;
margin: 20px 0px;
font-size: 14px;
& > p {
cursor: pointer;
width: 100px;
margin: 0px;
display: inline-flex;
align-items: center;
}
& > ul {
flex: 1;
display: grid;
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: repeat(auto-fill, 100px);
& > li {
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
& > img {
width: 20px;
height: 20px;
&.active {
color: #4cd1e0;
}
&:hover {
color: #4cd1e0;
}
}
}
}
......
<template>
<div class="app-container">
<img
src="http://gtms01.alicdn.com/tps/i1/TB1rGYSGFXXXXawXXXXDcMi7VXX-1440-336.png"
/>
<div class="service-group">
<p>开发者实名认证</p>
<p>上传新应用</p>
<p>认领新应用</p>
<p>我的应用</p>
<p>申请推广</p>
</div>
<p style="text-align: center;color: red;">开发者中心尚未完善,敬请期待!!!</p>
<div class="help-group">
<dl class="service">
<dt>管理应用<s></s></dt>
<dd>我的应用</dd>
<dd>上传新应用</dd>
<dd>认领应用</dd>
</dl>
<dl class="service">
<dt>开发者身份管理<s></s></dt>
<dd>开发者实名认证</dd>
<dd>查看开发者身份</dd>
<dd>更换认证支付宝账号</dd>
<dd>修改联系人信息</dd>
</dl>
<dl class="service">
<dt>推广<s></s></dt>
<dd>申请推广</dd>
<dd>应用推广</dd>
<dd>礼包权益</dd>
</dl>
<dl class="service">
<dt>我的账户<s></s></dt>
<dd>我的充值记录</dd>
<dd>我的收益</dd>
<dd>开发票</dd>
</dl>
</div>
<div class="help-group">
<dl class="service">
<dt>EVM服务<s></s></dt>
<dd>云手机助手</dd>
<dd>云空间</dd>
<dd>主题中心</dd>
<dd>应用中心</dd>
</dl>
<dl class="service">
<dt>EVM版本<s></s></dt>
<dd>
<a target="_blank" href="http://www.yunos.com/yunos30.html"
>EVM 3.0</a
>
</dd>
</dl>
<dl class="service">
<dt class="touchable">帮助中心</dt>
<dd><a target="_blank" href="#help/help">帮助中心首页</a></dd>
<dd><a target="_blank" href="#help/agreement">平台协议</a></dd>
<dd><a target="_blank" href="#help/document">开发者文档</a></dd>
<dd><a target="_blank" href="#help/qa">Q&A</a></dd>
</dl>
<dl class="service">
<dt>关注EVM<s></s></dt>
<dd>
<a
class="g-lw-entry"
href="javascript:void(0);"
style="padding: 0; border: none"
>微信公众号</a
>
</dd>
<dd>
<img
width="120"
height="120"
title="扫描二维码关注 EVM 官方公众号"
alt="EVM微信公众号"
src="../../assets/images/evm-mp.jpg"
/>
</dd>
</dl>
</div>
</div>
</template>
<script>
export default {
name: "Developer",
data() {
return {};
},
created() {},
mounted() {},
methods: {},
};
</script>
<style lang="scss">
div.app-container {
& > img {
width: 100%;
height: auto;
}
& > div.service-group {
display: grid;
justify-content: center;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: 1fr;
& > p {
text-align: center;
}
}
& > div.help-group {
margin: 50px 0px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
& > dl.service {
& > dt {
margin: 10px 0px;
}
& > dd {
color: grey;
font-size: 14px;
}
}
}
}
</style>
<template>
<div class="container">
<iframe src="https://www.yuque.com/books/share/07c6dc3d-5343-45dd-a7d2-fd5ccaa05825" height="100%" width="100%" name="demo" scrolling="auto" frameborder="0"></iframe>
<iframe
src="https://www.yuque.com/books/share/07c6dc3d-5343-45dd-a7d2-fd5ccaa05825"
height="100%"
width="100%"
name="demo"
scrolling="auto"
frameborder="0"
></iframe>
</div>
</template>
<script>
export default {
name: "Document",
components: {},
......@@ -13,7 +19,6 @@ export default {
},
computed: {},
methods: {},
beforeMount() {},
};
</script>
<style lang="scss" scoped>
......
<template>
<div class="app-container">
<div class="top">
<label>大家都在用</label>
</div>
<div class="content">
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
<p class="title">应用分类</p>
<div class="categories">
<p>分类</p>
<ul>
<li
:class="tabIndex == index ? 'active' : ''"
v-for="(item, index) in tabList"
:key="index"
@click="onTabClick(index)"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
{{ item.tabName }}
</li>
</ul>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
<div class="categories">
<p>子分类</p>
<ul>
<li
:class="tabChildIndex == index ? 'active' : ''"
v-for="(item, index) in tabChildList"
:key="index"
@click="onTabChildClick(index)"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
{{ item.tabName }}
</li>
</ul>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div v-show="!loading" class="content">
<div class="item" v-for="(item, index) in dataList" :key="index">
<img :src="item.icon" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="title">{{ item.name }}</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
......@@ -60,107 +44,128 @@
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
</div>
<button class="install">安装</button>
</div>
<div class="item">
<img src="../../assets/images/evue-logo.png" alt="icon" />
<div class="text">
<p class="title">EVUE</p>
<p class="subtitle">
<star-rating
v-bind:rating="3.5"
v-bind:increment="0.1"
v-bind:max-rating="5"
v-bind:star-size="15"
v-bind:read-only="true"
inactive-color="#9E9E9E"
active-color="#FFC83D"
>
</star-rating>
</p>
<p class="subtitle">八零八零八附带上方</p>
<p class="subtitle">{{ item.memo }}</p>
</div>
<button class="install">安装</button>
</div>
</div>
<circle5 v-show="loading"></circle5>
</div>
</template>
<script>
import { getTabList, getDataList } from "@/api/app-store";
import { Circle5 } from "vue-loading-spinner";
import StarRating from "vue-star-rating";
export default {
name: "AppList",
name: "AppCategory",
components: {
StarRating,
Circle5,
},
data() {
return {};
return {
loading: false,
tabIndex: 0,
tabChildIndex: 0,
tabList: [],
tabChildList: [],
query: {
method: "internal.getTabDetail",
serviceType: 20,
reqPageNum: 1,
uri: "56a37d6c494545f98aace3da717845b7",
maxResults: 25,
zone: "",
locale: "zh",
},
dataList: [],
};
},
methods: {
getTabList() {
this.loading = true;
getTabList(this.query)
.then((res) => {
if (res.tabInfo && res.tabInfo.length) {
this.tabList = res.tabInfo;
this.tabChildList = this.tabList[this.tabIndex].tabInfo;
}
})
.catch((err) => {
if (err.tabInfo && err.tabInfo.length) {
this.tabList = err.tabInfo;
this.tabChildList = this.tabList[this.tabIndex].tabInfo;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getDataList();
}
})
.finally(() => {
this.loading = false;
});
},
getDataList() {
getDataList(this.query)
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
if (err.layoutData && err.layoutData.length) {
this.dataList = err.layoutData[0].dataList;
}
});
},
onTabClick(index) {
this.tabIndex = index;
this.tabChildList = this.tabList[index].tabInfo;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getTabList();
},
onTabChildClick(index) {
this.tabChildIndex = index;
this.query.uri = this.tabChildList[this.tabChildIndex].realTabId;
this.getTabList();
},
},
created() {
this.getTabList();
},
computed: {},
methods: {},
beforeMount() {},
};
</script>
<style lang="scss" scoped>
div.app-container {
margin: 20px 0px;
& > div.top {
display: flex;
justify-content: space-between;
& > label {
& > p {
margin: 0px;
font-size: 20px;
font-size: 18px;
}
& > div.categories {
display: flex;
flex-direction: row;
margin: 20px 0px;
font-size: 14px;
& > p {
cursor: pointer;
width: 100px;
margin: 0px;
display: inline-flex;
align-items: center;
}
& > ul {
flex: 1;
display: grid;
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: repeat(auto-fill, 100px);
& > li {
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 14px;
& > img {
width: 20px;
height: 20px;
&.active {
color: #4cd1e0;
}
&:hover {
color: #4cd1e0;
}
}
}
}
......
......@@ -253,6 +253,15 @@
</div>
</div>
</div>
<div v-show="navIndex === 7" class="right">
<p class="title">开放接口</p>
<div class="content">
<div style="width: 100%; height: auto">
<p><input type="text" disabled placeholder="接口密钥" /></p>
<p><button style="width: auto;height: auto;">生成密钥</button></p>
</div>
</div>
</div>
</div>
</template>
<script>
......@@ -269,6 +278,7 @@ export default {
"联系我们",
"设备绑定",
"我的账号",
"开放接口",
],
navIndex: 0,
};
......
<template>
<div class="app-container">
<div class="top">
<label>大家都在用</label>
<p>
<label @click="toggleMenu('0057c0f3380c49dc9731bdba94420d9c')"
>应用排行</label
>
<label @click="toggleMenu('5734225f9f4441c99553f00d06553831')"
>游戏排行</label
>
</p>
<p>
<span v-for="(item, index) in tabList" :key="index">今日流行</span>
<span>上升最快</span>
<span>本周热议</span>
<span>最近更新</span>
</p>
</div>
<div class="content">
<div class="item">
......@@ -128,18 +141,58 @@
</div>
</template>
<script>
import { getDataList } from "@/api/app-store";
import StarRating from "vue-star-rating";
export default {
name: "AppList",
name: "AppRank",
components: {
StarRating,
},
data() {
return {};
return {
tabIndex: 0,
tabChildIndex: 0,
tabList: [],
tabChildList: [],
dataList: [],
query: {
method: "internal.getTabDetail",
serviceType: 20,
reqPageNum: 1,
uri: "0057c0f3380c49dc9731bdba94420d9c",
maxResults: 25,
zone: "",
locale: "zh",
},
};
},
computed: {},
methods: {},
beforeMount() {},
methods: {
getTabList() {
getDataList(this.query)
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
});
},
getDataList() {
getDataList()
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
});
},
toggleMenu(uri) {
console.log(uri);
},
},
created() {
this.getTabList();
},
};
</script>
<style lang="scss" scoped>
......@@ -148,19 +201,32 @@ div.app-container {
& > div.top {
display: flex;
justify-content: space-between;
& > label {
margin: 0px;
font-size: 20px;
}
margin-bottom: 20px;
& > p {
cursor: pointer;
margin: 0px;
display: inline-flex;
align-items: center;
font-size: 14px;
& > img {
width: 20px;
height: 20px;
& > label {
cursor: pointer;
margin: 0px 10px;
font-size: 18px;
&:hover {
color: #4cd1e0;
text-decoration: underline;
}
&.active {
color: #4cd1e0;
text-decoration: underline;
}
}
& > span {
cursor: pointer;
margin: 0px 10px;
font-size: 13px;
&.active {
color: #4cd1e0;
}
}
}
}
......
<template>
<div>
<div class="m-index">
<div
class="banner"
style="background: url(http://gtms01.alicdn.com/tps/i1/TB1rGYSGFXXXXawXXXXDcMi7VXX-1440-336.png) no-repeat center 0 #657284;"
>
<a class="btn" href="#newapp/upload"></a>
</div>
<el-col :span="12" :offset="6">
<el-row>
<div class="service-group">
<p class="nav2">
<a class="one one1" href="#certify/certify"></a>
开发者实名认证
</p>
<p class="nav2">
<a class="one one2" href="#newapp/upload"></a>
上传新应用
</p>
<p class="nav2">
<a class="one one3" href="#claim/sift"></a>
认领新应用
</p>
<p class="nav2">
<a class="one one4" href="#myapp/spu_list"></a>
我的应用
</p>
<p class="nav2">
<a class="one one5" href="#generalize"></a>
申请推广
</p>
</div>
</el-row>
</el-col>
</div>
<div style="margin: 50px 0px">
<el-row>
<el-col :span="12" :offset="6">
<el-row>
<el-col :span="6">
<dl class="service">
<dt>EVM服务<s></s></dt>
<dd>
<a target="_blank" href="http://zhushou.yunos.com"
>云手机助手</a
>
</dd>
<dd>
<a target="_blank" href="http://my.yunos.com">云空间</a>
</dd>
<dd>
<a target="_blank" href="http://zhuti.yunos.com">主题中心</a>
</dd>
<dd>
<a target="_blank" href="http://apps.yunos.com">应用中心</a>
</dd>
</dl>
</el-col>
<el-col :span="6">
<dl class="service">
<dt>EVM版本<s></s></dt>
<dd>
<a target="_blank" href="http://www.yunos.com/yunos30.html"
>EVM 3.0</a
>
</dd>
</dl>
</el-col>
<el-col :span="6">
<dl class="service">
<dt class="touchable">帮助中心</dt>
<dd><a target="_blank" href="#help/help">帮助中心首页</a></dd>
<dd><a target="_blank" href="#help/agreement">平台协议</a></dd>
<dd><a target="_blank" href="#help/document">开发者文档</a></dd>
<dd><a target="_blank" href="#help/qa">Q&A</a></dd>
</dl>
</el-col>
<el-col :span="6">
<dl class="service">
<dt>关注EVM<s></s></dt>
<dd>
<a
class="g-lw-entry"
href="javascript:void(0);"
style="padding: 0; border: none"
>微信公众号</a
>
</dd>
<dd>
<img
width="120"
height="120"
title="扫描二维码关注 EVM 官方公众号"
alt="EVM微信公众号"
src="../../assets/images/evm-mp.jpg"
/>
</dd>
</dl>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
</div>
</template>
<script>
export default {
name: "Developer",
data() {
return {};
},
created() {},
mounted() {},
methods: {},
};
</script>
<style lang="scss">
.text {
font-size: 14px;
}
.item {
margin-bottom: 18px;
}
dl.service {
dt {
margin: 15px 0px;
}
dd {
margin-inline-start: 20px !important;
}
}
.service-group {
display: flex;
flex-direction: row;
justify-content: space-around;
& > p {
&.nav2 {
padding: 4px 0 0 106px;
height: 120px;
font-size: 14px;
}
& > a {
width: 15px;
height: 15px;
}
}
}
</style>
<template>
<div class="row">
<div class="col-md-6">
<svg
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="0 0 800 600"
>
<g>
<defs>
<clipPath id="GlassClip">
<path
d="M380.857,346.164c-1.247,4.651-4.668,8.421-9.196,10.06c-9.332,3.377-26.2,7.817-42.301,3.5
s-28.485-16.599-34.877-24.192c-3.101-3.684-4.177-8.66-2.93-13.311l7.453-27.798c0.756-2.82,3.181-4.868,6.088-5.13
c6.755-0.61,20.546-0.608,41.785,5.087s33.181,12.591,38.725,16.498c2.387,1.682,3.461,4.668,2.705,7.488L380.857,346.164z"
/>
</clipPath>
<clipPath id="cordClip">
<rect width="800" height="600" />
</clipPath>
</defs>
<g id="planet">
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-miterlimit="10"
cx="572.859"
cy="108.803"
r="90.788"
/>
<circle
id="craterBig"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-miterlimit="10"
cx="548.891"
cy="62.319"
r="13.074"
/>
<circle
id="craterSmall"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-miterlimit="10"
cx="591.743"
cy="158.918"
r="7.989"
/>
<path
id="ring"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
d="
M476.562,101.461c-30.404,2.164-49.691,4.221-49.691,8.007c0,6.853,63.166,12.408,141.085,12.408s141.085-5.555,141.085-12.408
c0-3.378-15.347-4.988-40.243-7.225"
/>
<path
id="ringShadow"
opacity="0.5"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
d="
M483.985,127.43c23.462,1.531,52.515,2.436,83.972,2.436c36.069,0,68.978-1.19,93.922-3.149"
/>
</g>
<g id="stars">
<g id="starsBig">
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="518.07"
y1="245.375"
x2="518.07"
y2="266.581"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="508.129"
y1="255.978"
x2="528.01"
y2="255.978"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="154.55"
y1="231.391"
x2="154.55"
y2="252.598"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="144.609"
y1="241.995"
x2="164.49"
y2="241.995"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="320.135"
y1="132.746"
x2="320.135"
y2="153.952"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="310.194"
y1="143.349"
x2="330.075"
y2="143.349"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="200.67"
y1="483.11"
x2="200.67"
y2="504.316"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="210.611"
y1="493.713"
x2="190.73"
y2="493.713"
/>
</g>
</g>
<g id="starsSmall">
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="432.173"
y1="380.52"
x2="432.173"
y2="391.83"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="426.871"
y1="386.175"
x2="437.474"
y2="386.175"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="489.555"
y1="299.765"
x2="489.555"
y2="308.124"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="485.636"
y1="303.945"
x2="493.473"
y2="303.945"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="231.468"
y1="291.009"
x2="231.468"
y2="299.369"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="227.55"
y1="295.189"
x2="235.387"
y2="295.189"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="244.032"
y1="547.539"
x2="244.032"
y2="555.898"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="247.95"
y1="551.719"
x2="240.113"
y2="551.719"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="186.359"
y1="406.967"
x2="186.359"
y2="415.326"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="190.277"
y1="411.146"
x2="182.44"
y2="411.146"
/>
</g>
<g>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="480.296"
y1="406.967"
x2="480.296"
y2="415.326"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
x1="484.215"
y1="411.146"
x2="476.378"
y2="411.146"
/>
</g>
</g>
<g id="circlesBig">
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="588.977"
cy="255.978"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="450.066"
cy="320.259"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="168.303"
cy="353.753"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="429.522"
cy="201.185"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="200.67"
cy="176.313"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="133.343"
cy="477.014"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="283.521"
cy="568.033"
r="7.952"
/>
<circle
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-miterlimit="10"
cx="413.618"
cy="482.387"
r="7.952"
/>
</g>
<g id="circlesSmall">
<circle fill="#0E0620" cx="549.879" cy="296.402" r="2.651" />
<circle fill="#0E0620" cx="253.29" cy="229.24" r="2.651" />
<circle fill="#0E0620" cx="434.824" cy="263.931" r="2.651" />
<circle fill="#0E0620" cx="183.708" cy="544.176" r="2.651" />
<circle fill="#0E0620" cx="382.515" cy="530.923" r="2.651" />
<circle fill="#0E0620" cx="130.693" cy="305.608" r="2.651" />
<circle fill="#0E0620" cx="480.296" cy="477.014" r="2.651" />
</g>
</g>
<g id="spaceman" clip-path="url(cordClip)">
<path
id="cord"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M273.813,410.969c0,0-54.527,39.501-115.34,38.218c-2.28-0.048-4.926-0.241-7.841-0.548
c-68.038-7.178-134.288-43.963-167.33-103.87c-0.908-1.646-1.793-3.3-2.654-4.964c-18.395-35.511-37.259-83.385-32.075-118.817"
/>
<path
id="backpack"
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M338.164,454.689l-64.726-17.353c-11.086-2.972-17.664-14.369-14.692-25.455l15.694-58.537
c3.889-14.504,18.799-23.11,33.303-19.221l52.349,14.035c14.504,3.889,23.11,18.799,19.221,33.303l-15.694,58.537
C360.647,451.083,349.251,457.661,338.164,454.689z"
/>
<g id="antenna">
<line
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
x1="323.396"
y1="236.625"
x2="295.285"
y2="353.753"
/>
<circle
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
cx="323.666"
cy="235.617"
r="6.375"
/>
</g>
<g id="armR">
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M360.633,363.039c1.352,1.061,4.91,5.056,5.824,6.634l27.874,47.634c3.855,6.649,1.59,15.164-5.059,19.02l0,0
c-6.649,3.855-15.164,1.59-19.02-5.059l-5.603-9.663"
/>
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M388.762,434.677c5.234-3.039,7.731-8.966,6.678-14.594c2.344,1.343,4.383,3.289,5.837,5.793
c4.411,7.596,1.829,17.33-5.767,21.741c-7.596,4.411-17.33,1.829-21.741-5.767c-1.754-3.021-2.817-5.818-2.484-9.046
C375.625,437.355,383.087,437.973,388.762,434.677z"
/>
</g>
<g id="armL">
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M301.301,347.66c-1.702,0.242-5.91,1.627-7.492,2.536l-47.965,27.301c-6.664,3.829-8.963,12.335-5.134,18.999h0
c3.829,6.664,12.335,8.963,18.999,5.134l9.685-5.564"
/>
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M241.978,395.324c-3.012-5.25-2.209-11.631,1.518-15.977c-2.701-0.009-5.44,0.656-7.952,2.096
c-7.619,4.371-10.253,14.09-5.883,21.71c4.371,7.619,14.09,10.253,21.709,5.883c3.03-1.738,5.35-3.628,6.676-6.59
C252.013,404.214,245.243,401.017,241.978,395.324z"
/>
</g>
<g id="body">
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M353.351,365.387c-7.948,1.263-16.249,0.929-24.48-1.278c-8.232-2.207-15.586-6.07-21.836-11.14
c-17.004,4.207-31.269,17.289-36.128,35.411l-1.374,5.123c-7.112,26.525,8.617,53.791,35.13,60.899l0,0
c26.513,7.108,53.771-8.632,60.883-35.158l1.374-5.123C371.778,395.999,365.971,377.536,353.351,365.387z"
/>
<path
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M269.678,394.912L269.678,394.912c26.3,20.643,59.654,29.585,93.106,25.724l2.419-0.114"
/>
</g>
<g id="legs">
<g id="legR">
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M312.957,456.734l-14.315,53.395c-1.896,7.07,2.299,14.338,9.37,16.234l0,0c7.07,1.896,14.338-2.299,16.234-9.37l17.838-66.534
C333.451,455.886,323.526,457.387,312.957,456.734z"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
x1="304.883"
y1="486.849"
x2="330.487"
y2="493.713"
/>
</g>
<g id="legL">
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M296.315,452.273L282,505.667c-1.896,7.07-9.164,11.265-16.234,9.37l0,0c-7.07-1.896-11.265-9.164-9.37-16.234l17.838-66.534
C278.993,441.286,286.836,447.55,296.315,452.273z"
/>
<line
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
x1="262.638"
y1="475.522"
x2="288.241"
y2="482.387"
/>
</g>
</g>
<g id="head">
<ellipse
transform="matrix(0.259 -0.9659 0.9659 0.259 -51.5445 563.2371)"
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
cx="341.295"
cy="315.211"
rx="61.961"
ry="60.305"
/>
<path
id="headStripe"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M330.868,261.338c-7.929,1.72-15.381,5.246-21.799,10.246"
/>
<path
fill="#FFFFFF"
stroke="#0E0620"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
d="
M380.857,346.164c-1.247,4.651-4.668,8.421-9.196,10.06c-9.332,3.377-26.2,7.817-42.301,3.5s-28.485-16.599-34.877-24.192
c-3.101-3.684-4.177-8.66-2.93-13.311l7.453-27.798c0.756-2.82,3.181-4.868,6.088-5.13c6.755-0.61,20.546-0.608,41.785,5.087
s33.181,12.591,38.725,16.498c2.387,1.682,3.461,4.668,2.705,7.488L380.857,346.164z"
/>
<g clip-path="url(#GlassClip)">
<polygon
id="glassShine"
fill="none"
stroke="#0E0620"
stroke-width="3"
stroke-miterlimit="10"
points="
278.436,375.599 383.003,264.076 364.393,251.618 264.807,364.928 "
/>
</g>
</g>
</g>
</g>
</svg>
</div>
<div class="col-md-6">
<h1>404</h1>
<h2>UH OH! 页面丢失</h2>
<p>您所寻找的页面不存在。你可以点击下面的按钮,返回主页。</p>
<button class="btn green">返回首页</button>
</div>
</div>
</template>
<script>
import gsap from 'gsap';
export default {
name: "NotFound",
mounted() {
gsap.set("svg", { visibility: "visible" });
gsap.to("#headStripe", {
y: 0.5,
rotation: 1,
yoyo: true,
repeat: -1,
ease: "sine.inOut",
duration: 1,
});
gsap.to("#spaceman", {
y: 0.5,
rotation: 1,
yoyo: true,
repeat: -1,
ease: "sine.inOut",
duration: 1,
});
gsap.to("#craterSmall", {
x: -3,
yoyo: true,
repeat: -1,
duration: 1,
ease: "sine.inOut",
});
gsap.to("#craterBig", {
x: 3,
yoyo: true,
repeat: -1,
duration: 1,
ease: "sine.inOut",
});
gsap.to("#planet", {
rotation: -2,
yoyo: true,
repeat: -1,
duration: 1,
ease: "sine.inOut",
transformOrigin: "50% 50%",
});
gsap.to("#starsBig g", {
rotation: "random(-30,30)",
transformOrigin: "50% 50%",
yoyo: true,
repeat: -1,
ease: "sine.inOut",
});
gsap.fromTo(
"#starsSmall g",
{ scale: 0, transformOrigin: "50% 50%" },
{
scale: 1,
transformOrigin: "50% 50%",
yoyo: true,
repeat: -1,
stagger: 0.1,
}
);
gsap.to("#circlesSmall circle", {
y: -4,
yoyo: true,
duration: 1,
ease: "sine.inOut",
repeat: -1,
});
gsap.to("#circlesBig circle", {
y: -2,
yoyo: true,
duration: 1,
ease: "sine.inOut",
repeat: -1,
});
gsap.set("#glassShine", { x: -68 });
gsap.to("#glassShine", {
x: 80,
duration: 2,
rotation: -30,
ease: "expo.inOut",
transformOrigin: "50% 50%",
repeat: -1,
repeatDelay: 8,
delay: 2,
});
},
};
</script>
<style lang="scss" scoped>
:root {
--blue: #0e0620;
--white: #fff;
--green: #2ccf6d;
}
div.row {
display: flex;
flex-direction: row;
& > div.col-md-6 {
width: 50%;
button.btn {
z-index: 1;
display: inline-block;
line-height: 1.5;
overflow: hidden;
background: transparent;
position: relative;
padding: 8px 50px;
border-radius: 30px;
cursor: pointer;
font-size: 1em;
letter-spacing: 2px;
-webkit-transition: 0.2s ease;
transition: 0.2s ease;
font-weight: bold;
margin: 5px 0px;
text-align: center;
white-space: nowrap;
vertical-align: middle;
text-transform: none;
&.green {
border: 4px solid var(--green);
color: var(--blue);
&:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 0%;
height: 100%;
background: var(--green);
z-index: -1;
-webkit-transition: 0.2s ease;
transition: 0.2s ease;
}
&:hover {
color: var(--white);
background: var(--green);
-webkit-transition: 0.2s ease;
transition: 0.2s ease;
&:before {
width: 100%;
}
}
}
}
}
}
</style>
\ No newline at end of file
......@@ -55,6 +55,10 @@ module.exports = {
configureWebpack: (config) => {
// debug JS
config.devtool = "source-map";
config.externals = {
'gsap': 'gsap'
}
},
chainWebpack(config) {
config.plugins.delete("preload"); // TODO: need test
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment