Skip to content

B
beyond-clouds-front
Commit 32a32b8c by yanju
Options

pages

parent f3967649
Showing with 357 additions and 137 deletions
components/common/icon/src/icon.vue
......@@ -53,11 +53,9 @@
transition:.5s ease;
display:inline-block;
padding-bottom: 5*$length;
vertical-align: middle;
&:before{
display: inline-block;
height:100%;
vertical-align: middle;
}
}
</style>
components/pc/pageHeader.vue
......@@ -29,11 +29,13 @@
</p>
</div>
<div class="header-center-r" v-if="user_id">
<yun-icon name="add" color="#ccc" hoverColor="#8CD88C" @mouseover.native="showHideBox1=true"></yun-icon>
<yun-icon name="notification" color="#ccc" hoverColor="#F8A06F"></yun-icon>
<img class="user-photo" :src="photo" alt="" @mouseover="showHideBox2=true">
<yun-icon name="add" color="#ccc" hoverColor="#8CD88C"
@mouseover.native="changeStateShowBox(1)" @mouseleave.native="changeStateHideBox(1)"></yun-icon>
<yun-icon name="notification" color="#ccc" hoverColor="#F8A06F"
@mouseover.native="changeStateShowBox(3)" @mouseleave.native="changeStateHideBox(3)"></yun-icon>
<img class="user-photo" @mouseleave="changeStateHideBox(2)" :src="photo" alt="" @mouseover="changeStateShowBox(2)">
<transition name="fade">
<ul class="abs-box abs-box1" v-if="showHideBox1" @mouseleave="showHideBox1=false">
<ul class="abs-box abs-box1" v-if="showHideBox1" @mouseleave="changeStateHideBox(1)">
<li>发布项目</li>
<li>写博客</li>
<li>发表动态</li>
......@@ -42,7 +44,7 @@
</ul>
</transition>
<transition name="fade">
<ul class="abs-box abs-box2" v-if="showHideBox2" @mouseleave="showHideBox2=false">
<ul class="abs-box abs-box2" v-if="showHideBox2" @mouseleave="changeStateHideBox(2)">
<li>我的主页</li>
<li>我的喜欢</li>
<li>我的收藏</li>
......@@ -51,6 +53,9 @@
<li>安全退出</li>
</ul>
</transition>
<transition name="fade">
<alerts-card class="abs-box3" v-if="showHideBox3" @mouseleave.native="changeStateHideBox(3)"></alerts-card>
</transition>
</div>
</div>
......@@ -63,6 +68,9 @@
<script>
import AlertsCard from './alertsMessage/alertsCard';
export default {
name:'container-header',
data(){
......@@ -71,9 +79,62 @@
photo:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2575047779,2966283883&fm=26&gp=0.jpg',
showHideBox1:false,
showHideBox2:false,
showHideBox3:false,
searchValue:'',
hideBox1Time:null,
hideBox2Time:null,
hideBox3Time:null,
}
}
},
components:{
AlertsCard
},
mounted(){
},
methods:{
changeStateHideBox(...arg){
if(arg.indexOf(1)===0){
clearTimeout(this.hideBox1Time);
this.hideBox1Time = setTimeout(()=>{
this.showHideBox1=false
},800)
}
if(arg.indexOf(2)===0){
clearTimeout(this.hideBox2Time);
this.hideBox2Time = setTimeout(()=>{
this.showHideBox2=false
},800)
}
if(arg.indexOf(3)===0){
clearTimeout(this.hideBox3Time);
this.hideBox3Time = setTimeout(()=>{
this.showHideBox3=false
},800)
}
},
changeStateShowBox(...arg){
if(arg.indexOf(1)===0){
this.showHideBox1=true
this.showHideBox2=false
this.showHideBox3=false
}
if(arg.indexOf(2)===0){
this.showHideBox1=false
this.showHideBox2=true
this.showHideBox3=false
}
if(arg.indexOf(3)===0){
this.showHideBox1=false
this.showHideBox2=false
this.showHideBox3=true
}
},
},
}
</script>
......@@ -159,6 +220,13 @@
.abs-box2{
right:calc(-50% + 16px);
}
.abs-box3{
transition: .4s ease;
position:absolute;
top:74*$length;
background-color: #fff;
right:calc(-50% + 10px);
}
}
}
......
pages/dynamic/index.vue
<template>
<div class="dynamic-container">
<div class="dynamic-container__left">
<nav-wrap
width="106px"
height="480px"
:list="list"
></nav-wrap>
</div>
<div class="dynamic-container__center">
<release-card></release-card>
......@@ -29,12 +33,75 @@
import ReleaseCard from '../../components/pc/releaseCard';
import SocialContactCard from '../../components/pc/socialContactCard';
import CardContainer from '../../components/pc/cardContainer';
import NavWrap from "../../components/pc/nav/navWrap";
export default {
data(){
return{
list: [
{
label: '推荐',
address: '/dynamic',
id: '推荐'
},
{
label: '热门',
address: '/dynamic',
id: '热门'
},
{
label: '关注',
address: '/dynamic',
id: '关注'
},
{
label: '我的',
address: '/dynamic',
id: '我的'
},
{
label: '文字',
address: '/dynamic',
id: '文字'
},
{
label: '视频',
address: '/dynamic',
id: '视频'
},
{
label: '图片',
address: '/dynamic',
id: '图片'
},
{
label: '项目',
address: '/dynamic',
id: '项目'
},
{
label: '代码',
address: '/dynamic',
id: '代码'
},
],
}
},
components:{
ReleaseCard,SocialContactCard,CardContainer
ReleaseCard,SocialContactCard,CardContainer,NavWrap
},
}
......
pages/index.vue
<template>
<div class="container">
<div>
<h1 class="title">
</h1>
<card-container
title="最新回答"
label="换一换"
more="加载更多"
width="938px"
height="786px"
></card-container>
<card-container
title="热门项目"
label="更新"
more="更多项目"
width="302px"
height="446px"
></card-container>
<nav-wrap></nav-wrap>
<h2 class="subtitle" @click="showAlert">
beyond-clouds project
</h2>
<nav-wrap></nav-wrap>
</div>
</div>
<home></home>
</template>
<script>
import CardContainer from '../components/pc/cardContainer';
import NavWrap from '../components/pc/nav/navWrap';
import Home from './home';
export default {
data(){
......@@ -42,73 +15,10 @@ export default {
},
components:{
CardContainer,NavWrap
},
methods:{
showAlert(){
// $alert 使用方法
this.$alert('确认清空消息列表？', '', {
confirmButtonText: '确定',
// callback: action => {
// this.$message({
// type: 'info',
// message: `action: ${ action }`,
// confirmButtonPosition: 'left',
// });
// }
});
}
},
Home
mounted(){
// this.$popupbox();
// message 使用方法
// this.$message({
// message:'hellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohellohello',
// type:'info'
// })
}
}
</script>
<style scoped>
.container {
margin: 0 auto;
min-height: 300vh;
display: flex;
/*background-color: #fff;*/
justify-content: center;
align-items: center;
text-align: center;
}
.title {
font-family: 'Quicksand', 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
display: block;
font-weight: 300;
font-size: 100px;
color: #35495e;
letter-spacing: 1px;
}
.subtitle {
font-weight: 300;
font-size: 42px;
color: #526488;
word-spacing: 5px;
padding-bottom: 15px;
}
.links {
padding-top: 15px;
}
</style>
pages/personal-center/account.vue
<template>
<div class="account-container">
<div class="account-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="account-container__r">
<card-container style="margin-top: 16px" title="初次登录请提交登录密码" label="账号注册">
<card-container style="margin-top: 16px;padding-bottom: 32px" title="初次登录请提交登录密码" label="账号注册">
<div class="bind-account-item__wrap">
<div class="bind-account-item">
<div class="item__left">
......@@ -102,7 +106,7 @@
</div>
</card-container>
<card-container style="margin-top: 16px" title="账号绑定" >
<card-container style="margin-top: 16px;padding-bottom: 32px" title="账号绑定" >
<div class="bind-account-item__wrap">
<input type="text" placeholder="请输入密码">
<input type="text" placeholder="请再次确认密码">
......@@ -111,7 +115,7 @@
<p class="submit-button">保存</p>
</card-container>
<card-container style="margin-top: 16px" title="修改登录密码" label="忘记密码">
<card-container style="margin-top: 16px;padding-bottom: 32px" title="修改登录密码" label="忘记密码">
<div class="bind-account-item__wrap">
<input type="text" placeholder="请输入旧密码">
<input type="text" placeholder="请输入新密码">
......@@ -128,18 +132,30 @@
import NoticeCard from '../../components/pc/noticeCard';
import CardContainer from '../../components/pc/cardContainer';
import NavWrap from "../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '基本资料',
address: '/personal-center/info',
id: '基本资料'
},
{
label: '账号安全',
address: '/personal-center/account',
id: '账号安全'
}
],
selected:'全部'
}
},
components:{
NoticeCard,CardContainer
NoticeCard,CardContainer,NavWrap
......@@ -185,6 +201,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.account-container__l{
margin-top: 16*$length;
overflow:hidden;
width:302*$length;
}
......@@ -194,7 +211,8 @@
border-radius: 4*$length;
.bind-account-item__wrap{
width:726*$length;
margin:32*$length auto;
margin:32*$length auto 0;
@extend %flex-row-spb;
& input{
width:334*$length;
......@@ -255,7 +273,8 @@
border-radius: 4*$length;
background-color: #75D098;
@include fontStyle(14,48,500,#fff,center);
margin:32*$length auto;
margin:32*$length auto 0;
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
......
pages/personal-center/black-list/index.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
......@@ -20,18 +24,36 @@
import FanCard from '../../../components/pc/fanCard';
import NavWrap from "../../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的关注',
address: '/personal-center/following',
id: '我的消息'
},
{
label: '我的粉丝',
address: '/personal-center/fans',
id: '我的粉丝'
},
{
label: '黑名单',
address: '/personal-center/black-list',
id: '黑名单'
},
],
selected:'项目'
}
},
components:{
FanCard
FanCard,NavWrap
},
......@@ -76,6 +98,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.message-container__l{
margin-top:16*$length;
overflow:hidden;
width:302*$length;
}
......
pages/personal-center/collect/index.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
<div class="container__tab">
......@@ -55,18 +59,30 @@
import ProjectCard from '../../../components/pc/projectCard';
import NavWrap from "../../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的喜欢',
address: '/personal-center/like',
id: '我的消息'
},
{
label: '我的收藏',
address: '/personal-center/collect',
id: '我的收藏'
}
],
selected:'项目'
}
},
components:{
ProjectCard
ProjectCard,NavWrap
},
......@@ -111,6 +127,8 @@
@extend %flex-row-spb;
align-items: flex-start;
.message-container__l{
margin-top:16*$length;
overflow:hidden;
width:302*$length;
}
......
pages/personal-center/fans/index.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
......@@ -20,18 +24,36 @@
import FanCard from '../../../components/pc/fanCard';
import NavWrap from "../../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的关注',
address: '/personal-center/following',
id: '我的消息'
},
{
label: '我的粉丝',
address: '/personal-center/fans',
id: '我的粉丝'
},
{
label: '黑名单',
address: '/personal-center/black-list',
id: '黑名单'
},
],
selected:'项目'
}
},
components:{
FanCard
FanCard,NavWrap
},
......@@ -76,6 +98,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.message-container__l{
margin-top:16*$length;
overflow:hidden;
width:302*$length;
}
......
pages/personal-center/following/index.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
......@@ -20,18 +24,36 @@
import FanCard from '../../../components/pc/fanCard';
import NavWrap from "../../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的关注',
address: '/personal-center/following',
id: '我的消息'
},
{
label: '我的粉丝',
address: '/personal-center/fans',
id: '我的粉丝'
},
{
label: '黑名单',
address: '/personal-center/black-list',
id: '黑名单'
},
],
selected:'项目'
}
},
components:{
FanCard
FanCard,NavWrap
},
......@@ -76,6 +98,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.message-container__l{
margin-top:16*$length;
overflow:hidden;
width:302*$length;
}
......
pages/personal-center/info.vue
<template>
<div class="info-container">
<div class="info-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="info-container__r">
<card-container style="margin-top: 16px" title="个人信息">
<card-container style="margin-top: 16px;padding-bottom: 32px" title="个人信息">
<div class="info-account-item__wrap">
<yun-avatar size="90px" name="昵称"> </yun-avatar>
<p class="change-button">修改头像</p>
......@@ -65,7 +69,7 @@
<p class="submit-button">保存</p>
</card-container>
<card-container style="margin-top: 16px" title="联系方式" >
<card-container style="margin-top: 16px;padding-bottom: 32px" title="联系方式" >
<div class="info-account-item__wrap">
<input type="text" class="input1" placeholder="微信号">
......@@ -151,18 +155,30 @@
import NoticeCard from '../../components/pc/noticeCard';
import CardContainer from '../../components/pc/cardContainer';
import NavWrap from "../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '基本资料',
address: '/personal-center/info',
id: '基本资料'
},
{
label: '账号安全',
address: '/personal-center/account',
id: '账号安全'
}
],
selected:'全部'
}
},
components:{
NoticeCard,CardContainer
NoticeCard,CardContainer,NavWrap
......@@ -193,6 +209,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.info-container__l{
margin-top: 16*$length;
overflow:hidden;
width:302*$length;
}
......@@ -391,7 +408,7 @@
border-radius: 4*$length;
background-color: #75D098;
@include fontStyle(14,48,500,#fff,center);
margin:32*$length auto;
margin:32*$length auto 0;
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
......
pages/personal-center/like/index.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
<div class="container__tab">
......@@ -55,18 +59,30 @@
import ProjectCard from '../../../components/pc/projectCard';
import NavWrap from "../../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的喜欢',
address: '/personal-center/like',
id: '我的消息'
},
{
label: '我的收藏',
address: '/personal-center/collect',
id: '我的收藏'
}
],
selected:'项目'
}
},
components:{
ProjectCard
ProjectCard,NavWrap
},
......@@ -113,6 +129,8 @@
.message-container__l{
overflow:hidden;
width:302*$length;
margin-top:16*$length;
}
.message-container__r{
overflow:hidden;
......
pages/personal-center/message.vue
<template>
<div class="message-container">
<div class="message-container__l">
<nav-card :labelList="labelList"></nav-card>
<nav-wrap
width="302px"
height="100px"
:list="list"
></nav-wrap>
</div>
<div class="message-container__r">
<div class="container__tab">
......@@ -55,18 +59,30 @@
import NoticeCard from '../../components/pc/noticeCard';
import NavWrap from "../../components/pc/nav/navWrap";
export default {
data(){
return{
labelList: ['我的消息','私信'],
list: [
{
label: '我的消息',
address: '/personal-center/message',
id: '我的消息'
},
{
label: '私信',
address: '/personal-center/message#',
id: '私信'
}
],
selected:'全部'
}
},
components:{
NoticeCard
NoticeCard,NavWrap
},
......@@ -111,6 +127,7 @@
@extend %flex-row-spb;
align-items: flex-start;
.message-container__l{
margin-top:16*$length;
overflow:hidden;
width:302*$length;
}
......
vim.exe.stackdump 0 → 100644
Stack trace:
Frame Function Args
00180232080 0018005D44E (0018021D639, 0018021DC39, 0018022E2F0, 000FFFFB720)
00180232080 00180046609 (C0C0C000008080, FF000000808080, FFFF000000FF00, FF00FF000000FF)
00180232080 00180046642 (0018021D616, 000000001E7, 0018022E2F0, 80808000C0C0C0)
00180232080 001800433C3 (00000000000, 00180232080, 7FFDD001888E, 001800004EC)
00180232080 0018006B581 (C0C0C000008080, FF000000808080, FFFF000000FF00, FF00FF000000FF)
00180232080 0018006C3CC (00000000000, 0010065D4A8, 00000000000, 00000000000)
00180232080 0018006E4E6 (00000000000, 00000000008, 0006C57D890, 00000000000)
00000000001 00180134FA6 (0010065D4A0, 00000000008, 00000000000, 00000000000)
00000000001 0018011C93B (0010065D4A0, 00000000008, 00000000000, 00000000000)
00000000001 001004F6234 (0010057387A, 00000000002, 00100663E98, 00100663E9C)
00000000001 0010057F413 (00000000008, 001006642E0, 00000000000, 00000000000)
00000000001 001005747F6 (00000000000, 0005A6D26A9, 0001772867C, 00000010000)
00000000001 001005D381B (00000000001, 0006B7E1F10, 00180053BD3, 00100666620)
00600049080 001005E0BAA (00000000020, 001802DA8E0, 00180047B96, 00180046BA0)
000FFFFCCB0 00180047C07 (00000000000, 00000000000, 00000000000, 00000000000)
00000000000 00180045873 (00000000000, 00000000000, 00000000000, 00000000000)
End of stack trace (more stack frames may be present)
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