Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
B
beyond-clouds-frontM
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
云深项目组
beyond-clouds-frontM
Commits
59b02432
Commit
59b02432
authored
Mar 16, 2020
by
yanju
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'master' of coding.yundingshuyuan.com:yunshen/beyond-clouds-frontM
parents
566428e3
3aca993d
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
312 additions
and
94 deletions
+312
-94
dev-schedule__xb.md
+1
-1
pages/blog/index.vue
+163
-2
pages/search.vue
+126
-91
pages/users/register.vue
+22
-0
No files found.
dev-schedule__xb.md
View file @
59b02432
...
...
@@ -6,4 +6,4 @@
+
空卡片(1)✅
+
错误页面 layouts/error.vue (2)✅
+
首页 pages/index(2)✅
+
搜索页 pages/search(3)
+
搜索页 pages/search(3)
✅
pages/blog/index.vue
View file @
59b02432
<
template
>
<yun-slider>
<yun-slider
@
touchstart
.
native=
"touchStart($event)"
@
touchmove
.
native=
"touchMove($event)"
@
touchend
.
native=
"touchend($event)"
class=
"load-moudle"
>
<yun-div
slot=
"card"
>
...
...
@@ -14,6 +19,15 @@
<project-card></project-card>
<project-card></project-card>
<project-card></project-card>
<yun-div
:width-v=
"750"
:height-v=
"104"
:show-ske=
"false"
:font-style=
"[24,104,500,'#999','center']"
v-if=
"isLoading"
>
加载中
</yun-div>
</yun-div>
</yun-slider>
</
template
>
...
...
@@ -21,6 +35,7 @@
<
script
>
import
Nav
from
"../../components/moblie/nav"
;
import
ProjectCard
from
"../../components/moblie/projectCard"
;
export
default
{
components
:
{
ProjectCard
,
Nav
},
data
()
{
...
...
@@ -67,7 +82,19 @@ export default {
label
:
'python'
,
id
:
'18'
}
]
],
top
:
0
,
pullUpState
:
0
,
// 1:上拉加载更多, 2:加载中……, 3:我是有底线的
isLoading
:
false
,
// 是否正在加载
pullUpInfo
:
{
moreText
:
'上拉加载更多'
,
loadingText
:
'数据加载中...'
,
noMoreText
:
'我是有底线的'
},
startX
:
0
,
startY
:
0
,
endX
:
0
,
endY
:
0
}
},
created
()
{
...
...
@@ -80,6 +107,140 @@ export default {
type
:
'all'
}
})
},
methods
:
{
/**
* 触摸开始,手指点击屏幕时
* @param {object} e Touch 对象包含的属性
*/
touchStart
(
e
)
{
this
.
startX
=
e
.
touches
[
0
].
pageX
this
.
startY
=
e
.
touches
[
0
].
pageY
},
/**
* 接触点改变,滑动时
* @param {object} e Touch 对象包含的属性
*/
touchMove
(
e
)
{
this
.
endX
=
e
.
changedTouches
[
0
].
pageX
this
.
endY
=
e
.
changedTouches
[
0
].
pageY
let
direction
=
this
.
getSlideDirection
(
this
.
startX
,
this
.
startY
,
this
.
endX
,
this
.
endY
)
switch
(
direction
)
{
case
0
:
console
.
log
(
'没滑动'
)
break
case
1
:
console
.
log
(
'向上'
)
this
.
scrollToTheEnd
()
break
case
2
:
console
.
log
(
'向下'
)
break
case
3
:
console
.
log
(
'向左'
)
break
case
4
:
console
.
log
(
'向右'
)
break
default
:
}
},
/**
* 触摸结束,手指离开屏幕时
* @param {object} e Touch 对象包含的属性
*/
touchend
(
e
)
{
this
.
isLoading
=
false
},
/**
* 判断滚动条是否到底
*/
scrollToTheEnd
()
{
let
innerHeight
=
document
.
querySelector
(
'.load-moudle'
).
clientHeight
// 变量scrollTop是滚动条滚动时,距离顶部的距离
let
scrollTop
=
document
.
documentElement
.
scrollTop
||
window
.
pageYOffset
||
document
.
body
.
scrollTop
// 变量scrollHeight是滚动条的总高度
let
scrollHeight
=
document
.
documentElement
.
clientHeight
||
document
.
body
.
scrollHeight
// 滚动条到底部的条件
if
(
scrollTop
+
scrollHeight
>=
innerHeight
)
{
if
(
this
.
pullUpState
!==
3
&&
!
this
.
isLoading
)
{
this
.
infiniteLoad
()
}
// console.log('距顶部' + scrollTop + '滚动条总高度' + scrollHeight + '内容高度' + innerHeight)
}
},
/**
* 上拉加载数据
*/
infiniteLoad
()
{
if
(
this
.
pullUpState
!==
3
)
{
this
.
pullUpState
=
2
this
.
isLoading
=
true
this
.
onInfiniteLoad
()
}
},
/**
* 加载数据
*/
onInfiniteLoad
()
{
console
.
log
(
222
);
},
/**
* 加载数据完成
*/
infiniteLoadDone
()
{
this
.
pullUpState
=
1
},
/**
* 返回角度
*/
getSlideAngle
(
dx
,
dy
)
{
return
Math
.
atan2
(
dy
,
dx
)
*
180
/
Math
.
PI
},
/**
* 根据起点和终点返回方向 1:向上,2:向下,3:向左,4:向右,0:未滑动
* @param {number} startX X轴开始位置
* @param {number} startY X轴结束位置
* @param {number} endX Y轴开始位置
* @param {number} endY Y轴结束位置
*/
getSlideDirection
(
startX
,
startY
,
endX
,
endY
)
{
let
dy
=
startY
-
endY
let
dx
=
endX
-
startX
let
result
=
0
// 如果滑动距离太短
if
(
Math
.
abs
(
dx
)
<
2
&&
Math
.
abs
(
dy
)
<
2
)
{
return
result
}
let
angle
=
this
.
getSlideAngle
(
dx
,
dy
)
if
(
angle
>=
-
45
&&
angle
<
45
)
{
result
=
4
}
else
if
(
angle
>=
45
&&
angle
<
135
)
{
result
=
1
}
else
if
(
angle
>=
-
135
&&
angle
<
-
45
)
{
result
=
2
}
else
if
((
angle
>=
135
&&
angle
<=
180
)
||
(
angle
>=
-
180
&&
angle
<
-
135
))
{
result
=
3
}
return
result
}
},
watch
:
{
parentPullUpState
(
curVal
,
oldVal
)
{
this
.
pullUpState
=
curVal
}
}
}
</
script
>
...
...
pages/search.vue
View file @
59b02432
...
...
@@ -3,7 +3,7 @@
bg-color-v=
"white"
>
<yun-div
:padding-v=
"[34,0,4
0]"
:padding-v=
"[20,0,2
0]"
>
<yun-input
:width-v=
"704"
...
...
@@ -12,11 +12,26 @@
bg-color-v=
"#F4F8FA"
:border-v=
"[1,'solid',this.commonReturnPrimaryColor(0.2)]"
style=
"margin: 0 auto;"
v-model=
"question"
placeholder=
"请输入您要搜索的内容"
@
input=
"changeInput"
@
focus=
"focus"
>
</yun-input>
<yun-div
v-if=
"this.bottom1"
:ske-w=
"50"
:extend-style=
"
{
position:'absolute',right:commonReturnFlexedLength(40),top:commonReturnFlexedLength(44)
}"
:font-style="[24,30,400,'#999999','left']"
>取消
</yun-div>
<yun-div
v-if=
"this.bottom2"
:flex-v=
"['row','flex-start','center']"
style=
"position: absolute;right:23px;top: 34px;"
:extend-style=
"
{
position:'absolute',right:commonReturnFlexedLength(23),top:commonReturnFlexedLength(20)
}"
>
<yun-div
:width-v=
"36"
...
...
@@ -37,10 +52,42 @@
>
搜索
</yun-button>
</yun-div>
</yun-div>
<yun-div
width-v=
"100%"
:height-v=
"15"
bg-color-v=
"#EDF5F8"
></yun-div>
<!--搜索记录-->
<yun-div
:width-v=
"704"
:margin-v=
"[35,27,0,26]"
:flex-v=
"['row','flex-start','center']"
v-for=
"(item, index) in topicList"
:key=
"item"
>
<yun-div
:height-v=
"56"
:width-v=
"56"
:border-r=
"[28]"
:ske-h=
"56"
:ske-w=
"56"
:no-flex-shrink=
"true"
:show-ske=
"false"
:font-style=
"[28,56,500,'#00AAE6','center']"
>
<yun-icon
name=
"search"
:size=
"28"
color=
"#00AAE6"
></yun-icon>
</yun-div>
<yun-div
:font-style=
"[32,38,400,'black','center']"
:margin-v=
"[0,0,0,20]"
>
{{
item
}}
</yun-div>
</yun-div>
<yun-div
v-if=
"this.bottom1"
:width-v=
"704"
:padding-v=
"[34,0,40]"
:margin-v=
"[0,'auto']"
...
...
@@ -67,49 +114,8 @@
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
<yun-div
:width-v=
"352"
:ske-w=
"250"
:margin-v=
"[0,0,40,0]"
:font-style=
"[26,30,400,'black','left']"
>
1.云深项目组
</yun-div>
v-for=
"(item, index) in topicList"
:key=
"item"
>
{{
item
}}
</yun-div>
</yun-div>
</yun-div>
<yun-div
...
...
@@ -142,57 +148,21 @@
:padding-v=
"[12,20,12,20]"
bg-color-v=
"#EFEFEF"
:font-style=
"[24,30,400,'black','left']"
v-for=
"(item, index) in topicList"
:key=
"item"
>
三个字
</yun-div>
<yun-div
:ske-w=
"100"
:margin-v=
"[0,20,30,0]"
:padding-v=
"[12,20,12,20]"
bg-color-v=
"#EFEFEF"
:font-style=
"[24,30,400,'black','left']"
>
三个字aaaa
</yun-div>
<yun-div
:ske-w=
"100"
:margin-v=
"[0,20,30,0]"
:padding-v=
"[12,20,12,20]"
bg-color-v=
"#EFEFEF"
:font-style=
"[24,30,400,'black','left']"
>
三个字aaaa
</yun-div>
<yun-div
:ske-w=
"100"
:margin-v=
"[0,20,30,0]"
:padding-v=
"[12,20,12,20]"
bg-color-v=
"#EFEFEF"
:font-style=
"[24,30,400,'black','left']"
>
三个字aaaa
</yun-div>
<yun-div
:ske-w=
"100"
:margin-v=
"[0,20,30,0]"
:padding-v=
"[12,20,12,20]"
bg-color-v=
"#EFEFEF"
:font-style=
"[24,30,400,'black','left']"
>
三个字aaaa
{{
item
}}
</yun-div>
</yun-div>
</yun-div>
</yun-div>
<!--搜索
详情
-->
<Nav></Nav>
<!--搜索
结果
-->
<Nav
:path=
"path"
:nav-list=
"navList"
></Nav>
<yun-div
>
<project-card
v-for=
"val in 1"
key=
"val.projectId"
></project-card>
<user-card-x
v-for=
"val in 1"
key=
"val.
project
Id"
></user-card-x>
<answer-card
v-for=
"val in 1"
key=
"val.
project
Id"
></answer-card>
<user-card-x
v-for=
"val in 1"
key=
"val.
user
Id"
></user-card-x>
<answer-card
v-for=
"val in 1"
key=
"val.
answer
Id"
></answer-card>
</yun-div>
...
...
@@ -206,10 +176,75 @@
import
userCardX
from
'../components/moblie/userCardX'
import
projectCard
from
'../components/moblie/projectCard'
export
default
{
mixins
:[
commonMixin
],
layout
:
'blank'
,
components
:{
Nav
,
answerCard
,
userCardX
,
projectCard
mixins
:
[
commonMixin
],
layout
:
'blank'
,
components
:
{
Nav
,
answerCard
,
userCardX
,
projectCard
},
data
()
{
return
{
question
:
''
,
bottom1
:
true
,
bottom2
:
false
,
topicList
:[
'云顶书院'
,
'云顶书院'
,
'云顶书院'
,
'云顶书院'
],
path
:
'/search'
,
navList
:
[
{
label
:
'全部'
,
id
:
'all'
},
{
label
:
'项目'
,
id
:
'10'
},
{
label
:
'博客'
,
id
:
'11'
},
{
label
:
'问答'
,
id
:
'12'
},
{
label
:
'话题'
,
id
:
'13'
},
{
label
:
'用户'
,
id
:
'14'
},
]
}
},
created
()
{
if
(
this
.
$route
.
query
.
type
)
{
return
}
this
.
$router
.
replace
({
path
:
'/search'
,
query
:
{
type
:
'all'
}
})
},
watch
:
{
},
methods
:{
changeInput
(){
if
(
this
.
question
!==
''
)
{
this
.
bottom1
=
false
;
this
.
bottom2
=
true
}
else
{
this
.
bottom2
=
false
;
this
.
bottom1
=
true
}
},
focus
(){
console
.
log
(
"sss"
)
}
}
}
</
script
>
pages/users/register.vue
View file @
59b02432
...
...
@@ -124,6 +124,28 @@
</yun-div>
</yun-div>
</yun-div>
<yun-div
:width-v=
"704"
:height-v=
"520"
:padding-v=
"[72,60]"
:margin-v=
"[0,'auto']"
:extend-style=
"
{boxSizing: 'border-box'}"
:border-r="[8]"
bg-color-v="#fff"
:flex-v="['column','flex-start','center']"
v-if="false"
>
<yun-icon
name=
"success"
:size=
"80"
color=
"#75D098"
:style=
"
{lineHeight: commonReturnFlexedLength(40)}">
</yun-icon>
<yun-div
:font-style=
"[26,35,500,'#75D098','center']"
:margin-v=
"[19,0,0]"
>
注册成功
</yun-div>
<yun-div
:font-style=
"[28,37,500,'#333','center']"
:margin-v=
"[55,0,64,0]"
>
请查看邮箱收件箱验证账号
</yun-div>
<yun-button
:border-r=
"[8]"
bg-color=
"#75D098"
:size=
"[584,86]"
:font-style=
"[26,35,500,'#fff','center']"
>
前往验证
</yun-button>
</yun-div>
<page-footer
style=
"position: fixed;bottom:0;"
></page-footer>
</yun-div>
</
template
>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment