jwl-applet/src/pages/index/index.vue

<template>
  <view>
    <!-- <view v-if="getLoading" class="wp100 relative" style="height: 100vh;">
      <image class="wp100" mode="widthFix"
        src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E8%80%83%E8%AF%95%E6%8F%90%E9%86%92_20230906135037.png">
      </image>
      <view class="wp100 flex ai-c jc-c" style="position: absolute;bottom: 0;left: 0;padding-bottom: 124rpx;">
        <image style="width: 452rpx;"
          src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E9%87%91%E6%AD%A6%E8%81%94_20230831123333.png"
          mode="widthFix"></image>
      </view>
    </view> -->
    <view v-if="!getLoading">
      <!-- <j-navbar :isBack="false">金武联驾考</j-navbar> -->
      <u-sticky bgColor="#fff">
        <u-tabs :list="categoryList" :current="curTab" :scrollable="false" @change="changeCategory"></u-tabs>
      </u-sticky>
      <view class="m10tb" v-if="activityList&&activityList.length">
        <u-swiper class="acticity" keyName="image" :list="activityList" @click="handleToActivity"></u-swiper>
      </view>
      <view style="background-color: rgb(245, 245, 245);">
        <template v-if="subject=='1' || subject=='4'">
          <Subject1 :subject="subject" :rightList="rightList" :wrongList="wrongList" />
        </template>
        <template v-else>
          <Subject2 :subject="subject" ref="subjectRef" />
        </template>
      </view>
    </view>
  </view>
</template>
<script>
  import {
    mapState,
    mapActions
  } from 'pinia' //引入映射函数
  import useQuestionStore from '@/jtools/store/question' //引入store
	import useUserStore from '@/jtools/store/user'
  import storage from '@/jtools/storage';
  import {
    querySysConfigList,
  } from '@/jtools/api/question';
  import Subject1 from "./components/Subject1";
  import Subject2 from "./components/Subject2";
  import {
    queryActivityList
  } from '@/jtools/api/activity';
  export default {
    components: {
      Subject1,
      Subject2
    },
    data() {
      return {
        getLoading: true,
        show: false,
        subject: storage.get('curSubject') || '1',
        curTab: 0,
        searchValue: '',
        cityName: '',
        categoryList: [],
        rightList: storage.get(`rightList_subject${this.subject}`) || [],
        wrongList: storage.get(`wrongList_subject${this.subject}`) || [],
        activityList: []
      };
    },
    onShow() {
      setTimeout(() => {
        this.getLoading = false
        this.show = true
      }, 100);
      this.getSubjectConfig()
      if (this.subject == '1' || this.subject == '4') {
        this.rightList = storage.get(`rightList_subject${this.subject}`) || []
        this.wrongList = storage.get(`wrongList_subject${this.subject}`) || []
      }
      if (this.subject == '2' || this.subject == '3') {
        this.$refs.subjectRef.getDiverType()
      }
      this.queryActivityList()
    },
    onHide() {
      this.show = false
    },
    computed: {
      ...mapState(useQuestionStore, ["loading_subject4", "loading_subject1", "curSubject", "orderQuestion_subject1",
        "orderQuestion_subject4"
      ]), //映射函数，取出tagslist
    },
    methods: {
      ...mapActions(useQuestionStore, ['getOrderQuestion_sub4', 'getOrderQuestion_sub1', 'changeSubject']),
      //获取科目配置
      getSubjectConfig() {
        const carTypeId = storage.get('carType') || '1001'
        querySysConfigList(carTypeId, 'Subject').then(resp => {
          if (resp.code === '0000') {
            this.categoryList = resp.data.map(item => {
              return {
                ...item,
                name: item.configItemName
              }
            })
            this.subject = storage.get('curSubject') || '1',
              this.curTab = this.categoryList.findIndex(item => item.configItemCode == this.subject) || 0
          }
        })
      },
      //切换科目
      async changeCategory(val) {
        this.subject = val.configItemCode
        this.changeSubject(this.subject)
        if (this.subject == '1' || this.subject == '4') {
          this.rightList = storage.get(`rightList_subject${this.subject}`) || []
          this.wrongList = storage.get(`wrongList_subject${this.subject}`) || []
        } else {
          setTimeout(() => {
            this.$refs.subjectRef.getDiverType()
          }, 100)
        }
      },
      //查询活动列表
      queryActivityList() {
        queryActivityList({
          schoolId: useUserStore().userInfo?.schoolId || ''
        }).then(resp => {
          this.activityList = resp.data.map(item => ({
            ...item,
            image: 'https://jwl.ahduima.com' + item.image
          }));
        })
      },
      // 去活动
      handleToActivity(index) {
        let detailId;
        this.activityList.find((item, index1) => {
          if (index === index1) {
            detailId = item.detailId;
          }
        })
        uni.navigateTo({
          url: '/pages/index/activity?detailId=' + detailId,
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  ::v-deep .u-tabs__wrapper__nav__line {
    background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%) !important;
    bottom: 14rpx !important;
  }
</style>