|
|
@@ -0,0 +1,439 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <!-- tab切换 -->
|
|
|
+ <view class="inv-h-w">
|
|
|
+ <view :class="['inv-h',Inv==0?'inv-h-se':'']" @click="Inv=0">虫害</view>
|
|
|
+ <view :class="['inv-h',Inv==1?'inv-h-se':'']" @click="Inv=1">病害</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="" v-if="isShow">
|
|
|
+ <!-- 虫害 -->
|
|
|
+ <view class="plant_ul" v-show="Inv == 0">
|
|
|
+ <view class="plant_li" v-for="(item, index) in insectArr">
|
|
|
+ <u-image shape="square" border-radius="10" width="250rpx" height="200rpx" class="plant_li_img" :src="item.img"></u-image>
|
|
|
+
|
|
|
+ <view class="">
|
|
|
+ <view class="plant_liBox">
|
|
|
+ <view class="plant_liBox_top">{{ item.name }}</view>
|
|
|
+ <view class="plant_liBox_center">所属作物:{{ item.host == "" ? '暂未收录' : item.host }}</view>
|
|
|
+ <view class="plant_liBox_bottom">收藏日期:{{ item.time }}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="plant_btmHandle">
|
|
|
+ <view class="plant_btmHandle_cancel" @click="noCollect(index, item.id)">
|
|
|
+ <image :src="'http://web.hnyfwlw.com:58003/bigservers/' + 'images/starA.png'" mode="" class="plant_btmHandle_cancelImg"></image>
|
|
|
+ <text class="plant_btmHandle_cancelTxt">取消收藏</text>
|
|
|
+ </view>
|
|
|
+ <view class="plant_btmHandle_record" @click="defail(item.id)">
|
|
|
+ <image :src="'http://web.hnyfwlw.com:58003/bigservers/' + 'images/detail_8.png'" class="plant_btmHandle_recordImg" mode=""></image>
|
|
|
+ <text class="plant_btmHandle_recordTxt">查看详情</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 病害 -->
|
|
|
+ <view class="plant_ul" v-show="Inv == 1">
|
|
|
+ <view class="plant_li" v-for="(item, index) in plantArr">
|
|
|
+ <u-image shape="square" border-radius="10" width="250rpx" height="200rpx" class="plant_li_img" :src="item.img"></u-image>
|
|
|
+
|
|
|
+ <view>
|
|
|
+ <view class="plant_liBox">
|
|
|
+ <view class="plant_liBox_top">{{ item.name }}</view>
|
|
|
+ <view class="plant_liBox_center">所属作物:{{ item.host == "" ? '暂未收录' : item.host }}</view>
|
|
|
+ <view class="plant_liBox_bottom">收藏日期:{{ item.time }}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="plant_btmHandle">
|
|
|
+ <view class="plant_btmHandle_cancel" @click="noCollect(index, item.id)">
|
|
|
+ <image :src="'http://web.hnyfwlw.com:58003/bigservers/' + 'images/starA.png'" mode="" class="plant_btmHandle_cancelImg"></image>
|
|
|
+ <text class="plant_btmHandle_cancelTxt">取消收藏</text>
|
|
|
+ </view>
|
|
|
+ <view class="plant_btmHandle_record" @click="defail(item.id)">
|
|
|
+ <image :src="'http://web.hnyfwlw.com:58003/bigservers/' + 'images/detail_8.png'" class="plant_btmHandle_recordImg" mode=""></image>
|
|
|
+ <text class="plant_btmHandle_recordTxt">查看详情</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 暂无 -->
|
|
|
+ <view class="notDataBox" v-else>
|
|
|
+ <image :src="'http://web.hnyfwlw.com:58003/bigservers/' + 'images/detail_11.png'" class="notDataBox_img" mode=""></image>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 返回顶部 -->
|
|
|
+ <u-back-top :scroll-top="scrollTop" top="600"></u-back-top>
|
|
|
+
|
|
|
+ <!-- 弹框提示 -->
|
|
|
+ <u-top-tips ref="uTips"></u-top-tips>
|
|
|
+
|
|
|
+ <view class="isOver" v-if="flag">
|
|
|
+ ---- 我是有底线的 ----
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!--loading-->
|
|
|
+ <ourLoading v-show="loadingShow" isFullScreen active text="加载中..." />
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ Inv: 0,
|
|
|
+ scrollTop: 0, //返回顶部
|
|
|
+ insectArr: [], //病虫害列表
|
|
|
+ plantArr: [],
|
|
|
+ isShow: true,
|
|
|
+ dataNum: null, //列表总条数
|
|
|
+ pageIndex: 1, //当前页数
|
|
|
+ pagination: null, //总页码
|
|
|
+ numData: 10, //固定每页显示多少条
|
|
|
+ listLangth: null, //每次请求数据条数
|
|
|
+ flag: false,
|
|
|
+ loadingShow: true, //加载
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ Inv(val) {
|
|
|
+ this.dataNum = null //清空
|
|
|
+ console.log(this.pageIndex)
|
|
|
+ this.pageIndex = 1 //清空
|
|
|
+ this.pagination = null //清空
|
|
|
+ this.listLength = null
|
|
|
+ this.flag = false
|
|
|
+ if (val == 0) {
|
|
|
+ //虫害
|
|
|
+ this.listData(2)
|
|
|
+ this.insectArr = []
|
|
|
+ } else {
|
|
|
+ //病害
|
|
|
+ this.listData(1)
|
|
|
+ this.plantArr = []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ insectArr(val) {
|
|
|
+ console.log(val)
|
|
|
+ if (val.length == 0) {
|
|
|
+ this.isShow = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ plantArr(val) {
|
|
|
+ if (val.length == 0) {
|
|
|
+ this.isShow = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ changeTab(Inv) {
|
|
|
+ that.navIdx = Inv;
|
|
|
+ },
|
|
|
+
|
|
|
+ // 列表数据
|
|
|
+ listData(numDat) {
|
|
|
+ var that = this
|
|
|
+ uni.request({
|
|
|
+ url: 'user_collect',
|
|
|
+ method: 'get',
|
|
|
+ data: {
|
|
|
+ page: this.pageIndex,
|
|
|
+ ret: numDat
|
|
|
+ },
|
|
|
+ header: {
|
|
|
+ "Content-Type": "application/x-www-form-urlencoded"
|
|
|
+ },
|
|
|
+ dataType: 'json',
|
|
|
+ success(res) {
|
|
|
+ if (res.data.code !== "10011") {
|
|
|
+ that.dataNum = res.data.nums
|
|
|
+ if (numDat == '1') {
|
|
|
+ that.plantArr = [...that.plantArr, ...res.data.dat]
|
|
|
+ var arrayData = that.plantArr
|
|
|
+ } else {
|
|
|
+ that.insectArr = [...that.insectArr, ...res.data.dat]
|
|
|
+ var arrayData = that.insectArr
|
|
|
+ }
|
|
|
+ // that.insectArr = res.data.dat
|
|
|
+ for (var i = 0; i < arrayData.length; i++) {
|
|
|
+ let Adata = new Array();
|
|
|
+ Adata = arrayData[i].img_urls.split("#");
|
|
|
+ arrayData[i].img = Adata[0]
|
|
|
+ }
|
|
|
+ that.isShow = true
|
|
|
+ that.listLength = res.data.dat.length
|
|
|
+ } else {
|
|
|
+ that.isShow = false
|
|
|
+ }
|
|
|
+ that.loadingShow = false
|
|
|
+ },
|
|
|
+ fail(err) {
|
|
|
+ console.log(err)
|
|
|
+ that.loadingShow = false
|
|
|
+ },
|
|
|
+ complete(com) {
|
|
|
+ // console.log(com)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ defail(id) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/details/details?id=' + id + '&signboard=1'
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ noCollect(index, id) {
|
|
|
+ var that = this
|
|
|
+ let postData = ({
|
|
|
+ id: id,
|
|
|
+ ret: 'move'
|
|
|
+ })
|
|
|
+ uni.request({
|
|
|
+ url: 'user_collect',
|
|
|
+ method: 'post',
|
|
|
+ data: postData,
|
|
|
+ header: {
|
|
|
+ "Content-Type": "application/x-www-form-urlencoded"
|
|
|
+ },
|
|
|
+ success(res) {
|
|
|
+ if (res.data.code == 200) {
|
|
|
+ that.$refs.uTips.show({
|
|
|
+ title: '取消收藏成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: '1500'
|
|
|
+ })
|
|
|
+ if (that.Inv == 0) {
|
|
|
+ //虫害
|
|
|
+ that.insectArr.splice(index, 1)
|
|
|
+ } else {
|
|
|
+ that.plantArr.splice(index, 1)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail(err) {
|
|
|
+ that.$refs.uTips.show({
|
|
|
+ title: '取消收藏失败',
|
|
|
+ type: 'error',
|
|
|
+ duration: '1500'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.listData(2)
|
|
|
+ },
|
|
|
+ // 滚动到底翻页
|
|
|
+ onReachBottom() {
|
|
|
+ if (this.dataNum !== 0 || this.dataNum !== null) {
|
|
|
+ if (this.pagination == null) {
|
|
|
+ var a = this.dataNum
|
|
|
+ var b = this.numData
|
|
|
+ var c = a / b
|
|
|
+ this.pagination = Math.ceil(c)
|
|
|
+ }
|
|
|
+ this.pagination--
|
|
|
+ // if (this.pagination !== 0) {
|
|
|
+ // this.pageIndex++
|
|
|
+ // console.log(this.pageIndex)
|
|
|
+ // if (this.Inv == 0) {
|
|
|
+ // this.listData(2)
|
|
|
+ // } else if (this.Inv == 1) {
|
|
|
+ // this.listData(1)
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // this.flag = true
|
|
|
+ // }
|
|
|
+
|
|
|
+ if (this.listLength == 10) {
|
|
|
+ console.log(this.listLength + '_______每次获取到数据的长度-true______')
|
|
|
+ if (this.pagination >= 1) {
|
|
|
+ console.log(this.pagination + '_______总页码-true______')
|
|
|
+ this.pageIndex++
|
|
|
+ if (this.Inv == 0) {
|
|
|
+ console.log('_______虫害-true______')
|
|
|
+ this.listData('2')
|
|
|
+ } else if (this.Inv == 1) {
|
|
|
+ console.log('_______病害-false______')
|
|
|
+ this.listData('1')
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ console.log(this.pagination + '_______总页码-false______')
|
|
|
+ this.flag = true
|
|
|
+ }
|
|
|
+ } else if (this.listLength < 10) {
|
|
|
+ console.log(this.listLength + '_______每次获取到数据的长度-false______')
|
|
|
+ this.flag = true
|
|
|
+ }
|
|
|
+
|
|
|
+ } else {
|
|
|
+ this.flag = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 监听下拉动作
|
|
|
+ onPullDownRefresh() {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.insectArr = []
|
|
|
+ this.plantArr = []
|
|
|
+ if (this.Inv == 0) {
|
|
|
+ this.listData('2')
|
|
|
+ } else if (this.Inv == 1) {
|
|
|
+ this.listData('1')
|
|
|
+ }
|
|
|
+ uni.stopPullDownRefresh()
|
|
|
+ },2000)
|
|
|
+ },
|
|
|
+
|
|
|
+ // 监听获取滚动条位置
|
|
|
+ onPageScroll(e) {
|
|
|
+ this.scrollTop = e.scrollTop;
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ // tab切换
|
|
|
+ page {
|
|
|
+ background-color: #f7f8fc;
|
|
|
+ }
|
|
|
+
|
|
|
+ .inv-h-w {
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ height: 100upx;
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .inv-h {
|
|
|
+ font-size: 30upx;
|
|
|
+ flex: 1;
|
|
|
+ text-align: center;
|
|
|
+ color: #C9C9C9;
|
|
|
+ height: 100upx;
|
|
|
+ line-height: 100upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .inv-h-se {
|
|
|
+ color: #20c7a1;
|
|
|
+ border-bottom: 4upx solid #20c7a1;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 内容列表
|
|
|
+ .plant_ul {
|
|
|
+ .plant_li {
|
|
|
+ border-radius: 6px;
|
|
|
+ background: #fff;
|
|
|
+ box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
|
+ display: flex;
|
|
|
+ width: 720rpx;
|
|
|
+ margin: 15rpx auto;
|
|
|
+ padding: 15rpx 20rpx 15rpx 20rpx;
|
|
|
+
|
|
|
+ .plant_li_img {
|
|
|
+ width: 250rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_liBox {
|
|
|
+ // border: 1px solid #007AFF;
|
|
|
+ padding: 5rpx 0 15rpx 0;
|
|
|
+ margin: 0 0 0 35rpx;
|
|
|
+
|
|
|
+ .plant_liBox_top {
|
|
|
+ font-weight: 550;
|
|
|
+ font-size: 17px;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_liBox_center {
|
|
|
+ color: #9d9d9d;
|
|
|
+ font-size: 12px;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ width: 350rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_liBox_bottom {
|
|
|
+ color: #9d9d9d;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 取消收藏and查看详情
|
|
|
+ .plant_btmHandle {
|
|
|
+ border-top: 1px solid #f2f2f2;
|
|
|
+ padding: 5rpx 0 15rpx 0;
|
|
|
+ margin: 0 0 0 35rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ .plant_btmHandle_cancel {
|
|
|
+ border-right: 1px solid #f2f2f2;
|
|
|
+ padding: 0 20rpx 0 0;
|
|
|
+ margin: 10rpx 0 0 0;
|
|
|
+
|
|
|
+ .plant_btmHandle_cancelImg {
|
|
|
+ width: 35rpx;
|
|
|
+ height: 35rpx;
|
|
|
+ margin: -5rpx 0 0 0;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_btmHandle_cancelTxt {
|
|
|
+ color: #999999;
|
|
|
+ font-size: 13px;
|
|
|
+ margin: 0 0 0 5rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_btmHandle_record {
|
|
|
+ padding: 0 0 0 20rpx;
|
|
|
+ margin: 10rpx 0 0 0;
|
|
|
+
|
|
|
+ .plant_btmHandle_recordImg {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ margin: -5rpx 0 0 0;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant_btmHandle_recordTxt {
|
|
|
+ color: #999999;
|
|
|
+ font-size: 13px;
|
|
|
+ margin: 0 0 0 5rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 暂无数据
|
|
|
+ .notDataBox {
|
|
|
+ .notDataBox_img {
|
|
|
+ display: block;
|
|
|
+ margin: 300rpx auto;
|
|
|
+ width: 300rpx;
|
|
|
+ height: 300rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .isOver {
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ text-align: center;
|
|
|
+ // background: #fff;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+</style>
|