<template>
	<view class="container">
		<v-navigation-bar title="操作指南" background-color="#fff" title-color="#333"></v-navigation-bar>
		<view class="body">
      <scroll-view style="height: 100%;" scroll-y="true" class="itemContent" @scrolltolower="onReachBottomCus"
        refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
        <view @click="gotoDetail(item)" v-for="(item,index) in dataList" :key="index" class="guideItem">
          <text class="guide_content">{{ item.title }}</text>
          <image class="guideIcon" src="../../static/icons/homeInfoMore.png" mode="aspectFit"></image>
        </view>
        <view style="text-align: center" v-if="dataList.length==0">
          <image class=""  src="@/static/images/nothing.png" ></image>
        </view>
      </scroll-view>
		</view>
	</view>
</template>

<script>
	import VNavigationBar from '@/components/VNavigationBar.vue'
  import request from "@/utils/request";
  import {setJSONData} from '@/utils/auth'
	export default {
		components: {
			VNavigationBar
		},
		data() {
			return {
				dataList: [],
        pageNo: 1,
        pageSize: 10,
        total: 0,
        //下来刷新状态
        isTriggered:false,
			};
		},
    onLoad(){
      this.getList()
    },
		methods: {
      /**
       * 上滑加载数据
       */
      onReachBottomCus() {
        //判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
        if (this.pageNo * this.pageSize >= this.total) {
          uni.$u.toast('没有更多数据了')
          return
        }
        //页码+1,调用获取数据的方法获取第二页数据
        this.pageNo++
        //此处调用自己获取数据列表的方法
        this.getList()
      },
      /**
       * 下拉刷新数据
       */
      onRefresherrefresh(){
        this.isTriggered = true
        this.pageNo = 1
        this.total = 0
        this.dataList = []
        this.getList()
      },
		  /**
       * 分页查询
       */
		  async getList(){
        await request({
          url: "/app-api/base/notice/pageList",
          method: "GET",
          params:{
            pageNo:this.pageNo,
            pageSize:this.pageSize,
            type:3,
            parentServer:"weixiu",
            server:"wx"
          },
          tenantIdFlag:false
        }).then((res) => {
          //判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
          if (this.pageNo != 1) {
            this.dataList = this.dataList.concat(res.data.records)
          } else {
            this.dataList = res.data.records
          }
          //将获取的总条数赋值
          this.total = res.data.total
          this.isTriggered = false
        })
      },
      /**
       * 查看详情页
       */
			gotoDetail(item) {
        setJSONData("guideObj",item)
				uni.navigateTo({
					url: '/pages/guideList/guideDetail'
				})
			}
		}
	}
</script>

<style lang="less" scoped>
.container {
	background-color: #F3F5F7;
	height: 100%;

	display: flex;
	flex-direction: column;

	.body {
		flex: 1;
		height: 0;
		padding: 0 0 20rpx;

		display: flex;
		flex-direction: column;

		.guideItem {
			margin: 20rpx 32rpx 0;
			background: #FFFFFF;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			padding: 40rpx 30rpx;

			display: flex;
			align-items: center;
			column-gap: 10rpx;

			font-size: 32rpx;
			color: #333333;

			.guide_content {
				flex: 1;
				width: 0;
			}

			.guideIcon {
				width: 24rpx;
				height: 24rpx;
			}
		}
	}
}
</style>
