mirrors/pig-ui
1
0
Fork 0
mirror of https://gitee.com/log4j/pig-ui.git synced 2024-12-22 12:58:55 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

💄 更新界面和样式文件。首页样式调整

Browse Source
This commit is contained in:
冷冷 2018-09-02 19:00:22 +08:00
parent cc74a710e9
commit 9f55109ec9
1 changed files with 80 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

117
src/page/wel.vue
View File

@ -18,7 +18,49 @@
<template>
<div class="pull-chheight wel-contailer">
<div class="banner-text">
<h2>{{website.wel.title}}</h2>
<h2>Pig Microservice Architecture</h2>
<span align="center">
<img src="https://img.shields.io/badge/Avue-1.5.4.RC1-green.svg" alt="Build Status">
<img src="https://img.shields.io/badge/Spring%20Cloud-EdgwareSR4-orange.svg" alt="Coverage Status">
<img src="https://img.shields.io/badge/Spring%20Boot-1.5.13-blue.svg" alt="Downloads">
<img src="https://img.shields.io/npm/v/npm.svg" alt="Version">
<img src="https://img.shields.io/npm/l/vue.svg" alt="License">
</span>
<br/>
<span>
<el-collapse v-model="activeNames">
<el-collapse-item title="项目官网" name="1">
<a href="https://pig4cloud.com/" target="_blank">
<div>Spring Cloud 最完整运用 </div>
<div>深度定制兼容 1.0 、 2.0</div>
<div>覆盖常见的业务使用场景</div>
</a>
</el-collapse-item>
<el-collapse-item title="开发文档" name="2">
<a href="https://www.kancloud.cn/lengleng/pig-guide/550736" target="_blank">
<div>微服务开发平台pig 的开发文档</div>
<div>实现细节、监控落地、生产部署文档</div>
</a>
</el-collapse-item>
<el-collapse-item title="配套视频" name="3">
<a href="https://www.bilibili.com/video/av20229859/" target="_blank">
<div>源码部署细节</div>
<div>OAuth2 源码讲解</div>
<div>监控pinpoint 使用</div>
</a>
</el-collapse-item>
<el-collapse-item title="最新版本" name="4">
<a href="https://pig4cloud.com/pigx.html" target="_blank">
<div>基于Spring Cloud Gateway</div>
<div>基于Spring Cloud Finchley.SR1</div>
<div>基于Spring Boot 2.0.4.RELEASE</div>
<div>基于开源LCN 分布式事务解决方案深度定制</div>
</a>
</el-collapse-item>
</el-collapse>
</span>
<span>
</span><br>
<span :class="['actor',{typeing:isText}]">{{text}}</span>
</div>
</div>
@ -27,77 +69,78 @@
<script>
import { mapGetters } from "vuex";
export default {
name: "wel",
name: 'wel',
data() {
return {
activeNames: ['1', '2', '3', '4'],
DATA: [],
text: "",
actor: "",
text: '',
actor: '',
count: 0,
isText: false
};
}
},
computed: {
...mapGetters(["website"])
...mapGetters(['website'])
},
created() {
this.DATA = this.website.wel.list;
this.actor = this.DATA[this.count] || "";
this.DATA = this.website.wel.list
this.actor = this.DATA[this.count] || '';
setTimeout(() => {
this.isText = true;
this.setData();
}, 2000);
this.isText = true
this.setData()
}, 2000)
},
methods: {
getData() {
if (this.count < this.DATA.length - 1) {
this.count++;
this.count++
} else {
this.count = 0;
this.count = 0
}
this.isText = true;
this.actor = this.DATA[this.count];
this.isText = true
this.actor = this.DATA[this.count]
},
setData() {
let num = 0;
let count = 0;
let active = false;
let timeoutstart = 5000;
let timeoutend = 1000;
let timespeed = 10;
let num = 0
let count = 0
let active = false
let timeoutstart = 5000
let timeoutend = 1000
let timespeed = 10
setInterval(() => {
if (this.isText) {
if (count == this.actor.length) {
active = true;
active = true
} else {
active = false;
active = false
}
if (active) {
num--;
this.text = this.actor.substr(0, num);
num--
this.text = this.actor.substr(0, num)
if (num == 0) {
this.isText = false;
this.isText = false
setTimeout(() => {
count = 0;
this.getData();
}, timeoutend);
count = 0
this.getData()
}, timeoutend)
}
} else {
num++;
this.text = this.actor.substr(0, num);
num++
this.text = this.actor.substr(0, num)
if (num == this.actor.length) {
this.isText = false;
this.isText = false
setTimeout(() => {
this.isText = true;
count = this.actor.length;
}, timeoutstart);
this.isText = true
count = this.actor.length
}, timeoutstart)
}
}
}
}, timespeed);
}, timespeed)
}
}
};
}
</script>
<style scoped="scoped" lang="scss">