...
|
...
|
@@ -4,56 +4,110 @@ |
|
|
<div
|
|
|
class="coursenavleft"
|
|
|
:class="selnav == index ? 'selactive' : ''"
|
|
|
@click="selectnav(item.id,index)"
|
|
|
@click="selectnav(item.id, index)"
|
|
|
v-for="(item, index) in navarr"
|
|
|
:key="index"
|
|
|
>{{ item.sort_name }}</div>
|
|
|
>
|
|
|
{{ item.sort_name }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="societybox">
|
|
|
<div class="nodata" v-if="sortlist.length==0">暂无数据</div>
|
|
|
<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad" v-else>
|
|
|
<div class="societyitem" v-for="item in sortlist" :key="item.id">
|
|
|
<div class="nodata" v-if="sortlist.length == 0">暂无数据</div>
|
|
|
<van-list
|
|
|
v-model="loading"
|
|
|
:finished="finished"
|
|
|
finished-text="没有更多了"
|
|
|
@load="onLoad"
|
|
|
v-else
|
|
|
>
|
|
|
<div class="societyitem" v-for="(item, index) in sortlist" :key="index">
|
|
|
<div class="societytop flextwo">
|
|
|
<div class="societyleft flexone">
|
|
|
<div class="personimg">
|
|
|
<img :src="item.user.avatar" alt />
|
|
|
</div>
|
|
|
<div class="personright">
|
|
|
<div class="personname">{{item.user.nickname}}</div>
|
|
|
<div class="persondate">{{item.createtime}}</div>
|
|
|
<div class="personname">{{ item.user.nickname }}</div>
|
|
|
<div class="persondate">{{ item.createtime }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="dingimg" v-if="item.is_top==1">
|
|
|
<div class="dingimg" v-if="item.is_top == 1">
|
|
|
<img src="../../../assets/ding.png" alt />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="societytext">{{item.description}}</div>
|
|
|
<div class="societyimg flexone" v-if="item.images_arr.length!=0">
|
|
|
<div class="societyimgitem" v-for="item in item.images_arr" :key="item">
|
|
|
<img src="../../../assets/societyimg.png" alt />
|
|
|
<div class="societytext">{{ item.description }}</div>
|
|
|
<div class="societyimg flexone" v-if="item.images_arr.length != 0">
|
|
|
<div
|
|
|
class="societyimgitem"
|
|
|
v-for="(item, indexk) in item.images_arr"
|
|
|
:key="indexk"
|
|
|
@click="previewimg(index, indexk)"
|
|
|
>
|
|
|
<img :src="item" alt />
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="jianzhengtui flexone">
|
|
|
<div
|
|
|
class="jianzheng flexone"
|
|
|
v-for="(item, index) in item.tags"
|
|
|
:key="index"
|
|
|
>
|
|
|
<div class="jianzhengleft" :style="{ background: item.color }">
|
|
|
#
|
|
|
</div>
|
|
|
<div class="jianzhengright" :style="{ color: item.color }">
|
|
|
{{ item.name }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="jianzheng flexone">
|
|
|
<div class="jianzhengleft">#</div>
|
|
|
<div class="jianzhengright">见证蜕变</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 点赞 -->
|
|
|
<div class="dainzan flexone">
|
|
|
<div class="flexone dianitem">
|
|
|
<img src="../../../assets/zan.png" alt class="dianzanimg" />
|
|
|
<span class="number">960</span>
|
|
|
<div class="flexone dianitem" @click="zanclick(index, item)">
|
|
|
<img
|
|
|
src="../../../assets/diankong.png"
|
|
|
alt
|
|
|
class="dianzanimg"
|
|
|
v-if="item.is_good == 0"
|
|
|
/>
|
|
|
<img
|
|
|
src="../../../assets/zan.png"
|
|
|
alt
|
|
|
class="dianzanimg"
|
|
|
v-else
|
|
|
/>
|
|
|
<span class="number">{{ item.good_count }}</span>
|
|
|
</div>
|
|
|
<div class="flexone dianitem">
|
|
|
<img src="../../../assets/star.png" alt class="dianzanimg" />
|
|
|
<span class="number">960</span>
|
|
|
<div class="flexone dianitem" @click="collect(index, item)">
|
|
|
<img
|
|
|
src="../../../assets/starkong.png"
|
|
|
alt
|
|
|
class="dianzanimg"
|
|
|
v-if="item.is_favorite == 0"
|
|
|
/>
|
|
|
<img
|
|
|
src="../../../assets/star.png"
|
|
|
alt
|
|
|
class="dianzanimg"
|
|
|
v-else
|
|
|
/>
|
|
|
|
|
|
<span class="number">{{ item.favorite_count }}</span>
|
|
|
</div>
|
|
|
<div class="flexone dianitem">
|
|
|
<div class="flexone dianitem" @click="copytext">
|
|
|
<img src="../../../assets/edit.png" alt class="dianzanimg" />
|
|
|
<span class="number">960</span>
|
|
|
<!-- <span class="number">复制文本</span> -->
|
|
|
<span
|
|
|
class="number"
|
|
|
v-clipboard:copy="item.description"
|
|
|
v-clipboard:success="onCopy"
|
|
|
>复制</span
|
|
|
>
|
|
|
<!-- v-clipboard:error="onError" -->
|
|
|
</div>
|
|
|
<div class="flexone dianitem">
|
|
|
<div class="flexone dianitem" @click="save(item)">
|
|
|
<img src="../../../assets/download.png" alt class="dianzanimg" />
|
|
|
<span class="number">960</span>
|
|
|
<span class="number">一键保存</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
...
|
...
|
@@ -61,11 +115,19 @@ |
|
|
</div>
|
|
|
|
|
|
<!-- 图片没有上传 -->
|
|
|
<div class="gantanimg" v-if="nophoto">
|
|
|
<div class="gantanimg" v-if="nophoto" @click="nophotoup">
|
|
|
<img src="../../../assets/gantan.png" class="ganimg" alt />
|
|
|
<div class="gantantext">用户未上传图片</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 预览图片 -->
|
|
|
<van-image-preview
|
|
|
v-model="show"
|
|
|
:images="images"
|
|
|
@change="onChange"
|
|
|
:startPosition="startPosition"
|
|
|
>
|
|
|
<template v-slot:index>第{{ index + 1 }}页</template>
|
|
|
</van-image-preview>
|
|
|
<!-- 添加 -->
|
|
|
<div class="addimg" @click="publish">
|
|
|
<img src="../../../assets/add.png" alt />
|
...
|
...
|
@@ -76,10 +138,12 @@ |
|
|
|
|
|
<script>
|
|
|
import tabBar from "@/components/views/tabBar.vue";
|
|
|
import Vue from 'vue';
|
|
|
import { List } from 'vant';
|
|
|
import Vue from "vue";
|
|
|
import { List, Toast, ImagePreview } from "vant";
|
|
|
Vue.use(ImagePreview);
|
|
|
|
|
|
Vue.use(List);
|
|
|
|
|
|
export default {
|
|
|
components: {
|
|
|
tabBar
|
...
|
...
|
@@ -88,22 +152,57 @@ export default { |
|
|
return {
|
|
|
selnav: 0,
|
|
|
navarr: [],
|
|
|
sort_id: '',
|
|
|
sort_id: "",
|
|
|
nophoto: false,
|
|
|
sortlist: [],
|
|
|
loading: false,
|
|
|
finished: false,
|
|
|
page: 1,
|
|
|
this_page: '',
|
|
|
total_page: ''
|
|
|
this_page: "",
|
|
|
total_page: "",
|
|
|
show: false,
|
|
|
index: 0,
|
|
|
images: [],
|
|
|
startPosition: 0
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
this.getsort()
|
|
|
this.getsort();
|
|
|
},
|
|
|
methods: {
|
|
|
save(item) {
|
|
|
this.images = item.images_arr;
|
|
|
if (this.images.length == 0) {
|
|
|
this.nophoto = true;
|
|
|
} else {
|
|
|
this.index = 0;
|
|
|
this.show = true;
|
|
|
}
|
|
|
},
|
|
|
previewimg(index, indexk) {
|
|
|
console.log(index, indexk);
|
|
|
this.index = indexk;
|
|
|
this.images = this.sortlist[index].images_arr;
|
|
|
this.show = true;
|
|
|
this.startPosition = indexk;
|
|
|
},
|
|
|
nophotoup() {
|
|
|
this.nophoto = false;
|
|
|
},
|
|
|
// 图片预览
|
|
|
onChange(index) {
|
|
|
this.index = index;
|
|
|
},
|
|
|
onCopy(e) {
|
|
|
Toast("复制成功");
|
|
|
},
|
|
|
onLoad() {
|
|
|
let that = this;
|
|
|
console.log(888);
|
|
|
// if (that.page = 1) {
|
|
|
// that.loading = false
|
|
|
// that.finished = false
|
|
|
// }
|
|
|
// 异步更新数据
|
|
|
// setTimeout 仅做示例,真实场景中一般为 ajax 请求
|
|
|
setTimeout(() => {
|
...
|
...
|
@@ -113,7 +212,7 @@ export default { |
|
|
let newpage = that.page;
|
|
|
newpage++;
|
|
|
that.page = newpage;
|
|
|
that.getsocidtylist()
|
|
|
that.getsocidtylist();
|
|
|
// 加载状态结束
|
|
|
that.loading = false;
|
|
|
// 数据全部加载完成
|
...
|
...
|
@@ -122,19 +221,89 @@ export default { |
|
|
}
|
|
|
}, 1000);
|
|
|
},
|
|
|
// 收藏
|
|
|
collect(index, item) {
|
|
|
let that = this;
|
|
|
var url = "/api/user/favorite";
|
|
|
let param = {
|
|
|
type: 3,
|
|
|
favorite_id: item.id
|
|
|
};
|
|
|
|
|
|
that.$axios
|
|
|
.post(url, param)
|
|
|
.then(function(res) {
|
|
|
console.log(res);
|
|
|
if (item.is_favorite == 0) {
|
|
|
item.is_favorite = 1;
|
|
|
that.sortlist[index].is_favorite = 1;
|
|
|
that.sortlist[index].favorite_count =
|
|
|
that.sortlist[index].favorite_count + 1;
|
|
|
Toast("收藏成功");
|
|
|
} else if (item.is_favorite == 1) {
|
|
|
item.is_favorite = 1;
|
|
|
Toast("取消收藏成功");
|
|
|
that.sortlist[index].is_favorite = 0;
|
|
|
that.sortlist[index].favorite_count =
|
|
|
that.sortlist[index].favorite_count - 1;
|
|
|
}
|
|
|
that.sortlist = that.sortlist;
|
|
|
that.$forceUpdate();
|
|
|
})
|
|
|
.catch(function(err) {
|
|
|
console.log(err);
|
|
|
});
|
|
|
},
|
|
|
|
|
|
zanclick(index, item) {
|
|
|
let that = this;
|
|
|
console.log(item.id);
|
|
|
var url = "/api/user/good";
|
|
|
let param = {
|
|
|
type: 1,
|
|
|
good_id: item.id
|
|
|
};
|
|
|
|
|
|
that.$axios
|
|
|
.post(url, param)
|
|
|
.then(function(res) {
|
|
|
console.log(res);
|
|
|
if (item.is_good == 0) {
|
|
|
item.is_good = 1;
|
|
|
that.sortlist[index].is_good = 1;
|
|
|
that.sortlist[index].good_count =
|
|
|
that.sortlist[index].good_count + 1;
|
|
|
Toast("点赞成功");
|
|
|
} else if (item.is_good == 1) {
|
|
|
item.is_good = 1;
|
|
|
Toast("取消点赞成功");
|
|
|
that.sortlist[index].is_good = 0;
|
|
|
that.sortlist[index].good_count =
|
|
|
that.sortlist[index].good_count - 1;
|
|
|
}
|
|
|
that.sortlist = that.sortlist;
|
|
|
that.$forceUpdate();
|
|
|
})
|
|
|
.catch(function(err) {
|
|
|
console.log(err);
|
|
|
});
|
|
|
},
|
|
|
|
|
|
// 复制文本
|
|
|
copytext() {},
|
|
|
|
|
|
selectnav(id, index) {
|
|
|
let that = this;
|
|
|
|
|
|
this.selnav = index;
|
|
|
this.sort_id = id
|
|
|
this.sort_id = id;
|
|
|
that.page = 1;
|
|
|
that.sortlist = [];
|
|
|
that.getsocidtylist()
|
|
|
that.getsocidtylist();
|
|
|
},
|
|
|
publish() {
|
|
|
this.$router.push({
|
|
|
path: "/publish",
|
|
|
path: "/publish"
|
|
|
// query: { testId: item.test_student_id }
|
|
|
});
|
|
|
},
|
...
|
...
|
@@ -142,19 +311,17 @@ export default { |
|
|
getsort() {
|
|
|
let that = this;
|
|
|
var url = "/api/social/sort";
|
|
|
let param = {
|
|
|
|
|
|
};
|
|
|
let param = {};
|
|
|
|
|
|
that.$axios
|
|
|
.post(url, param)
|
|
|
.then(function (res) {
|
|
|
.then(function(res) {
|
|
|
console.log(res);
|
|
|
that.navarr = res.data
|
|
|
that.sort_id = res.data[0].id
|
|
|
|
|
|
that.navarr = res.data;
|
|
|
that.sort_id = res.data[0].id;
|
|
|
that.getsocidtylist();
|
|
|
})
|
|
|
.catch(function (err) {
|
|
|
.catch(function(err) {
|
|
|
console.log(err);
|
|
|
});
|
|
|
},
|
...
|
...
|
@@ -169,14 +336,13 @@ export default { |
|
|
|
|
|
that.$axios
|
|
|
.post(url, param)
|
|
|
.then(function (res) {
|
|
|
.then(function(res) {
|
|
|
console.log(res);
|
|
|
that.sortlist = that.sortlist.concat(res.data.social)
|
|
|
that.sortlist = that.sortlist.concat(res.data.social);
|
|
|
that.this_page = res.data.this_page;
|
|
|
that.total_page = res.data.total_page
|
|
|
|
|
|
that.total_page = res.data.total_page;
|
|
|
})
|
|
|
.catch(function (err) {
|
|
|
.catch(function(err) {
|
|
|
console.log(err);
|
|
|
});
|
|
|
}
|
...
|
...
|
|