Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
B
beyond-clouds-front
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
Administrator
beyond-clouds-front
Commits
d56487e8
Commit
d56487e8
authored
Feb 09, 2020
by
yanju
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
完成动态的发布、删除、动态展示
parent
ca1257e6
Show whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
533 additions
and
105 deletions
+533
-105
action/config.js
+3
-0
components/pc/dropdown.vue
+54
-0
components/pc/loading.vue
+111
-0
components/pc/pagination.vue
+80
-6
components/pc/releaseCard.vue
+154
-68
components/pc/socialContactCard.vue
+84
-15
pages/dynamic/index.vue
+43
-11
pages/personal-center/account/info.vue
+1
-0
pages/personal-center/home/dynamic.vue
+3
-5
No files found.
action/config.js
View file @
d56487e8
...
@@ -214,6 +214,9 @@ export default {
...
@@ -214,6 +214,9 @@ export default {
listenPopupValue
:
'listenpopupvalue'
,
listenPopupValue
:
'listenpopupvalue'
,
listenCardConMore
:
'listenCardConMore'
,
listenCardConMore
:
'listenCardConMore'
,
listenCardConLabel
:
'listenCardConLabel'
,
listenCardConLabel
:
'listenCardConLabel'
,
listenReleaseState
:
'listenReleaseState'
,
listenSocialCardState
:
'listenSocialCardState'
,
},
},
default_data
:
{
default_data
:
{
...
...
components/pc/dropdown.vue
0 → 100644
View file @
d56487e8
<
template
>
<div
class=
"dropdown-card__wrap"
>
<ul
class=
"dropdown-card"
>
<slot></slot>
</ul>
</div>
</
template
>
<
script
>
export
default
{
}
</
script
>
<
style
lang=
"scss"
>
.dropdown-card__wrap
{
position
:
absolute
;
.dropdown-card{
list-style
:
none
;
padding
:
6
*$
length
0
;
margin
:
0
;
box-sizing
:
border-box
;
border
:
solid
1px
#dfe4ed
;
border-radius
:
4px
;
background-color
:
#fff
;
box-shadow
:
0
2px
12px
0
rgba
(
0
,
0
,
0
,
0.1
);
&
li{
font-size
:
14px
;
padding
:
0
20px
;
position
:
relative
;
white-space
:
nowrap
;
overflow
:
hidden
;
text-overflow
:
ellipsis
;
color
:
#606266
;
height
:
34px
;
line-height
:
34px
;
-webkit-box-sizing
:
border-box
;
box-sizing
:
border-box
;
cursor
:
pointer
;
@extend
%cursorPointer;
@extend
%animate-transition;
&:hover{
background-color
:
#F5F7FA
;
}
}
}
}
</
style
>
components/pc/loading.vue
0 → 100644
View file @
d56487e8
<
template
>
<div
:class=
"type===1?'Loading1':'Loading2'"
>
<div>
</div>
<div>
</div>
<div>
</div>
</div>
</
template
>
<
script
>
export
default
{
name
:
'loading'
,
props
:{
type
:{
default
:
1
,
type
:
Number
}
},
}
</
script
>
<
style
lang=
"scss"
>
.Loading2
{
display
:
flex
;
justify-content
:
center
;
height
:
80
*$
length
;
width
:
80
*$
length
;
align-items
:
center
;
&
>div
{
width
:
10
*$
length
;
height
:
10
*$
length
;
border-radius
:
50%
;
background
:
#00AAE6
;
opacity
:
.5
;
margin
:
4
*$
length
;
color
:
#fff
;
text-align
:
center
;
line-height
:
33px
;
font-size
:
1.5rem
;
animation
:
loading2
0.8s
infinite
alternate
;
}
&
>
div
:nth-child
(
2
)
{
animation-delay
:
0.4s
}
&
>
div
:nth-child
(
3
)
{
animation-delay
:
0.6s
;
}
}
.Loading1
{
display
:
flex
;
justify-content
:
center
;
height
:
80
*$
length
;
width
:
80
*$
length
;
align-items
:
center
;
&
>div
{
width
:
10
*$
length
;
height
:
10
*$
length
;
border-radius
:
50%
;
background
:
#00AAE6
;
opacity
:
.5
;
margin
:
4
*$
length
;
color
:
#fff
;
text-align
:
center
;
line-height
:
33px
;
font-size
:
1.5rem
;
animation
:
loading2
1.2s
infinite
alternate
;
}
&
>
div
:nth-child
(
2
)
{
animation-delay
:
0.4s
}
&
>
div
:nth-child
(
3
)
{
animation-delay
:
0.6s
;
}
}
@keyframes
loading2
{
0
%
{
opacity
:
0.1
;
transform
:
translateX
(
.2rem
);
}
50
%
{
opacity
:
1
;
transform
:
translateX
(
0rem
);
}
100
%
{
opacity
:
0.1
;
transform
:
translateX
(
-.2rem
);
}
}
@keyframes
loading1
{
from
{
opacity
:
1
;
transform
:
translateY
(
.5rem
);
}
to
{
opacity
:
0.1
;
transform
:
translateY
(
-.5rem
);
}
}
</
style
>
components/pc/pagination.vue
View file @
d56487e8
<
template
>
<
template
>
<div
class=
"pagination-container__wrap"
v-show=
"show"
>
<div
class=
"pagination-container__wrap"
ref=
"paginationCon"
v-show=
"show"
>
<div
class=
"pagination-container"
>
<div
class=
"pagination-container"
v-if=
"type===1"
>
<p
class=
"left-arrow"
@
click=
"clickToGetPrevPage"
v-if=
"currentPage>1"
>
<p
class=
"left-arrow"
@
click=
"clickToGetPrevPage"
v-if=
"currentPage>1"
>
<yun-icon
name=
"left_arrow"
size=
"12px"
></yun-icon>
<yun-icon
name=
"left_arrow"
size=
"12px"
></yun-icon>
</p>
</p>
...
@@ -14,17 +14,41 @@
...
@@ -14,17 +14,41 @@
<yun-icon
name=
"left_arrow"
size=
"12px"
></yun-icon>
<yun-icon
name=
"left_arrow"
size=
"12px"
></yun-icon>
</p>
</p>
</div>
</div>
<div
class=
"pagination-container2"
v-if=
"type===2"
>
<div
class=
"box"
v-if=
"paginationState==='loading'"
>
<loading
:type=
2
></loading>
</div>
<div
class=
"box"
v-if=
"paginationState==='over'"
>
已经到底了~
</div>
</div>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
import
config
from
'../../action/config'
;
import
config
from
'../../action/config'
;
import
Loading
from
'../../components/pc/loading'
;
export
default
{
export
default
{
name
:
'pagination'
,
name
:
'pagination'
,
components
:{
Loading
},
props
:{
props
:{
pages
:[
Number
,
String
],
pages
:{
type
:[
Number
,
String
],
default
:
1
,
},
type
:{
type
:
Number
,
default
:
1
},
paginationState
:{
type
:
String
,
default
:
'over'
},
},
},
data
(){
data
(){
return
{
return
{
...
@@ -39,7 +63,10 @@
...
@@ -39,7 +63,10 @@
},
},
created
(){
created
(){
this
.
$emit
(
config
.
event
.
listenPageChange
,
this
.
currentPage
)
this
.
$emit
(
config
.
event
.
listenPageChange
,
this
.
currentPage
);
if
(
this
.
type
===
2
){
this
.
scrollToGetNext
();
}
},
},
watch
:{
watch
:{
currentPage
(
pre
,
now
){
currentPage
(
pre
,
now
){
...
@@ -66,6 +93,42 @@
...
@@ -66,6 +93,42 @@
methods
:{
methods
:{
getElementToPageTop
(
el
)
{
if
(
el
.
parentElement
)
{
return
this
.
getElementToPageTop
(
el
.
parentElement
)
+
el
.
offsetTop
}
return
el
.
offsetTop
},
//
scrollToGetNext
(){
if
(
process
.
browser
){
document
.
addEventListener
(
'scroll'
,()
=>
{
if
(
this
.
$refs
.
paginationCon
){
let
pageConTop
=
this
.
getElementToPageTop
(
this
.
$refs
.
paginationCon
);
let
scrollTop
=
document
.
documentElement
.
scrollTop
||
document
.
body
.
scrollTop
;
let
screenTop
=
scrollTop
+
window
.
innerHeight
;
if
(
screenTop
>=
pageConTop
){
if
(
this
.
currentPage
<
this
.
pages
){
this
.
currentPage
=
this
.
currentPage
+
1
;
// this.paginationState = 'loading';
}
else
{
// this.paginationState = 'over';
}
}
else
{
// this.paginationState = 'complete';
}
}
})
}
},
// 跳到下一页
// 跳到下一页
clickToGetNextPage
(){
clickToGetNextPage
(){
let
{
pages
,
centerFirstPage
,
currentPage
}
=
this
;
let
{
pages
,
centerFirstPage
,
currentPage
}
=
this
;
...
@@ -108,12 +171,10 @@
...
@@ -108,12 +171,10 @@
let
{
centerFirstPage
,
pages
}
=
this
;
let
{
centerFirstPage
,
pages
}
=
this
;
if
(
centerFirstPage
+
5
+
6
<
pages
){
if
(
centerFirstPage
+
5
+
6
<
pages
){
console
.
log
(
1
);
this
.
currentPage
=
centerFirstPage
+
6
;
this
.
currentPage
=
centerFirstPage
+
6
;
this
.
centerFirstPage
=
centerFirstPage
+
6
;
this
.
centerFirstPage
=
centerFirstPage
+
6
;
}
}
else
if
(
centerFirstPage
+
5
+
6
>=
pages
){
else
if
(
centerFirstPage
+
5
+
6
>=
pages
){
console
.
log
(
2
);
this
.
currentPage
=
pages
-
5
;
this
.
currentPage
=
pages
-
5
;
this
.
centerFirstPage
=
pages
-
5
;
this
.
centerFirstPage
=
pages
-
5
;
}
}
...
@@ -234,5 +295,18 @@
...
@@ -234,5 +295,18 @@
}
}
}
}
.pagination-container2
{
.box{
height
:
40
*$
length
;
@extend
%flex-row-center;
background
:
#fff
;
border-radius
:
4
*$
length
;
color
:
#999
;
font-size
:
12px
;
}
}
}
}
</
style
>
</
style
>
components/pc/releaseCard.vue
View file @
d56487e8
...
@@ -76,7 +76,7 @@
...
@@ -76,7 +76,7 @@
<yun-icon
name=
"down_arrow"
size=
"6px"
color=
"#999"
pb=
"1px"
></yun-icon>
<yun-icon
name=
"down_arrow"
size=
"6px"
color=
"#999"
pb=
"1px"
></yun-icon>
</div>
</div>
<p
class=
"send-box"
>
<p
class=
"send-box"
@
click=
"dataPostContent"
>
发布
发布
</p>
</p>
</div>
</div>
...
@@ -97,9 +97,11 @@
...
@@ -97,9 +97,11 @@
<yun-icon
name=
"close1"
size=
"12px"
color=
"#fff"
></yun-icon>
<yun-icon
name=
"close1"
size=
"12px"
color=
"#fff"
></yun-icon>
</div>
</div>
</div>
</div>
<p
class=
"add-box"
:style=
"
{margin:(imgArr.length+1)%9===0? '6px 0 0 0':'6px 6px 0 0'}">添加图片
<div
class=
"add-box"
:style=
"
{margin:(imgArr.length+1)%9===0? '6px 0 0 0':'6px 6px 0 0'}">
<input
type=
"file"
@
change=
"(e)=>openCropper(e)"
>
<input
type=
"file"
v-if=
"!addingPic"
@
change=
"(e)=>dataPostPic(e)"
>
</p>
<span
v-if=
"!addingPic"
>
添加图片
</span>
<loading
:type=
2
v-if=
"addingPic"
></loading>
</div>
</div>
</div>
</div>
</div>
</transition>
</transition>
...
@@ -112,34 +114,41 @@
...
@@ -112,34 +114,41 @@
</div>
</div>
<div
class=
"video-container"
>
<div
class=
"video-container"
>
<p
class=
"add-box"
v-if=
"!showVideoUploadP"
>
上传视频
<p
class=
"add-box"
v-if=
"!video"
>
<input
type=
"file"
@
change=
"(e)=>changeToUploadVideo(e)"
>
<span
v-if=
"!showVideoUploadP"
>
上传视频
</span>
</p>
<input
v-if=
"!showVideoUploadP"
type=
"file"
@
change=
"(e)=>dataPostVideo(e)"
>
<div
class=
"video-upload"
v-if=
"showVideoUploadP"
>
<loading
:type=
2
v-if=
"showVideoUploadP"
></loading>
<div
class=
"video-upload__word"
>
<p>
文件名.mp4
</p>
<h6>
上传中55%
</h6>
</div>
<div
class=
"video-upload__progress"
>
<p></p>
</div>
</div>
<p
class=
"add-box"
v-if=
"!showCoverUploadP"
>
上传封面
<input
type=
"file"
@
change=
"e=>changeToUploadCover(e)"
>
</p>
</p>
<div
class=
"video-upload"
v-if=
"showCoverUploadP"
>
<div
class=
"video-upload__word"
>
<div
class=
"add-box"
v-if=
"video"
>
<p>
文件名.mp4
</p>
<video
controls
:src=
"video"
></video>
<h6>
上传中55%
</h6>
<p
class=
"cancel-video"
@
click=
"video=''"
>
取消上传
</p>
</div>
</div>
<div
class=
"video-upload__progress"
>
<!--
<div
class=
"video-upload"
>
-->
<p></p>
<!--
<div
class=
"video-upload__word"
>
-->
</div>
<!--
<p>
{{
videoName
}}
</p>
-->
</div>
<!--
<h6>
上传中55%
</h6>
-->
<!--
</div>
-->
<!--
<div
class=
"video-upload__progress"
>
-->
<!--
<p></p>
-->
<!--
</div>
-->
<!--
</div>
-->
<!--
<p
class=
"add-box"
v-if=
"!showCoverUploadP"
>
上传封面-->
<!--
<input
type=
"file"
@
change=
"e=>changeToUploadCover(e)"
>
-->
<!--
</p>
-->
<!--
<div
class=
"video-upload"
v-if=
"showCoverUploadP"
>
-->
<!--
<div
class=
"video-upload__word"
>
-->
<!--
<p>
文件名.mp4
</p>
-->
<!--
<h6>
上传中55%
</h6>
-->
<!--
</div>
-->
<!--
<div
class=
"video-upload__progress"
>
-->
<!--
<p></p>
-->
<!--
</div>
-->
<!--
</div>
-->
</div>
</div>
</div>
</div>
</transition>
</transition>
<yun-cropper
:file=
"addFile"
:addImg=
"this.getCroppedPic"
></yun-cropper>
</div>
</div>
...
@@ -147,14 +156,17 @@
...
@@ -147,14 +156,17 @@
<
script
>
<
script
>
import
config
from
'../../action/config'
import
config
from
'../../action/config'
;
import
Loading
from
'../../components/pc/loading'
;
export
default
{
export
default
{
name
:
'releaseCard'
,
name
:
'releaseCard'
,
components
:{
Loading
},
data
(){
data
(){
return
{
return
{
releaseWord
:
''
,
releaseWord
:
''
,
postContent
:
''
,
topicsArr
:[],
topicsArr
:[],
linksArr
:[],
linksArr
:[],
emojiArr
:
config
.
default_data
.
emojiArrs
.
emojiArr1
,
emojiArr
:
config
.
default_data
.
emojiArrs
.
emojiArr1
,
...
@@ -167,33 +179,20 @@
...
@@ -167,33 +179,20 @@
addFile
:{},
addFile
:{},
TopicValue
:
''
,
TopicValue
:
''
,
imgArr
:[
imgArr
:[
'http://i1.sinaimg.cn/ent/d/2008-06-04/U105P28T3D2048907F326DT20080604225106.jpg'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/22e2d91201a2478683044f116d1d8186-file'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file'
,
'https://s2.ax1x.com/2020/01/13/lHpvY4.png'
,
'http://i1.sinaimg.cn/ent/d/2008-06-04/U105P28T3D2048907F326DT20080604225106.jpg'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/22e2d91201a2478683044f116d1d8186-file'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file'
,
'https://s2.ax1x.com/2020/01/13/lHpvY4.png'
,
],
],
video
:
''
,
showVideoUploadP
:
false
,
showVideoUploadP
:
false
,
showCoverUploadP
:
false
,
showCoverUploadP
:
false
,
topicList
:[],
topicList
:[],
addingPic
:
false
,
}
}
},
},
computed
:{
computed
:{
},
},
// watch:{
watch
:{
// topicList:{
// deep:true,
},
// handleChange(val){
//
// }
// }
//
// },
created
(){
created
(){
this
.
dataGetTopicList
();
this
.
dataGetTopicList
();
if
(
process
.
browser
){
if
(
process
.
browser
){
...
@@ -221,26 +220,11 @@
...
@@ -221,26 +220,11 @@
clickToAddEmoji
(
value
){
clickToAddEmoji
(
value
){
this
.
releaseWord
=
this
.
releaseWord
+
value
this
.
releaseWord
=
this
.
releaseWord
+
value
},
},
openCropper
(
e
){
console
.
log
(
e
.
target
.
files
[
0
]);
this
.
addFile
=
e
.
target
.
files
[
0
];;
},
getCroppedPic
(
pic
){
this
.
imgArr
.
push
(
pic
)
},
clickToDeleteImg
(
index
){
clickToDeleteImg
(
index
){
let
arr1
=
this
.
imgArr
.
slice
(
0
,
index
);
let
arr1
=
this
.
imgArr
.
slice
(
0
,
index
);
let
arr2
=
this
.
imgArr
.
slice
(
index
+
1
)
let
arr2
=
this
.
imgArr
.
slice
(
index
+
1
)
this
.
imgArr
=
[...
arr1
,...
arr2
]
this
.
imgArr
=
[...
arr1
,...
arr2
]
},
},
changeToUploadVideo
(
e
){
console
.
log
(
e
.
target
);
//let file = e.target.files[0];
//上传函数
this
.
showVideoUploadP
=
true
;
},
changeToUploadCover
(
e
){
changeToUploadCover
(
e
){
console
.
log
(
e
.
target
);
console
.
log
(
e
.
target
);
//let file = e.target.files[0];
//let file = e.target.files[0];
...
@@ -300,15 +284,60 @@
...
@@ -300,15 +284,60 @@
},
},
clickToAddTopic
(
id
,
name
){
clickToAddTopic
(
id
,
name
){
this
.
releaseWord
=
this
.
releaseWord
+
"##"
;
this
.
releaseWord
=
this
.
releaseWord
+
"#"
+
name
+
"#"
;
this
.
topicList
.
push
({
id
:
id
,
name
:
name
});
this
.
showTopicCard
=
false
;
},
},
dataPostVideo
(
e
){
this
.
showVideoUploadP
=
true
;
let
a
=
new
FormData
();
let
type
=
0
;
//0-用户头像
//1-博客封面
// 2-项目封面
a
.
append
(
'file'
,
e
.
target
.
files
[
0
]);
a
.
append
(
'type'
,
type
);
//0是头像
this
.
$axios
.
$post
(
config
.
api
.
post
.
Resource
.
file
,
a
).
then
((
res
)
=>
{
if
(
res
.
code
===
0
){
this
.
video
=
res
.
data
;
}
else
{
this
.
$message
({
message
:
res
.
msg
,
type
:
'warning'
})
}
this
.
showVideoUploadP
=
false
;
})
},
dataPostPic
(
e
){
this
.
addingPic
=
true
;
let
a
=
new
FormData
();
let
type
=
0
;
//0-用户头像
//1-博客封面
// 2-项目封面
a
.
append
(
'file'
,
e
.
target
.
files
[
0
]);
a
.
append
(
'type'
,
type
);
//0是头像
this
.
$axios
.
$post
(
config
.
api
.
post
.
Resource
.
file
,
a
).
then
((
res
)
=>
{
if
(
res
.
code
===
0
){
this
.
imgArr
.
push
(
res
.
data
);
}
else
{
this
.
$message
({
message
:
res
.
msg
,
type
:
'warning'
})
}
this
.
addingPic
=
false
;
})
},
dataPostContent
(){
dataPostContent
(){
let
postFrom
=
{
let
postFrom
=
{
"content"
:
this
.
releaseWord
,
"content"
:
this
.
releaseWord
,
}
}
;
if
(
this
.
imgArr
.
length
>
0
){
if
(
this
.
imgArr
.
length
>
0
){
postFrom
.
pictures
=
this
.
imgArr
;
postFrom
.
pictures
=
this
.
imgArr
;
...
@@ -316,7 +345,44 @@
...
@@ -316,7 +345,44 @@
if
(
this
.
video
){
if
(
this
.
video
){
postFrom
.
video
=
this
.
video
postFrom
.
video
=
this
.
video
}
}
this
.
$axios
.
$post
(
config
.
api
.
post
.
Post
.
release
,
postFrom
).
then
(()
=>
{
if
(
!
this
.
releaseWord
){
this
.
$message
({
type
:
'warning'
,
message
:
'请输入动态的文字内容!'
})
return
false
;
}
if
(
this
.
imgArr
.
length
>
0
&&
this
.
video
){
this
.
$message
({
type
:
'warning'
,
message
:
'只能单独上传视频或者图片!'
})
return
false
;
}
this
.
$axios
.
$post
(
config
.
api
.
post
.
Post
.
release
,
postFrom
).
then
((
response
)
=>
{
if
(
response
.
code
===
0
){
this
.
$emit
(
config
.
event
.
listenReleaseState
,
1
);
this
.
releaseWord
=
''
;
this
.
showPhotoCard
=
false
;
this
.
showVideoCard
=
false
;
this
.
imgArr
=
[];
this
.
$message
({
type
:
'success'
,
message
:
'动态发表成功!'
})
}
else
{
this
.
$message
({
type
:
'warning'
,
message
:
'动态发表失败!'
})
}
})
})
},
},
...
@@ -609,6 +675,7 @@
...
@@ -609,6 +675,7 @@
border
:
1px
dashed
#dadbff
;
border
:
1px
dashed
#dadbff
;
@extend
%cursorPointer;
@extend
%cursorPointer;
@include
fontStyle(12,252,500,#666,center);
@include
fontStyle(12,252,500,#666,center);
@extend
%flex-row-center;
&
input{
&
input{
position
:
absolute
;
position
:
absolute
;
@extend
%cursorPointer;
@extend
%cursorPointer;
...
@@ -619,6 +686,25 @@
...
@@ -619,6 +686,25 @@
width
:
100%
;
width
:
100%
;
}
}
&
video
{
width
:
100%
;
height
:
auto
;
background-color
:
#B9A3D2
;
}
.cancel-video
{
position
:
absolute
;
left
:
500
*$
length
;
top
:
222
*$
length
;
width
:
80
*$
length
;
@include
fontStyle(12,40,500,#666,center);
@extend
%cursorPointer;
@extend
%animate-transition;
&:hover{
color
:
#00AAE6
}
}
}
}
.video-upload
{
.video-upload
{
.video-upload__word{
.video-upload__word{
...
...
components/pc/socialContactCard.vue
View file @
d56487e8
...
@@ -20,11 +20,14 @@
...
@@ -20,11 +20,14 @@
</div>
</div>
<div
class=
"header-r"
>
<div
class=
"header-r"
>
<yun-icon
name=
"down_arrow"
size=
"6px"
color=
"#999"
></yun-icon>
<yun-icon
name=
"down_arrow"
size=
"6px"
color=
"#999"
@
click
.
native
.
stop=
"clickToShowDrop"
></yun-icon>
<dropdown
v-if=
"showDrop"
>
<li
@
click=
"dateDeleteCard(postId)"
ref=
"deleteButton"
>
删除
</li>
</dropdown>
</div>
</div>
</div>
</div>
<p
class=
"card-content__word"
>
{{
content
}}
</p>
<p
class=
"card-content__word"
v-html=
"handledContent"
>
</p>
<div
class=
"card-content__img1"
v-if=
"pictures.length>1&&pictures.length
<
=
4
&&!
showBanner
"
>
<div
class=
"card-content__img1"
v-if=
"pictures.length>1&&pictures.length
<
=
4
&&!
showBanner
"
>
<div
class=
"img-box"
@
click=
"clickToOpenBanner(index)"
v-for=
"(value,index) in pictures"
<div
class=
"img-box"
@
click=
"clickToOpenBanner(index)"
v-for=
"(value,index) in pictures"
...
@@ -60,7 +63,7 @@
...
@@ -60,7 +63,7 @@
</p>
</p>
<banner
v-if=
"showBanner"
:currentImg2=
"currentImg"
style=
"padding-top: 16px"
:autoPlay=
false
:bannerType=
2
:imgArr=
"pictures"
></banner>
<banner
v-if=
"showBanner"
:currentImg2=
"currentImg"
style=
"padding-top: 16px"
:autoPlay=
false
:bannerType=
2
:imgArr=
"pictures"
></banner>
<video
controls
v-if=
"video"
class=
"dynamic-video"
src=
"http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4
"
></video>
<video
controls
v-if=
"video"
class=
"dynamic-video"
:src=
"video
"
></video>
<div
class=
"card-footer"
>
<div
class=
"card-footer"
>
...
@@ -89,13 +92,14 @@
...
@@ -89,13 +92,14 @@
<
script
>
<
script
>
import
Banner
from
'./banner'
;
import
Banner
from
'./banner'
;
import
Dropdown
from
'../../components/pc/dropdown'
import
{
dateConvert
}
from
"../../action/utils/dataConvert"
;
import
{
dateConvert
}
from
"../../action/utils/dataConvert"
;
import
config
from
'../../action/config'
;
import
config
from
'../../action/config'
;
export
default
{
export
default
{
name
:
'socialContactCard'
,
name
:
'socialContactCard'
,
components
:{
components
:{
Banner
Banner
,
Dropdown
},
},
props
:{
props
:{
...
@@ -103,6 +107,10 @@
...
@@ -103,6 +107,10 @@
type
:
Object
,
type
:
Object
,
default
:
()
=>
({})
default
:
()
=>
({})
},
},
pageType
:{
type
:
String
,
default
:
''
}
},
},
data
(){
data
(){
...
@@ -110,22 +118,16 @@
...
@@ -110,22 +118,16 @@
//return
//return
return
{
return
{
src
:
'https://s2.ax1x.com/2020/01/15/lO2kIf.png'
,
src
:
'https://s2.ax1x.com/2020/01/15/lO2kIf.png'
,
showDrop
:
false
,
name
:
'我我欸'
,
name
:
'我我欸'
,
postId
:
''
,
postId
:
''
,
content
:
'
这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容这个是二级评论的内容
'
,
content
:
'
打发手动阀#dfasdfasf1##dfasdfasf2#手动阀#dfasdfasf3#fadsfasdf
'
,
createTime
:
'3小时前'
,
createTime
:
'3小时前'
,
pictures
:[
pictures
:[
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/22e2d91201a2478683044f116d1d8186-file'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/22e2d91201a2478683044f116d1d8186-file'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file'
,
'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file'
,
'https://s2.ax1x.com/2020/01/13/lHpvY4.png'
,
'https://s2.ax1x.com/2020/01/13/lHpvY4.png'
,
'http://i1.sinaimg.cn/ent/d/2008-06-04/U105P28T3D2048907F326DT20080604225106.jpg'
,
'http://i1.sinaimg.cn/ent/d/2008-06-04/U105P28T3D2048907F326DT20080604225106.jpg'
,
// 'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/22e2d91201a2478683044f116d1d8186-file',
// 'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file',
// 'https://s2.ax1x.com/2020/01/13/lHpvY4.png',
// 'https://s2.ax1x.com/2020/01/13/lHpvY4.png',
// 'https://yundingweb.oss-cn-beijing.aliyuncs.com/yunding/20190828/161fecb3d8b441c5b340319c62508513-file',
// 'https://s2.ax1x.com/2020/01/13/lHpvY4.png',
// 'https://s2.ax1x.com/2020/01/13/lHpvY4.png',
],
],
video
:
''
,
video
:
''
,
userId
:
''
,
userId
:
''
,
...
@@ -161,24 +163,66 @@
...
@@ -161,24 +163,66 @@
return
false
return
false
}
}
}
}
},
handledContent
(){
let
content
=
this
.
content
===
null
?
''
:
this
.
content
;
let
indexArr
=
[];
let
html
=
``
;
for
(
let
i
=
0
;
i
<
content
.
length
;
i
++
)
{
let
index
=
content
.
indexOf
(
"#"
,
i
);
if
(
index
!==-
1
&&
index
===
i
){
indexArr
.
push
(
index
)
}
}
if
(
indexArr
.
length
>=
1
){
for
(
let
i
=
0
;
i
<
indexArr
.
length
-
1
;
i
+=
2
)
{
let
firstP
=
i
>
0
?
indexArr
[
i
-
1
]
+
1
:
0
;
html
=
html
+
`
${
content
.
substring
(
firstP
,
indexArr
[
i
])}
<span>
${
content
.
substring
(
indexArr
[
i
],
indexArr
[
i
+
1
]
+
1
)}
</span>`
}
html
=
html
+
`
${
content
.
substring
(
indexArr
[
indexArr
.
length
-
1
]
+
1
)}
`
;
return
html
}
else
{
return
content
;
}
}
},
},
},
created
(){
created
(){
this
.
dateGet2Info
();
this
.
dateGet2Info
();
},
if
(
process
.
browser
){
document
.
addEventListener
(
'click'
,(
e
)
=>
{
if
(
this
.
$refs
.
deleteButton
){
if
(
!
this
.
$refs
.
deleteButton
.
contains
(
e
.
target
)){
this
.
showDrop
=
false
;
}
}
})
}
},
methods
:{
methods
:{
clickToOpenBanner
(
index
){
clickToOpenBanner
(
index
){
this
.
showBanner
=
true
;
this
.
showBanner
=
true
;
this
.
currentImg
=
index
this
.
currentImg
=
index
},
},
clickToShowDrop
(){
this
.
pageType
===
'my'
?(
this
.
showDrop
=!
this
.
showDrop
):
null
},
dateGet2Info
(){
dateGet2Info
(){
let
info
=
this
.
info
;
let
info
=
this
.
info
;
if
(
this
.
info
.
postId
){
if
(
this
.
info
.
postId
){
this
.
content
=
info
.
content
;
this
.
content
=
info
.
content
;
this
.
postId
=
info
.
postId
;
this
.
postId
=
info
.
postId
;
this
.
pictures
=
info
.
pictures
;
this
.
pictures
=
info
.
pictures
===
null
?[]:
info
.
pictures
;
this
.
video
=
info
.
video
;
this
.
video
=
info
.
video
;
this
.
createTime
=
dateConvert
(
info
.
createTime
);
this
.
createTime
=
dateConvert
(
info
.
createTime
);
this
.
userId
=
info
.
userId
;
this
.
userId
=
info
.
userId
;
...
@@ -186,6 +230,25 @@
...
@@ -186,6 +230,25 @@
this
.
userAvatar
=
info
.
userAvatar
;
this
.
userAvatar
=
info
.
userAvatar
;
}
}
},
},
dateDeleteCard
(
id
){
this
.
$axios
.
$delete
(
config
.
api
.
delete
.
Post
.
delete
+
id
).
then
((
response
)
=>
{
if
(
response
.
code
===
0
){
this
.
$emit
(
config
.
event
.
listenSocialCardState
,
1
);
this
.
$message
({
type
:
'success'
,
message
:
'删除成功!'
})
}
else
{
this
.
$message
({
type
:
'warning'
,
message
:
'删除失败!'
})
}
})
},
},
},
...
@@ -194,7 +257,7 @@
...
@@ -194,7 +257,7 @@
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
>
.social-card__wrap
{
.social-card__wrap
{
margin-top
:
16
*$
length
;
margin-top
:
16
*$
length
;
.social-card{
.social-card{
...
@@ -243,6 +306,9 @@
...
@@ -243,6 +306,9 @@
}
}
}
}
}
}
.header-r
{
position
:
relative
;
}
}
}
.card-content__word
{
.card-content__word
{
...
@@ -250,7 +316,10 @@
...
@@ -250,7 +316,10 @@
@include
fontStyle(14,24,500,#222,left);
@include
fontStyle(14,24,500,#222,left);
height
:
auto
;
height
:
auto
;
span{
span{
@extend
%cursorPointer;
color
:
#00AAE6
;
color
:
#00AAE6
;
margin-left
:
3px
;
margin-right
:
3px
;
}
}
}
}
...
...
pages/dynamic/index.vue
View file @
d56487e8
...
@@ -7,12 +7,11 @@
...
@@ -7,12 +7,11 @@
></nav-wrap>
></nav-wrap>
</div>
</div>
<div
class=
"dynamic-container__center"
>
<div
class=
"dynamic-container__center"
>
<release-card></release-card>
<release-card
@
listenReleaseState=
"dataGetDynamic(1)"
></release-card>
<social-contact-card></social-contact-card>
<social-card
@
listenSocialCardState=
"dataGetDynamic(1)"
v-for=
"(val,index) in postList"
:key=
"val.postId"
:info=
"val"
></social-card>
<social-contact-card></social-contact-card>
<social-contact-card></social-contact-card>
<pagination
:paginationState=
"paginationState"
:type=
"2"
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
<social-contact-card></social-contact-card>
<social-contact-card></social-contact-card>
</div>
</div>
<div
class=
"dynamic-container__right"
>
<div
class=
"dynamic-container__right"
>
...
@@ -30,11 +29,11 @@
...
@@ -30,11 +29,11 @@
<
script
>
<
script
>
import
ReleaseCard
from
'../../components/pc/releaseCard'
;
import
ReleaseCard
from
'../../components/pc/releaseCard'
;
import
SocialC
ontactC
ard
from
'../../components/pc/socialContactCard'
;
import
SocialCard
from
'../../components/pc/socialContactCard'
;
import
CardContainer
from
'../../components/pc/cardContainer'
;
import
CardContainer
from
'../../components/pc/cardContainer'
;
import
NavWrap
from
"../../components/pc/nav/navWrap"
;
import
NavWrap
from
"../../components/pc/nav/navWrap"
;
import
Pagination
from
'../../components/pc/pagination'
;
import
config
from
'../../action/config'
export
default
{
export
default
{
...
@@ -96,8 +95,14 @@
...
@@ -96,8 +95,14 @@
id
:
'代码'
id
:
'代码'
},
},
],
],
postList
:[],
pages
:
1
,
paginationState
:
'complate'
}
}
},
},
components
:{
ReleaseCard
,
SocialCard
,
CardContainer
,
NavWrap
,
Pagination
},
created
()
{
created
()
{
this
.
$router
.
replace
({
this
.
$router
.
replace
({
...
@@ -108,9 +113,36 @@
...
@@ -108,9 +113,36 @@
});
});
},
},
components
:{
methods
:{
ReleaseCard
,
SocialContactCard
,
CardContainer
,
NavWrap
dataGetDynamic
(
currentPage
){
this
.
paginationState
=
'loading'
;
this
.
$axios
.
$get
(
config
.
api
.
get
.
Post
.
list
,{
params
:{
page
:
currentPage
,
size
:
10
}
}).
then
((
response
)
=>
{
let
list
=
response
.
data
.
dataList
for
(
let
i
=
0
;
i
<
list
.
length
;
i
++
){
this
.
postList
.
push
(
list
[
i
]);
this
.
paginationState
=
'over'
;
}
this
.
pages
=
response
.
data
.
totalPage
;
})
},
},
changePage
(
currentPage
){
//返回页数 请求新的数据
this
.
dataGetDynamic
(
currentPage
);
}
},
}
}
...
...
pages/personal-center/account/info.vue
View file @
d56487e8
...
@@ -171,6 +171,7 @@
...
@@ -171,6 +171,7 @@
this
.
$store
.
commit
(
'userProfile/setUser'
,
user
);
this
.
$store
.
commit
(
'userProfile/setUser'
,
user
);
this
.
getDataUserInfo
();
this
.
getDataUserInfo
();
this
.
isEdit
=
false
;
this
.
isEdit
=
false
;
this
.
isEdit2
=
false
;
this
.
$message
({
this
.
$message
({
message
:
response
.
msg
,
message
:
response
.
msg
,
type
:
'success'
type
:
'success'
...
...
pages/personal-center/home/dynamic.vue
View file @
d56487e8
<
template
>
<
template
>
<div>
<div
>
<div>
<release-card
style=
"margin-top: 16px"
@
listenReleaseState=
"dataGetDynamic(1)"
></release-card>
<release-card
style=
"margin-top: 16px"
></release-card>
<social-card
pageType=
"my"
@
listenSocialCardState=
"dataGetDynamic(1)"
v-for=
"(val,index) in rightList"
:key=
"val.postId"
:info=
"val"
></social-card>
<social-card
v-for=
"(val,index) in rightList"
:key=
"val.blogId"
:info=
"val"
></social-card>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
<pagination
key=
"container5"
style=
"margin:20px auto;"
:pages=
"pages"
v-on:listenPageChange=
"changePage"
></pagination>
</div>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
import
SocialCard
from
'../../../components/pc/socialContactCard'
;
import
SocialCard
from
'../../../components/pc/socialContactCard'
;
...
...
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