|
|
|
@ -1,48 +1,45 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<!-- 封面 -->
|
|
|
|
|
<div class="card-content1 shadow-box background-opacity">
|
|
|
|
|
|
|
|
|
|
<div class="bg-wrap my-animation-slide-top">
|
|
|
|
|
<!-- 背景图片 -->
|
|
|
|
|
<el-image class="love-image my-el-image"
|
|
|
|
|
lazy
|
|
|
|
|
:src="love.bgCover"
|
|
|
|
|
fit="cover">
|
|
|
|
|
<el-image class="love-image my-el-image" lazy :src="love.bgCover" fit="cover" style="width: 100%; height: 100vh;">
|
|
|
|
|
<div slot="error" class="image-slot"></div>
|
|
|
|
|
</el-image>
|
|
|
|
|
|
|
|
|
|
<!-- 对象 -->
|
|
|
|
|
<div class="love-wrap transformCenter">
|
|
|
|
|
<div>
|
|
|
|
|
<el-avatar class="love-avatar" :src="love.manCover"></el-avatar>
|
|
|
|
|
<div class="love-title">
|
|
|
|
|
{{love.manName}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<img class="love-img" :src="$constant.loveLike" alt="心心">
|
|
|
|
|
<div class="love-title">{{love.manName}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
<el-avatar class="love-avatar" :src="love.womanCover"></el-avatar>
|
|
|
|
|
<div class="love-title">
|
|
|
|
|
{{love.womanName}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="love-title">{{love.womanName}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="bannerWave1"></div>
|
|
|
|
|
<div id="bannerWave2"></div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 内容 -->
|
|
|
|
|
<div class="love-container">
|
|
|
|
|
|
|
|
|
|
<div class="myCenter love-content">
|
|
|
|
|
<!-- 时间 -->
|
|
|
|
|
<div>
|
|
|
|
|
<!-- 计时 -->
|
|
|
|
|
<div>
|
|
|
|
|
<div class="love-time-title1">
|
|
|
|
|
这是我们一起走过的
|
|
|
|
|
<a class="collection-btn" @click="showTip()">
|
|
|
|
|
<i class="el-icon-star-off" style="margin-right: 2px"></i>我的开发流程
|
|
|
|
|
</a>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="love-time1">
|
|
|
|
|
第
|
|
|
|
|
<span class="love-time1-item">{{timing.year}}</span>
|
|
|
|
@ -65,11 +62,12 @@
|
|
|
|
|
{{love.countdownTitle}}: {{countdownChange}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div style="padding: 0 20px">
|
|
|
|
|
<div class="family-button shadow-box-mini" @click="changeCard(4)">
|
|
|
|
|
<span class="family-button-title">{{card === 4 ? '回到主人家' : '开往表白墙'}}</span>
|
|
|
|
|
|
|
|
|
|
<span class="family-button-car">
|
|
|
|
|
<svg viewBox="0 0 1024 1024" width="40" height="40">
|
|
|
|
|
<path
|
|
|
|
@ -110,37 +108,7 @@
|
|
|
|
|
<div style="padding: 0 20px">
|
|
|
|
|
<!-- 卡片 -->
|
|
|
|
|
<div class="card-wrap" v-show="card !== 4">
|
|
|
|
|
<div class="card-content shadow-box-mini" @click="changeCard(1)">
|
|
|
|
|
<div>
|
|
|
|
|
<el-avatar :size="100"
|
|
|
|
|
:src="$constant.loveWeiYan">
|
|
|
|
|
</el-avatar>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-right">
|
|
|
|
|
<div class="card-title">
|
|
|
|
|
点点滴滴
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-desc">
|
|
|
|
|
☀️今朝有酒今朝醉
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="card-content shadow-box-mini" @click="changeCard(2)">
|
|
|
|
|
<div>
|
|
|
|
|
<el-avatar :size="100"
|
|
|
|
|
:src="$constant.lovePhoto">
|
|
|
|
|
</el-avatar>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-right">
|
|
|
|
|
<div class="card-title">
|
|
|
|
|
时光相册
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-desc">
|
|
|
|
|
📸记录美好瞬间
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="card-content shadow-box-mini" @click="changeCard(3)">
|
|
|
|
|
<div>
|
|
|
|
@ -150,10 +118,10 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-right">
|
|
|
|
|
<div class="card-title">
|
|
|
|
|
祝福板
|
|
|
|
|
记录
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card-desc">
|
|
|
|
|
📋写下对我们的祝福
|
|
|
|
|
📋写下你的开发记录
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -239,7 +207,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="family-bottom" style="background-color: var(--lightGreen)" @click="addFamily()">
|
|
|
|
|
<span style="line-height: 50px">
|
|
|
|
|
申请入住
|
|
|
|
|
设置
|
|
|
|
|
</span>
|
|
|
|
|
<span style="vertical-align:middle">
|
|
|
|
|
<svg viewBox="0 0 1024 1024" width="30" height="30"><path
|
|
|
|
@ -256,7 +224,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-dialog title="入住表白墙"
|
|
|
|
|
<el-dialog title="开启你的记录流程吧"
|
|
|
|
|
:visible.sync="loveDialogVisible"
|
|
|
|
|
width="40%"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
@ -287,7 +255,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="form-title">
|
|
|
|
|
男生头像
|
|
|
|
|
头像
|
|
|
|
|
</div>
|
|
|
|
|
<div style=" display: flex">
|
|
|
|
|
<el-input maxlength="120" v-model="userLove.manCover"></el-input>
|
|
|
|
@ -302,12 +270,12 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="form-title">
|
|
|
|
|
女生头像
|
|
|
|
|
项目logo
|
|
|
|
|
</div>
|
|
|
|
|
<div style=" display: flex">
|
|
|
|
|
<el-input maxlength="120" v-model="userLove.womanCover"></el-input>
|
|
|
|
|
<div style="margin: 3px 0 0 10px">
|
|
|
|
|
<proButton :info="'上传头像'"
|
|
|
|
|
<proButton :info="'上传logo'"
|
|
|
|
|
@click.native="openPicture('womanCover')"
|
|
|
|
|
:before="$constant.before_color_1"
|
|
|
|
|
:after="$constant.after_color_1">
|
|
|
|
@ -317,7 +285,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="form-title">
|
|
|
|
|
男生昵称
|
|
|
|
|
昵称
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-input maxlength="10" v-model="userLove.manName"></el-input>
|
|
|
|
@ -325,7 +293,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="form-title">
|
|
|
|
|
女生昵称
|
|
|
|
|
项目名
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-input maxlength="10" v-model="userLove.womanName"></el-input>
|
|
|
|
@ -369,7 +337,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="form-title">
|
|
|
|
|
告白信
|
|
|
|
|
简述
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<el-input type="textarea"
|
|
|
|
@ -391,7 +359,7 @@
|
|
|
|
|
<div>
|
|
|
|
|
<img :src="$constant.friendLetterBiLi" style="width: 100%;margin: 5px auto"/>
|
|
|
|
|
</div>
|
|
|
|
|
<p style="font-size: 12px;text-align: center;color: #999">欢迎入住表白墙</p>
|
|
|
|
|
<p style="font-size: 12px;text-align: center;color: #999">开启记录</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -451,6 +419,15 @@
|
|
|
|
|
timing: "",
|
|
|
|
|
familyInfo: ""
|
|
|
|
|
},
|
|
|
|
|
pagination: {
|
|
|
|
|
current: 1,
|
|
|
|
|
size: 5,
|
|
|
|
|
recommendStatus: true
|
|
|
|
|
},
|
|
|
|
|
recommendArticles: [],
|
|
|
|
|
admires: [],
|
|
|
|
|
showAdmireDialog: false,
|
|
|
|
|
articleSearch: "",
|
|
|
|
|
loveDialogVisible: false,
|
|
|
|
|
addPictureDialog: false,
|
|
|
|
|
pictureType: "",
|
|
|
|
@ -495,7 +472,14 @@
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
computed: {},
|
|
|
|
|
computed: {
|
|
|
|
|
webInfo() {
|
|
|
|
|
return this.$store.state.webInfo;
|
|
|
|
|
},
|
|
|
|
|
sortInfo() {
|
|
|
|
|
return this.$store.state.sortInfo;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
watch: {},
|
|
|
|
|
|
|
|
|
@ -503,6 +487,8 @@
|
|
|
|
|
this.getAdminFamily();
|
|
|
|
|
this.card = 1;
|
|
|
|
|
this.getWeiYan();
|
|
|
|
|
this.getRecommendArticles();
|
|
|
|
|
this.getAdmire();
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
mounted() {
|
|
|
|
@ -510,6 +496,54 @@
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
methods: {
|
|
|
|
|
selectSort(sort) {
|
|
|
|
|
this.$emit("selectSort", sort);
|
|
|
|
|
},
|
|
|
|
|
selectArticle() {
|
|
|
|
|
this.$emit("selectArticle", this.articleSearch);
|
|
|
|
|
},
|
|
|
|
|
showAdmire() {
|
|
|
|
|
if (this.$common.isEmpty(this.$store.state.currentUser)) {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "请先登录!",
|
|
|
|
|
type: "error"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.showAdmireDialog = true;
|
|
|
|
|
},
|
|
|
|
|
getAdmire() {
|
|
|
|
|
this.$http.get(this.$constant.baseURL + "/webInfo/getAdmire")
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (!this.$common.isEmpty(res.data)) {
|
|
|
|
|
this.admires = res.data;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((error) => {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: error.message,
|
|
|
|
|
type: "error"
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
getRecommendArticles() {
|
|
|
|
|
this.$http.post(this.$constant.baseURL + "/article/listArticle", this.pagination)
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (!this.$common.isEmpty(res.data)) {
|
|
|
|
|
this.recommendArticles = res.data.records;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((error) => {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: error.message,
|
|
|
|
|
type: "error"
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
showTip() {
|
|
|
|
|
this.$router.push({path: '/weiYan'});
|
|
|
|
|
},
|
|
|
|
|
openPicture(type) {
|
|
|
|
|
this.pictureType = type;
|
|
|
|
|
this.addPictureDialog = true;
|
|
|
|
@ -529,7 +563,7 @@
|
|
|
|
|
submitLove() {
|
|
|
|
|
if (this.userLove.bgCover.trim() === "") {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "你还没设置背景封面呢~",
|
|
|
|
|
message: "你还没设置呢~",
|
|
|
|
|
type: "warning"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
@ -537,7 +571,7 @@
|
|
|
|
|
|
|
|
|
|
if (this.userLove.manCover.trim() === "") {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "你还没设置男生头像呢~",
|
|
|
|
|
message: "你还没设置呢~",
|
|
|
|
|
type: "warning"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
@ -545,7 +579,7 @@
|
|
|
|
|
|
|
|
|
|
if (this.userLove.womanCover.trim() === "") {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "你还没设置女生头像呢~",
|
|
|
|
|
message: "你还没设置呢~",
|
|
|
|
|
type: "warning"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
@ -553,7 +587,7 @@
|
|
|
|
|
|
|
|
|
|
if (this.userLove.manName.trim() === "") {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "你还没写男生昵称呢~",
|
|
|
|
|
message: "你还没写呢~",
|
|
|
|
|
type: "warning"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
@ -561,7 +595,7 @@
|
|
|
|
|
|
|
|
|
|
if (this.userLove.womanName.trim() === "") {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: "你还没写女生昵称呢~",
|
|
|
|
|
message: "你还没写呢~",
|
|
|
|
|
type: "warning"
|
|
|
|
|
});
|
|
|
|
|
return;
|
|
|
|
|