Skip to content

S
shuchengMiniPro
Commit 80a82023 authored by shilei's avatar shilei
Browse files
Options

index

parent a4087f18
Pipeline #108 canceled with stages
      Show whitespace changes
      Inline Side-by-side
      Showing with 2 additions and 444 deletions
      src/pages/index/index.vue
      View file @ 80a82023
      <template>
      <div class="container">
      <div v-if="loadingOff">
      <template v-if="hasLogin">
      <view>
      <swiper
      class="swiper"
      circular
      :indicator-dots="true"
      :autoplay="true"
      :interval="5000"
      :duration="500"
      >
      <swiper-item v-for="(swiper, index) in swiperList" :key="swiper.imageUrl">
      <image
      :src="swiper.imageUrl"
      class="swiper-item"
      mode="aspectFill"
      @click="jump(index)"
      ></image>
      </swiper-item>
      </swiper>
      </view>
      <view class="flex navigation-section">
      <div class="nav-box" @click="navTo('myProject')">
      <img class="nav-icon" src="/static/img/icon-entry1.png" alt="" />
      <text class="nav-text">我的项目</text>
      </div>
      <div class="nav-box" @click="navTo('toast')">
      <img class="nav-icon" src="/static/img/icon-entry2.png" alt="" />
      <text class="nav-text">提取佣金</text>
      </div>
      <div class="nav-box" @click="navTo('todo')">
      <div class="nav-icon rel">
      <img class="nav-icon" src="/static/img/icon-entry3.png" alt="" />
      <u-badge
      :absolute="true"
      :offset="[0, 0]"
      numberType="overflow"
      bgColor="#BF0008"
      max="9"
      :value="todoCount"
      :show="todoCount > 0"
      ></u-badge>
      </div>
      <text class="nav-text">确认事项</text>
      </div>
      <div class="nav-box" @click="navTo('official')">
      <img class="nav-icon" src="/static/img/icon-entry4.png" alt="" />
      <text class="nav-text">产业课堂</text>
      </div>
      </view>
      <view class="default-box data-view mb20">
      <div class="flex align-center">
      <p
      class="tab-title"
      :class="{ active: activeTab === 'my' }"
      @click="activeTab = 'my'"
      v-if="hasLogin"
      >
      我的项目
      </p>
      <i class="line align-center" v-if="hasLogin"></i>
      <p
      class="tab-title"
      :class="{ active: activeTab === 'all' }"
      @click="activeTab = 'all'"
      >
      平台项目
      </p>
      </div>
      <u-line color="#E6E6E6"></u-line>
      <template v-if="activeTab === 'my'">
      <div class="flex justify-center">
      <div class="data-item">
      <p class="data-name">总项目量</p>
      <p class="data-num">
      {{ myProjectInfo.projectAllCount || 0 }} <span>个</span>
      </p>
      </div>
      <div class="data-item red">
      <p class="data-name">总固定资产投资额</p>
      <p class="data-num">
      {{ myProjectInfo.projectInvestmentTotal || 0 }} <span>亿元</span>
      </p>
      </div>
      </div>
      <u-line color="#E6E6E6" margin="10rpx 10rpx"></u-line>
      <div class="flex justify-center">
      <div class="data-item">
      <p class="data-name">审核中的项目</p>
      <p class="data-num">
      {{ myProjectInfo.projectExamineCount || 0 }} <span>个</span>
      </p>
      </div>
      <div class="data-item">
      <p class="data-name">推进中的项目</p>
      <p class="data-num">
      {{ myProjectInfo.projectPushCount || 0 }} <span>个</span>
      </p>
      </div>
      </div>
      </template>
      <template v-if="activeTab === 'all'">
      <div class="flex justify-center">
      <div class="data-item">
      <p class="data-name">总项目量</p>
      <p class="data-num">
      {{ platformProjectInfo.projectAllCount || 0 }} <span>个</span>
      </p>
      </div>
      <div class="data-item red">
      <p class="data-name">总投资额</p>
      <p class="data-num">
      {{ platformProjectInfo.projectInvestmentTotal || 0 }}
      <span>亿元</span>
      </p>
      </div>
      </div>
      <u-line color="#E6E6E6" margin="10rpx 10rpx"></u-line>
      <div class="flex justify-center">
      <div class="data-item">
      <p class="data-name">总固定资产投资额</p>
      <p class="data-num">
      {{ platformProjectInfo.projectInvestmentRegular || 0 }}
      <span>亿元</span>
      </p>
      </div>
      <div class="data-item">
      <p class="data-name">平台合伙人</p>
      <p class="data-num">
      {{ platformProjectInfo.partnerCount || 0 }} <span>人</span>
      </p>
      </div>
      </div>
      </template>
      </view>
      <view class="default-box my-earnings mb20" v-if="hasLogin">
      <view
      class="flex justify-between align-center"
      @click="showMyEarnings = !showMyEarnings"
      >
      <p class="tab-title">我的收益</p>
      <img
      class="icon-arrow"
      :class="{ rotate: showMyEarnings }"
      src="/static/img/icon-arrow.png"
      alt=""
      />
      </view>
      <div class="my-earnings-content" :class="{ h83: showMyEarnings }">
      <u-line color="#E6E6E6"></u-line>
      <div class="flex justify-center align-center">
      <div class="data-item red">
      <p class="data-name">可提现佣金</p>
      <p class="data-num">
      {{ myIncomeInfo.withdrawnCommission || 0 }} <span>万元</span>
      </p>
      </div>
      <u-line color="#E6E6E6" direction="col" length="116rpx"></u-line>
      <div class="data-item">
      <p class="data-name">已提现佣金</p>
      <p class="data-num">
      {{ myIncomeInfo.alrealyWithdrawnCommission || 0 }}
      <span>万元</span>
      </p>
      </div>
      </div>
      </div>
      </view>
      <login-bar></login-bar>
      </template>
      <template v-else>
      <div style="position: fixed;top: 0;bottom: 0;width: 100vw;overflow: hidden;">
      <image src="https://cfld-obs-pro01.obs.cn-north-4.myhuaweicloud.com/img/system/bg-home.png" style="width: 100vw;" mode="widthFix"></image>
      <image src="/static/img/home-btn.png" @click="toLogin" style="width: 365rpx;position: fixed;bottom: 100rpx;left: 50%;margin-left: -183rpx;" mode="widthFix"></image>
      </div>
      </template>
      </div>
      </div>
      <div>投资舒城</div>
      </template>
      \ No newline at end of file
      <script>
      import API from "@/api/url/index";
      import store from "@/store";
      import loginBar from "@/components/login-bar";
      import { mapMutations } from "vuex";
      export default {
      components: { loginBar },
      data() {
      return {
      inputVal: "",
      swiperList: [], //轮播图
      activeTab: "my",
      showMyEarnings: false,
      todoCount: 0,
      myProjectInfo: {}, // 我的项目
      platformProjectInfo: {}, // 平台项目
      myIncomeInfo: {}, // 我的收益
      loadingOff: false
      };
      },
      onShow() {
      this.getInfo();
      setTimeout(() => {
      this.loadingOff = true
      },100)
      },
      onShareAppMessage: function () {},
      methods: {
      ...mapMutations(["setTabIndex"]),
      getInfo() {
      this.$fetch({
      url: API.homePageInfo,
      success: (res) => {
      console.log(res);
      this.todoCount = res.todoCount;
      this.swiperList = res.partnerImageSourceList;
      this.myIncomeInfo = res.personalIncomeInfoVO;
      this.myProjectInfo = res.personalStatisticsVO;
      this.platformProjectInfo = res.platformProjectStatisticsVO;
      },
      });
      },
      navTo(type) {
      if (!this.hasLogin) {
      uni.navigateTo({
      url: "/pages/login/index",
      });
      return;
      }
      const _self = this;
      if (type == "myProject") {
      uni.switchTab(
      {
      url: "/pages/project/index",
      success: () => {
      _self.setTabIndex(0);
      },
      },
      true
      );
      return;
      }
      if (type == "toast") {
      uni.showToast({
      title: "暂无可提取佣金",
      duration: 2000,
      icon: "none",
      });
      return;
      }
      if (type == "todo") {
      uni.navigateTo({
      url: "/pages/todoList/todoList",
      });
      }
      if (type == "official") {
      wx.openChannelsUserProfile({
      finderUserName: "sphbqGlty4Efb3U",
      success: (res) => {},
      fail: (err) => {
      console.log("fail", err);
      uni.showToast({
      title: "该功能暂未开放",
      icon: "error",
      duration: 2000,
      });
      },
      });
      }
      },
      jump (index) {
      if (index === 0) {
      uni.navigateTo({
      url: "/pages/webview/index?url=https://mp.weixin.qq.com/s/KNOaeuRjksUSCr7W5dOJtw",
      });
      }
      },
      toLogin() {
      uni.navigateTo({
      url: "/pages/login/index",
      });
      },
      },
      computed: {
      hasLogin() {
      return store.state.hasLogin;
      },
      userInfo() {
      return store.state.userInfo;
      },
      },
      watch: {
      userInfo: {
      handler: function () {
      this.getInfo();
      },
      },
      hasLogin: {
      handler: function (val) {
      this.loadingOff = false
      if (!val) {
      this.activeTab = "all";
      } else {
      this.activeTab = "my";
      }
      },
      immediate: true,
      },
      },
      };
      </script>
      <style lang="less" scoped>
      .container {
      padding-bottom: 30rpx;
      }
      .swiper {
      height: 436rpx;
      }
      .swiper-item {
      display: block;
      height: 436rpx;
      width: 100%;
      }
      .data-view {
      padding: 15rpx 29rpx 0;
      }
      .tab-title {
      color: #b3b3b3;
      font-size: 30rpx;
      line-height: 56rpx;
      font-weight: 600;
      width: 180rpx;
      text-align: center;
      &.active {
      color: #333333;
      }
      }
      .line {
      border-right: 2rpx solid #b3b3b3;
      height: 30rpx;
      }
      .data-name {
      color: #004386;
      font-size: 20rpx;
      line-height: 28rpx;
      font-weight: 600;
      background: #eaf0fc;
      border-radius: 4rpx;
      padding: 8rpx 15rpx;
      display: inline-block;
      margin-bottom: 8rpx;
      }
      .red {
      .data-name {
      background: #fcedea;
      color: #bf0008;
      }
      .data-num {
      color: #bf0008;
      span {
      color: #333;
      }
      }
      }
      .data-item {
      width: 324rpx;
      height: 164rpx;
      margin-left: 0;
      margin-right: 0;
      text-align: center;
      padding-top: 20rpx;
      box-sizing: border-box;
      }
      .data-num {
      font-size: 65rpx;
      color: #333;
      font-weight: 600;
      display: flex;
      align-items: flex-end;
      line-height: 76rpx;
      justify-content: center;
      span {
      font-weight: 500;
      font-size: 20rpx;
      margin-left: 20rpx;
      line-height: 28rpx;
      padding-bottom: 15rpx;
      }
      }
      .navigation-section {
      margin-top: 10rpx;
      justify-content: center;
      }
      .nav-box {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 174rpx;
      height: 179rpx;
      }
      .nav-icon {
      width: 100rpx;
      height: 100rpx;
      }
      .nav-text {
      font-size: 24rpx;
      color: #333;
      font-weight: 800;
      margin-top: 5rpx;
      }
      .mb20 {
      margin-bottom: 20rpx;
      }
      .my-earnings {
      padding: 20rpx 29rpx;
      .tab-title {
      line-height: 42rpx;
      color: #333;
      }
      }
      .icon-arrow {
      width: 56rpx;
      height: 56rpx;
      transition: transform 0.3s;
      }
      .rotate {
      transform: rotate(-180deg);
      }
      .my-earnings-content {
      height: 0;
      transition: height 0.3s;
      overflow: hidden;
      }
      .h83 {
      height: 166rpx;
      }
      .rel {
      position: relative;
      }
      </style>
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment