优化代码

This commit is contained in:
aixianling
2023-03-21 11:35:03 +08:00
parent 901fc767fb
commit ebb738e41b

View File

@@ -15,11 +15,11 @@
class="nav-item" class="nav-item"
hover-class="text-hover" hover-class="text-hover"
v-for="(item, index) in topic" :key="index" @click="$linkTo('./TopicDetail?themeId=' + item.id + '&name=' + item.title)"> v-for="(item, index) in topic" :key="index" @click="$linkTo('./TopicDetail?themeId=' + item.id + '&name=' + item.title)">
<image :src="item.picUrl" mode="aspectFill" /> <image :src="item.picUrl" mode="aspectFill"/>
<h2>{{ item.title }}</h2> <h2>{{ item.title }}</h2>
</div> </div>
<div class="nav-item" hover-class="text-hover" @click="$linkTo('./Topic')" v-if="topicList.length > 6"> <div class="nav-item" hover-class="text-hover" @click="$linkTo('./Topic')" v-if="topicList.length > 6">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-more.png" /> <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-more.png"/>
<h2>更多</h2> <h2>更多</h2>
</div> </div>
</div> </div>
@@ -31,31 +31,33 @@
hover-stop-propagation hover-stop-propagation
@click="$linkTo('./Detail?id=' + item.id + '&name=' + item.topicName + '&themeId=' + item.themeId)"> @click="$linkTo('./Detail?id=' + item.id + '&name=' + item.topicName + '&themeId=' + item.themeId)">
<div class="item-top"> <div class="item-top">
<image :src="item.createUserAvatar || 'https://cdn.cunwuyun.cn/wxmp/fengdu/avatar.png'" /> <image :src="item.createUserAvatar || 'https://cdn.cunwuyun.cn/wxmp/fengdu/avatar.png'"/>
<div class="right"> <div class="right">
<h3>{{ item.createUserName }}</h3> <h3>{{ item.createUserName }}</h3>
<span v-if="item.publishDepartName">{{ item.publishDepartName }}</span> <span v-if="item.publishDepartName">{{ item.publishDepartName }}</span>
</div> </div>
</div> </div>
<div class="item-content"> <div class="item-content">
<span hover-stop-propagation v-if="item.themeId" @click.stop="$linkTo('./TopicDetail?themeId=' + item.themeId + '&name=' + item.topicName)">#{{ item.topicName }}</span> <span hover-stop-propagation v-if="item.themeId"
@click.stop="$linkTo('./TopicDetail?themeId=' + item.themeId + '&name=' + item.topicName)">#{{ item.topicName }}</span>
<text>{{ item.content }}</text> <text>{{ item.content }}</text>
</div> </div>
<div class="item-imgs" v-if="item.files.length"> <div class="item-imgs" v-if="item.files.length">
<image mode="aspectFill" @click.stop="previewImage(e.url, item.files)" v-for="(e, i) in item.files" :key="i" :src="e.url" /> <image mode="aspectFill" @click.stop="previewImage(e.url, item.files)" v-for="(e, i) in item.files" :key="i" :src="e.url"/>
</div> </div>
<p>{{ item.createTime }}</p> <p>{{ item.createTime }}</p>
<div class="item-bottom"> <div class="item-bottom">
<button hover-stop-propagation @click.stop="onBtnClick" open-type="share" :data-content="item.content" :data-themeid="item.themeId" :data-id="item.id" :data-name="item.topicName"> <button hover-stop-propagation @click.stop="onBtnClick" open-type="share" :data-content="item.content" :data-themeid="item.themeId" :data-id="item.id"
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-zhuanfa.png" /> :data-name="item.topicName">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-zhuanfa.png"/>
<i>{{ item.sharedCount }}</i> <i>{{ item.sharedCount }}</i>
</button> </button>
<div hover-stop-propagation @click.stop="reciate(item.id, item.appreciateStatus)"> <div hover-stop-propagation @click.stop="reciate(item.id, item.appreciateStatus)">
<image :src="item.appreciateStatus ? 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan-active.png' : 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png'" /> <image :src="item.appreciateStatus ? 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan-active.png' : 'https://cdn.cunwuyun.cn/wxmp/fengdu/zan.png'"/>
<i>{{ item.appreciateCount }}</i> <i>{{ item.appreciateCount }}</i>
</div> </div>
<div> <div>
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-pinglun.png" /> <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-pinglun.png"/>
<i>{{ item.commentCount }}</i> <i>{{ item.commentCount }}</i>
</div> </div>
</div> </div>
@@ -63,21 +65,21 @@
<AiEmpty v-if="!list.length"></AiEmpty> <AiEmpty v-if="!list.length"></AiEmpty>
</div> </div>
<div class="add" hover-class="text-hover" @click="toAdd"> <div class="add" hover-class="text-hover" @click="toAdd">
<image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fatie.png" /> <image src="https://cdn.cunwuyun.cn/wxmp/fengdu/ic-fatie.png"/>
</div> </div>
<AiLogin ref="login"/> <AiLogin ref="login"/>
</div> </div>
</template> </template>
<script> <script>
import { mapActions, mapState } from 'vuex' import {mapActions, mapState} from 'vuex'
export default { export default {
name: 'AppCircle', name: 'AppCircle',
appName: '邻里互助', appName: '邻里互助',
navigationBarBackgroundColor: '#ffffff', navigationBarBackgroundColor: '#ffffff',
navigationBarTextStyle: 'black', navigationBarTextStyle: 'black',
data () { data() {
return { return {
currIndex: 0, currIndex: 0,
topicList: [], topicList: [],
@@ -91,12 +93,12 @@
computed: { computed: {
...mapState(['user', 'token']), ...mapState(['user', 'token']),
topic () { topic() {
return this.topicList.filter((v, index) => index < 7) return this.topicList.filter((v, index) => index < 7)
} }
}, },
onLoad () { onLoad() {
this.getTopicList() this.getTopicList()
uni.$on('updateList', () => { uni.$on('updateList', () => {
@@ -113,24 +115,24 @@
} }
}, },
onUnload () { onUnload() {
uni.$off('updateList') uni.$off('updateList')
}, },
methods: { methods: {
...mapActions(['autoLogin']), ...mapActions(['autoLogin']),
previewImage (url, files) { previewImage(url, files) {
uni.previewImage({ uni.previewImage({
current: url, current: url,
urls: files.map(v => v.url) urls: files.map(v => v.url)
}) })
}, },
onBtnClick (e) { onBtnClick(e) {
}, },
reciate (id, appreciateStatus) { reciate(id, appreciateStatus) {
this.$instance.post(`/app/appneighborhoodassistance/appreciate?id=${id}`).then(res => { this.$instance.post(`/app/appneighborhoodassistance/appreciate?id=${id}`).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.$toast(appreciateStatus ? '取消点赞' : '点赞成功') this.$toast(appreciateStatus ? '取消点赞' : '点赞成功')
@@ -140,7 +142,7 @@
}) })
}, },
getMyPublishCount () { getMyPublishCount() {
this.$instance.post(`/app/appneighborhoodassistance/list`, null, { this.$instance.post(`/app/appneighborhoodassistance/list`, null, {
params: { params: {
current: 1, current: 1,
@@ -155,7 +157,7 @@
}) })
}, },
toAdd () { toAdd() {
if (this.user.areaId) { if (this.user.areaId) {
this.$linkTo('./Add') this.$linkTo('./Add')
} else { } else {
@@ -169,7 +171,7 @@
} }
}, },
getTopicList () { getTopicList() {
this.$instance.post(`/app/appneighborhoodassistancetheme/list`, null, { this.$instance.post(`/app/appneighborhoodassistancetheme/list`, null, {
withoutToken: true, withoutToken: true,
params: { params: {
@@ -184,22 +186,20 @@
}) })
}, },
changeTab (index) { changeTab(index) {
this.currIndex = index this.currIndex = index
this.isMore = false this.isMore = false
this.current = 1 this.current = 1
this.$nextTick(() => { this.$nextTick(() => {
this.getList() this.getList()
}) })
}, },
getList () { getList() {
if (this.isMore) return if (this.isMore) return
this.$loading() this.$loading()
this.$instance.post(`/app/appneighborhoodassistance/list`, null, { this.$instance.post(`/app/appneighborhoodassistance/list`, null, {
withoutToken: this.token ? false : true, withoutToken: !this.token,
params: { params: {
current: this.current, current: this.current,
size: 10, size: 10,
@@ -207,7 +207,6 @@
} }
}).then(res => { }).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.$hideLoading()
if (this.current > 1) { if (this.current > 1) {
this.list = [...this.list, ...res.data.records.map(e => { this.list = [...this.list, ...res.data.records.map(e => {
return { return {
@@ -234,17 +233,15 @@
} else { } else {
this.isMore = true this.isMore = true
} }
}).catch(() => { }).finally(() => this.$hideLoading())
this.$hideLoading()
})
} }
}, },
onReachBottom () { onReachBottom() {
this.getList() this.getList()
}, },
onShareAppMessage (e) { onShareAppMessage(e) {
this.$instance.post(`/app/appneighborhoodassistance/share?id=${e.target.dataset.id}`).then(res => { this.$instance.post(`/app/appneighborhoodassistance/share?id=${e.target.dataset.id}`).then(res => {
if (res.code === 0) { if (res.code === 0) {
this.changeTab(this.currIndex) this.changeTab(this.currIndex)
@@ -256,11 +253,11 @@
path: `/pages/AppCircle/Detail?id=${e.target.dataset.id}&themeId=${e.target.dataset.themeid}&name=${e.target.dataset.name}` path: `/pages/AppCircle/Detail?id=${e.target.dataset.id}&themeId=${e.target.dataset.themeid}&name=${e.target.dataset.name}`
} }
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.AppCircle { .AppCircle {
padding-top: 120px; padding-top: 120px;
padding-bottom: 40px; padding-bottom: 40px;
@@ -500,5 +497,5 @@
} }
} }
} }
} }
</style> </style>