登录调整整合

This commit is contained in:
aixianling
2022-01-04 17:17:44 +08:00
parent 4e81b6edb9
commit 6e529abfd7
3 changed files with 115 additions and 163 deletions

View File

@@ -1,51 +1,137 @@
<template>
<div class="AppCountryAlbum">
<component v-if="refresh" :is="component" @change="onChange" :params="params"/>
<div class="list">
<AiTopFixed>
<div class="area-content">
<AiAreaPicker :areaId="user.areaId" v-model="areaId" @select="areaSelect" :name.sync="areaName">
<img src="./img/local-icon.png" alt="">
<span class="label" v-if="areaName">{{ areaName }}</span>
<span v-else>请选择</span>
<u-icon name="arrow-down" color="#666" size="24"/>
</AiAreaPicker>
</div>
</AiTopFixed>
<div class="album-list">
<div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
<img :src="`${cdn}/dvcp/album/album${item.type}.png`" alt="">
<p class="text">{{ item.name }}</p>
<div class="tips">{{ item.total }}</div>
</div>
<AiEmpty v-if="!list.length"/>
</div>
</div>
</div>
</template>
<script>
import Detail from './detail'
import List from './list'
import {mapState} from 'vuex'
export default {
name: 'AppCountryAlbum',
appName: '乡村相册',
name: "AppCountryAlbum",
appName: "乡村相册",
data() {
return {
component: 'List',
params: {},
refresh: true
list: [],
areaId: '',
areaName: '',
cdn: ''
}
},
components: {Detail, List},
computed: {...mapState(['user'])},
onShow() {
document.title = "乡村相册"
this.handleRefresh()
this.areaId = this.user.areaId
this.areaName = this.user.areaName
this.getList()
this.cdn = this.$cdn.replace("/dvcp/h5", "");
},
methods: {
onChange(e) {
this.params = e.params
this.component = e.type
areaSelect(e) {
this.areaId = e
this.getList()
},
handleRefresh() {
this.refresh = false
this.$nextTick(() => {
this.refresh = true
getList() {
this.$http.post(`/app/appvillagepicturealbum/queryAlbumMenu`, null, {
params: {
areaId: this.areaId,
}
}).then(res => {
if (res.code == 0) {
this.list = res.data
}
})
}
},
toDetail(item) {
uni.navigateTo({url: `./detail?type=${item.type}&areaId=${this.areaId}&title=${item.name}&titleImgUrl=${this.cdn}/dvcp/album/album${item.type}.png`})
},
},
onReachBottom() {
this.current++;
this.getList()
},
}
</script>
<style lang="scss" scoped>
uni-page-body {
height: 100%;
}
.AppCountryAlbum {
height: 100%;
.area-content {
width: 100%;
line-height: 64px;
img {
width: 42px;
vertical-align: middle;
margin-right: 16px;
}
.u-icon {
margin-left: 6px;
}
}
.album-list {
padding: 32px 0 0 32px;
overflow: hidden;
.item {
width: calc(33% - 16px);
height: 240px;
border-radius: 8px;
position: relative;
margin: 0 16px 16px 0;
float: left;
img {
width: 100%;
height: 100%;
border-radius: 8px;
}
.text {
position: absolute;
bottom: 16px;
left: 0;
width: 100%;
text-align: center;
font-size: 32px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #FFF;
line-height: 44px;
}
.tips {
position: absolute;
top: 8px;
right: 8px;
padding: 0 8px;
line-height: 40px;
background-color: rgba(0, 0, 0, .6);
color: #fff;
border-radius: 8px;
font-size: 22px;
}
}
}
}
</style>

View File

@@ -40,7 +40,7 @@
</div>
<AiEmpty v-if="!list.length"/>
</div>
<div class="footer-btn" @click="uploadImg" v-if="editText == '编辑' ">上传图片</div>
<div class="footer-btn" @click="delConfirm" v-if="editText == '取消'">删除</div>
</div>
@@ -64,14 +64,12 @@ export default {
computed: { ...mapState(['user']) },
onLoad(option) {
this.params = option
console.log(this.params)
this.getList()
this.getStatistic()
},
onShow() {
document.title = "乡村相册"
},
methods: {
delConfirm() {
if(!this.delIds.length) {
@@ -86,7 +84,6 @@ export default {
this.getList()
this.getStatistic()
this.editClick('取消')
uni.$emit('updateList')
}
})
})
@@ -197,7 +194,6 @@ export default {
})
},
confirmUpload() {
console.log(this.fileList)
var urlList = []
this.fileList.map((item) => {
urlList.push(item.url)
@@ -211,7 +207,6 @@ export default {
this.$u.toast('上传成功!')
this.getList()
this.getStatistic()
uni.$emit('updateList')
}
})
}
@@ -343,7 +338,7 @@ export default {
height: 112px;
line-height: 112px;
background: #3975C6;
box-shadow: 0px 1px 0px 0px #EEEEEE;
box-shadow: 0 1px 0 0 #EEEEEE;
position: fixed;
bottom: 0;
left: 0;
@@ -354,4 +349,4 @@ export default {
z-index: 999;
}
}
</style>
</style>

View File

@@ -1,129 +0,0 @@
<template>
<div class="list">
<AiTopFixed>
<div class="area-content">
<AiAreaPicker :areaId="user.areaId" v-model="areaId" @select="areaSelect" :name.sync="areaName">
<img src="./img/local-icon.png" alt="">
<span class="label" v-if="areaName">{{ areaName }}</span>
<span v-else>请选择</span>
<u-icon name="arrow-down" color="#666" size="24" />
</AiAreaPicker>
</div>
</AiTopFixed>
<div class="album-list">
<div class="item" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
<img :src="`${cdn}/dvcp/album/album${item.type}.png`" alt="">
<p class="text">{{item.name}}</p>
<div class="tips">{{item.total}}</div>
</div>
<AiEmpty v-if="!list.length"/>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
data() {
return {
list: [],
areaId: '',
areaName: '',
cdn: ''
}
},
computed: { ...mapState(['user']) },
created() {
this.areaId = this.user.areaId
this.areaName = this.user.areaName
this.getList()
uni.$on('updateList', () => {
this.getList()
})
this.cdn = this.$cdn.replace("/dvcp/h5","");
},
methods: {
areaSelect(e) {
this.areaId = e
this.getList()
},
getList() {
this.$http.post(`/app/appvillagepicturealbum/queryAlbumMenu`, null, {
params: {
areaId: this.areaId,
}
}).then(res => {
if (res.code == 0) {
this.list = res.data
}
})
},
toDetail(item) {
uni.navigateTo({url: `./detail?type=${item.type}&areaId=${this.areaId}&title=${item.name}&titleImgUrl=${this.cdn}/dvcp/album/album${item.type}.png`})
},
},
onReachBottom() {
this.current++;
this.getList()
},
}
</script>
<style lang="scss" scoped>
.list {
.area-content{
width: 100%;
line-height: 64px;
img{
width: 42px;
vertical-align: middle;
margin-right: 16px;
}
.u-icon{
margin-left: 6px;
}
}
.album-list{
padding: 32px 0 0 32px;
overflow: hidden;
.item{
width: calc(33% - 16px);
height: 240px;
border-radius: 8px;
position: relative;
margin: 0 16px 16px 0;
float: left;
img{
width: 100%;
height: 100%;
border-radius: 8px;
}
.text{
position: absolute;
bottom: 16px;
left: 0;
width: 100%;
text-align: center;
font-size: 32px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #FFF;
line-height: 44px;
}
.tips{
position: absolute;
top: 8px;
right: 8px;
padding: 0 8px;
line-height: 40px;
background-color: rgba(0,0,0,.6);
color: #fff;
border-radius: 8px;
font-size: 22px;
}
}
}
}
</style>