174 lines
4.7 KiB
Vue
174 lines
4.7 KiB
Vue
<template>
|
|
<view class="common">
|
|
<view class="history" v-if="ranklist.length">
|
|
<delectList :list="ranklist" :type="user.type" :border="false" @changeDelete="changeDelete"></delectList>
|
|
<view class="endtext" v-if="!lastPage || page >= lastPage">—— 到底了，看看别的吧 ——</view>
|
|
</view>
|
|
<view class="nolist" v-if="!lastPage">
|
|
<icon class="iconfont icon-zanwu"></icon>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import delectList from "@/components/mark-slide-list/mark-slide-list.vue"
|
|
import {
|
|
mapState
|
|
} from "vuex";
|
|
export default {
|
|
components: {
|
|
delectList
|
|
},
|
|
computed: {
|
|
...mapState(['user', "appTheme"]),
|
|
},
|
|
data() {
|
|
return {
|
|
buttonList: [{
|
|
title: '删除',
|
|
background: '#ff3b32'
|
|
}],
|
|
list: [
|
|
"测量时间",
|
|
"体重",
|
|
"BMI",
|
|
"操作",
|
|
],
|
|
ranklist: [],
|
|
page: 1,
|
|
lastPage: 1,
|
|
type: null,
|
|
id: null,
|
|
startX: 0,
|
|
endX: 0
|
|
}
|
|
},
|
|
onLoad() {
|
|
let that = this
|
|
// 导航栏颜色
|
|
uni.setNavigationBarColor({
|
|
frontColor: '#ffffff',
|
|
backgroundColor: that.appTheme,
|
|
})
|
|
that.getList(1)
|
|
},
|
|
onReachBottom() {
|
|
let that = this
|
|
console.log("this.lastPage", this.lastPage)
|
|
if (!this.lastPage || this.page >= this.lastPage) {
|
|
uni.showToast({
|
|
title: '没有更多数据！',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
this.page++
|
|
this.getList(this.page)
|
|
},
|
|
methods: {
|
|
changeDelete(item) {
|
|
let that = this
|
|
uni.showModal({
|
|
title: '友情提示',
|
|
content: '是否删除当前测量记录？',
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
that.$model.gethistorydelete({
|
|
id: item.id,
|
|
}).then((res) => {
|
|
if (res.code != 0) {
|
|
that.$tools.msg(res.message)
|
|
return
|
|
}
|
|
that.ranklist.splice(that.ranklist.findIndex(ite => ite.id === item
|
|
.id), 1)
|
|
that.$store.dispatch("getUserInfo", {
|
|
familyid: that.user.familyid,
|
|
})
|
|
that.$store.dispatch("getResult", {
|
|
birthday: that.user.birthday,
|
|
familyid: that.user.familyid,
|
|
height: that.user.height,
|
|
sex: that.user.sex,
|
|
})
|
|
|
|
that.$tools.msg("删除成功")
|
|
})
|
|
} else if (res.cancel) {
|
|
that.$tools.msg("您已取消操作！");
|
|
}
|
|
},
|
|
})
|
|
},
|
|
getList(page) {
|
|
let that = this
|
|
that.$model.getHistoryList({
|
|
familyId: that.user.familyid,
|
|
pageNo: page,
|
|
pageSize: 10
|
|
}).then((res) => {
|
|
console.log("历史记录", res)
|
|
if (res.code != 0) return
|
|
res.data.rows.forEach(item => {
|
|
item.slide_x = 0
|
|
})
|
|
this.ranklist = this.ranklist.concat(res.data.rows)
|
|
this.lastPage = res.data.totalpage
|
|
})
|
|
},
|
|
// 滑动开始
|
|
touchStart(e) {
|
|
// 记录初始位置
|
|
this.startX = e.touches[0].clientX
|
|
},
|
|
// 滑动结束
|
|
touchEnd(e) {
|
|
console.log("2", e)
|
|
// 当前滑动的父级元素
|
|
let parentElement = e.currentTarget
|
|
// 记录结束位置
|
|
this.endX = e.changedTouches[0].clientX
|
|
// 左滑
|
|
if (parentElement.dataset.type == 0 && this.startX - this.endX > 30) {
|
|
this.restSlide()
|
|
parentElement.dataset.type = 1
|
|
}
|
|
// 右滑
|
|
if (parentElement.dataset.type == 1 && this.startX - this.endX < -30) {
|
|
this.restSlide()
|
|
parentElement.dataset.type = 0
|
|
}
|
|
this.startX = 0
|
|
this.endX = 0
|
|
},
|
|
// 判断当前是否有滑块处于滑动状态
|
|
checkSlide() {
|
|
let listItems = document.querySelectorAll('.list')
|
|
for (let i = 0; i < listItems.length; i++) {
|
|
if (listItems[i].dataset.type == 1) {
|
|
return true
|
|
}
|
|
}
|
|
return false
|
|
},
|
|
// 复位滑动状态
|
|
restSlide() {
|
|
let listItems = document.querySelectorAll('list')
|
|
// 复位
|
|
for (let i = 0; i < listItems.length; i++) {
|
|
listItems[i].dataset.type = 0
|
|
}
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped="scoped" lang="scss">
|
|
.common {
|
|
min-height: calc(100vh - 40px);
|
|
padding-bottom: 15px
|
|
}
|
|
.history {
|
|
margin-bottom: 40px;
|
|
}
|
|
</style>
|