yantai-app/yt_wenjuandiaocha/pages/index/index.vue

<template>
  <view class="page">
    <view class="g-bd" v-if="iniLoaded">
      <view class="g-fixed_top">
        <top-tabs
          @onShift="handleShiftMenu"
          :curr-menu="current"
          :menu-list="menuList"
        />
      </view>
      <swiper
        class="m-swiper_list"
        :current="current"
        onChange="handleSwiperChange"
      >
        <swiper-item>
          <list
            v-if="current == 0"
            :list="list"
            :noMore="noMore"
            :pageEmpty="pageEmpty"
            @onTapItem="handleTapItem"
            @onScrollToLower="getMore"
          />
        </swiper-item>
        <swiper-item>
          <list
            v-if="current == 1"
            :list="list"
            :noMore="noMore"
            :pageEmpty="pageEmpty"
            @onTapItem="handleTapItem"
            @onScrollToLower="getMore"
          />
        </swiper-item>
      </swiper>
    </view>
  </view>
</template>

<script>
import topTabs from "@/components/top-tabs/top-tabs";
import list from "@/components/list/list";
import * as userTools from "../../utils/user";
import CustomerApi from "../../utils/api";
const app = getApp();
export default {
  components: {
    topTabs,
    list,
  },
  data() {
    return {
      userInfo: null,
      gridInfo: null,
      customerId: "",
      iniLoaded: false,

      menuList: [
        {
          name: "收集中",
          value: 0,
        },
        {
          name: "已结束",
          value: 1,
        },
      ],

      current: 0,
      list: [],
      pageEmpty: false,
      showPage: false,
      userInfo: null,
      pageNo: 1,
      pageSize: 8,
      iniLoading: false,
      noMore: false,
    };
  },
  onLoad() {
    function getIframeQueryParams() {
      // 使用URLSearchParams解析查询参数
      function getStringAfterQuestionMark(str) {
        return str.split("?").pop();
      }
      var result = getStringAfterQuestionMark(window.location.href);
      var params = new URLSearchParams(result);
      // 创建一个对象来存储解析后的参数
      var queryParams = {};
      // 遍历所有查询参数并存储到对象中
      params.forEach((value, key) => {
        queryParams[key] = value;
      });

      return queryParams;
    }
    const query = getIframeQueryParams();
    const token =
      process.env.NODE_ENV == "development"
        ? "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJhcHAiOiJnb3YiLCJjbGllbnQiOiJ3ZWIiLCJleHAiOjE4MTUwMjk5OTIsInVzZXJJZCI6IjE3MTQ1Njc3MDIxNDQ3NzgyNDEiLCJpYXQiOjE3MjA0MjE5OTJ9.pd2YFt77R0dW8i_0UZ1aaso4vrkrJIo8s-ULbKPcl30G0_sS9iBYGr_jhbNehrrMTq1U3xyGUzzrMZ8lvn_jJQ"
        : query.token;
    const gridId =
      process.env.NODE_ENV == "development"
        ? "32a6084b-f7c9-11ee-96cf-fa163ef15b63"
        : query.gridId;
    userTools.setStoreUserInfo(
      JSON.stringify({
        gridId: gridId,
        authorization: token,
        customerId: "1535072605621841922",
      })
    );
    userTools.setStoreGridInfo(
      JSON.stringify({
        gridId: gridId,
      })
    );
    // this.setData({
    // 		userInfo: {
    // 			gridId: gridId,
    // 			authorization: token,
    // 			customerId: "1535072605621841922",
    // 		},
    // 		gridInfo: {
    // 			gridId
    // 		},
    // 		showPage: true,
    // 	},
    // 	() => {
    // 	}
    // );
    this.setData(
      {
        pageNo: 1,
        list: [],
      },
      () => {
        this.init();
      }
    );
    // _this.handleTapItem({})
  },
  onShow() {
    if (this.showPage) {
      this.setData(
        {
          pageNo: 1,
          list: [],
        },
        () => {
          this.getList();
        }
      );
    }
  },
  // 下拉刷新
  onPullDownRefresh() {
    this.setData({
      pageNo: 1,
      list: [],
    });
    this.getList();
  },
  methods: {
    init() {
      let userInfo = userTools.getStoreUserInfo();
      let gridInfo = userTools.getStoreGridInfo();
      this.setData(
        {
          userInfo,
          gridInfo,
          showPage: true,
          iniLoaded: true,
        },
        () => {
          this.getList();
        }
      );
    },

    async getList() {
      uni.showLoading();
      let { userInfo, gridInfo, current, pageNo, pageSize } = this;
      let params = {
        client: "resi",
        orgId: userInfo.gridId || gridInfo.gridId,
        orgType: userInfo.gridId || gridInfo.gridId,
        status: current == 0 ? 2 : 3,
        pageSize,
        pageNo,
      };
      let result = await CustomerApi.fetchQuestionnaireist(params);
      let { code, data } = result;
      if (code == 0) {
        uni.hideLoading();
        let list = data;
        this.setData({
          iniLoading: true,
          list,
        });
        // this.p_formatItemForData(list);
        this.p_judgeNoMoreData(list);
        this.p_judgePageEmpty(list);
        uni.stopPullDownRefresh();
      }
    },

    // 格式化数据
    p_formatItemForData(list) {
      this.$spliceData({
        list: [this.list.length, 0, ...list],
      });
    },

    // 页面是否为空
    p_judgePageEmpty(list) {
      if (this.pageNo == 1 && list.length == 0) {
        this.setData({
          pageEmpty: true,
        });
      } else {
        this.setData({
          pageEmpty: false,
        });
      }
    },

    // 本次加载是否为空
    p_judgeNoMoreData(list) {
      if (list.length < this.pageSize) {
        this.setData({
          noMore: true,
        });
      } else {
        this.setData({
          noMore: false,
        });
      }
    },

    // 上拉加载
    // onReachBottom() {
    //   // 页面被拉到底部
    //   if (this.data.noMore) return;
    //   let page = this.data.pageNo + 1;
    //   this.setData({
    //     pageNo: page
    //   });
    //   this.getList();
    // },
    getMore() {
      if (this.noMore) {
        return;
      }
      let page = this.pageNo + 1;
      this.setData({
        pageNo: page,
      });
      this.getList();
    },

    handleSwiperChange(e) {
      let current = e.detail.current;
      this.setData(
        {
          current,
          pageNo: 1,
          list: [],
        },
        () => {
          this.getList();
        }
      );
    },

    handleShiftMenu({ value }) {
      this.setData(
        {
          current: value,
          pageNo: 1,
          list: [],
        },
        () => {
          this.getList();
        }
      );
    },

    handleTapItem(item) {
      uni.navigateTo({
        url: `/pages/detail/index?item=${JSON.stringify(item)}`,
      });
    },
  },
};
</script>
<style>
@import "/data/acss/questionnaire.css";

@import "/data/acss/global.css";
@import "/data/acss/questionnaire-list.css";
</style>