yunshengtai-uniapp/pages/user/index.vue

<template>
<view class="home-page">
  <view class="page-top-box">
    <image src="/static/images/home/top-bg.png" class="top-bg"></image>
    <view class="page-title" :style="'top:' + menuTop + 'px;height:' + menuHeight + 'px;line-height: ' + menuHeight + 'px;'">禅易云生态</view>
    <view class="top-box-content" :style="'top: ' + (CustomBar + 10) + 'rpx;'">
      <view class="top-set-box acea-row row-between row-middle">
        <view class="set-box-l" v-if="authType == 1 || authType == 2" @tap="toAuthInfo">{{authType == 1 ? '企业' : '个人'}}中心</view>
        <view v-else></view>
        <view class="set-box-r acea-row">
          <!-- <image src="../../images/user/set-icon.png" class="setIcon"></image> -->
          <!-- <image src="../../images/user/message-icon.png" class="message"></image> -->
        </view>
      </view>
      <view class="userInfo-box acea-row row-middle">
        <image :src="userInfo.avatar || '/static/images/user/header.png'" class="header-img"></image>
        <view class="userInfo-r">
          <view class="name-box acea-row-nowrap row-middle">
            <view class="name line1">{{userInfo.nickname || '微信用户'}}</view>
            <image src="/static/images/user/tyg-tag.png" class="tyg-tag" v-if="userInfo.isVip"></image>
          </view>
          <view class="auth-tips acea-row row-middle">
            <text v-if="authStatus == 0" @tap="toAuth">完成信息认证，享受更多服务，去认证</text>
            <text v-if="authStatus == 1">信息认证审核中</text>
            <text v-if="authStatus == 2">已完成信息认证</text>
            <text v-if="authStatus == 3" @tap="toAuth">认证失败，重新认证</text>
            <image src="/static/images/back.png" v-if="authStatus == 0 || authStatus == 3"></image>
          </view>
          <!-- <view class="img-tags acea-row row-middle">
            <view class="level">{{userInfo.levelName || '普通会员'}}</view>
            <image src="../../images/user/tyg-tag.png" class="tyg-tag" wx:if="{{userInfo.isRecharge}}"></image>
          </view> -->
        </view>
      </view>
      <view class="my-reminds-box acea-row row-around ">
        <view class="remind-item" @tap="toResourcesOrder">
          <view class="count">{{demandCounts}}</view>
          <view>资源订单</view>
        </view>
        <!-- <view class="remind-item">
          <view class="count">0</view>
          <view>我的审核</view>
        </view> -->
        <view class="remind-item" @tap="toNeedsOrder">
          <view class="count">{{supplyCounts}}</view>
          <view>需求订单</view>
        </view>
      </view>
      <view class="to-tyg-box" @tap="toMine">
        <image src="/static/images/user/tyg-img.png"></image>
      </view>
    </view>
  </view>
  <view class="menu-list-box">
    <!-- 需求管理 -->
    <view class="needs-menu-list">
      <view class="title-box acea-row row-between-wrapper">
        <view>需求管理</view>
        <!-- <view class="acea-row row-middle seemore">
          <text>查看全部</text> 
          <image src="../../images/user/arror-r.png"></image>
        </view> -->
      </view>
      <view class="menu-list acea-row row-between">
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toNeedsManage" data-type="1">
          <image src="/static/images/user/xuqiu1.png"></image>
          <text>发布中</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toNeedsManage" data-type="2">
          <image src="/static/images/user/xuqiu2.png"></image>
          <text>审核中</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toNeedsManage" data-type="3">
          <image src="/static/images/user/xuqiu3.png"></image>
          <text>草稿箱</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toNeedsManage" data-type="4">
          <image src="/static/images/user/xuqiu4.png"></image>
          <text>已结束</text>
        </view>
      </view>
      <view class="torelease-img" @tap="toRelease(1)">
        <image src="/static/images/user/fbxq.png"></image>
        <view class="to-btn">发布需求</view>
      </view>
    </view>
    <!-- 资源管理 -->
    <view class="needs-menu-list">
      <view class="title-box acea-row row-between-wrapper">
        <view>资源管理</view>
      </view>
      <view class="menu-list acea-row row-between">
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toResourcesManage" data-type="1">
          <image src="/static/images/user/xuqiu1.png"></image>
          <text>发布中</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toResourcesManage" data-type="2">
          <image src="/static/images/user/xuqiu2.png"></image>
          <text>审核中</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toResourcesManage" data-type="3">
          <image src="/static/images/user/xuqiu3.png"></image>
          <text>草稿箱</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper" @tap="toResourcesManage" data-type="4">
          <image src="/static/images/user/xuqiu4.png"></image>
          <text>已结束</text>
        </view>
      </view>
      <view class="torelease-img" @tap="toRelease(0)">
        <image src="/static/images/user/fbzy.png"></image>
        <view class="to-btn">发布需求</view>
      </view>
    </view>
		<view class="add-service" @click="$yrouter.push({path: '/pages/user/addServiceCode/index'})">
			<image src="https://download.cyjyyjy.com/addservice2.png"></image>
		</view>
		<!-- 电商管理 -->
		<view class="needs-menu-list">
			<view class="mask-box" v-if="userInfo.isVip == false"  @tap="toMine">
				<text>成为首席体验官，立即开店！</text>
			</view>
		  <view class="title-box acea-row row-between-wrapper">
		    <view>电商管理</view>
		  </view>
		  <view class="menu-list acea-row row-between">
		    <view class="menu-item acea-row row-column row-center-wrapper" @tap="toReleaseGoods">
		      <image src="/static/images/user/fuwu2.png"></image>
		      <text>发布商品</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" @tap="toGoodsManage">
		      <image src="/static/images/user/fuwu7.png"></image>
		      <text>商品管理</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" @tap="toOrderManage">
		      <image src="/static/images/user/fuwu3.png"></image>
		      <text>商家订单</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" v-if="userInfo.store == null" @tap="toOpenShop">
		      <image src="/static/images/user/fuwu6.png"></image>
		      <text>我要开店</text>
		    </view>
				<view class="menu-item acea-row row-column row-center-wrapper" v-if="userInfo.store !== null" @tap="toMyShop">
				  <image src="/static/images/user/fuwu6.png"></image>
				  <text>我的店铺</text>
				</view>
		  </view>
		</view>
		<!-- 我的订单 -->
		<view class="needs-menu-list myorder-menu-list">
		  <view class="title-box acea-row row-between-wrapper">
		    <view>我的订单</view>
		  </view>
		  <view class="menu-list acea-row row-between">
		    <view class="menu-item acea-row row-column row-center-wrapper" @click="goMyOrder(0)">
		      <image src="/static/images/user/fuwu2.png"></image>
		      <text>待付款</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" @click="goMyOrder(1)">
		      <image src="/static/images/user/fuwu7.png"></image>
		      <text>待发货</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" @click="goMyOrder(2)">
		      <image src="/static/images/user/fuwu3.png"></image>
		      <text>待收货</text>
		    </view>
		    <view class="menu-item acea-row row-column row-center-wrapper" @click="goMyOrder(3)">
		      <image src="/static/images/user/fuwu6.png"></image>
		      <text>待评价</text>
		    </view>
				<view class="menu-item acea-row row-column row-center-wrapper" @click="goReturnList">
				  <image src="/static/images/user/fuwu6.png"></image>
				  <text>售后/退款</text>
				</view>
		  </view>
		</view>
    <!-- 常用服务 -->
    <view class="needs-menu-list">
      <view class="title-box acea-row row-between-wrapper">
        <view>常用服务</view>
      </view>
      <view class="menu-list acea-row row-between">
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="/static/images/user/fuwu2.png"></image>
          <text>预存款项</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="/static/images/user/fuwu7.png"></image>
          <text>意见反馈</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="/static/images/user/fuwu3.png"></image>
          <text>联系客服</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="/static/images/user/fuwu6.png"></image>
          <text>招商活动</text>
        </view>
        <!-- <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="../../images/user/fuwu1.png"></image>
          <text>会员中心</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="../../images/user/fuwu4.png"></image>
          <text>举报通道</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="../../images/user/fuwu5.png"></image>
          <text>生活中心</text>
        </view>
        <view class="menu-item acea-row row-column row-center-wrapper">
          <image src="../../images/user/fuwu8.png"></image>
          <text>举报通道</text>
        </view> -->
      </view>
    </view>
  </view>
  <tabbar :current="currentTabIndex" tabBarClick="click"></tabbar>
</view>
</template>

<script>
// pages/life/index.js
const app = getApp();
import tabbar from "../../tabbarComponent/tabbar";

export default {
  data() {
    return {
      tabbar: {},
      userInfo: {},
      CustomBar: app.globalData.CustomBar,
      menuHeight: app.globalData.menuHeight,
      navHeight: app.globalData.navHeight,
      menuTop: app.globalData.menuTop,
      demandCounts: 0,
      supplyCounts: 0,
      authStatus: 0,
      authType: 0,
      completeState: "",
			currentTabIndex: 4
    };
  },

  components: {
    tabbar
  },
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // app.globalData.editTabbar();
		this.getInfo();
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },
	onPullDownRefresh() {
		this.getInfo()
	},
  methods: {
		
		tabBarClick(index){
			this.currentTabIndex = index
		},
    getInfo() {
      app.http('get', 'userinfo').then(res => {
        if (res.data.success) {
          this.setData({
            userInfo: res.data.data
          });
					uni.setStorageSync('userInfo',res.data.data)
          this.getOrderCount();
          this.isAuthentication();
          uni.stopPullDownRefresh();
        }
      });
    },

    isAuthentication() {
      app.http('get', 'user/isAuthentication').then(res => {
        if (res.data.success) {
          this.setData({
            authStatus: res.data.data.authenticationState,
            authType: res.data.data.authorizationType,
            completeState: res.data.data.completeState
          });
        }
      });
    },
		toRelease(type){
			uni.navigateTo({
			  url: '/pages/release/index'
			})
		},
    toAuthInfo() {
      let type = this.authType;

      if (type == 1) {
        uni.navigateTo({
          url: '/pages/release/perfectCompanyInfo/index?isEdit=' + 1
        });
      } else {
        uni.navigateTo({
          url: '/pages/release/perfectPersonInfo/index?isEdit=' + 1
        });
      }
    },

    toAuth() {
      uni.navigateTo({
        url: '/pages/release/index'
      });
    },

    getOrderCount() {
      app.http('GET', 'Communicate/getOrderCounts').then(res => {
        if (res.data.success) {
          this.setData({
            demandCounts: res.data.data.demandCounts,
            supplyCounts: res.data.data.supplyCounts
          });
        }
      });
    },

    // 跳转首席体验官
    toMine() {
      if (this.userInfo.isVip) {
        uni.navigateTo({
          url: '/pages/user/mine/index'
        });
      } else {
        uni.navigateTo({
          url: '/pages/user/agreement/index'
        });
      }
    },

    //跳转资源订单
    toResourcesOrder() {
      uni.navigateTo({
        url: '/pages/user/resourcesOrder/index'
      });
    },

    //跳转需求订单
    toNeedsOrder() {
      uni.navigateTo({
        url: '/pages/user/needsOrder/index'
      });
    },

    //跳转需求管理
    toNeedsManage(e) {
      let type = e.currentTarget.dataset.type;
      uni.navigateTo({
        url: '/pages/user/needsManage/index?type=' + type
      });
    },

    //跳转资源管理
    toResourcesManage(e) {
      let type = e.currentTarget.dataset.type;
      uni.navigateTo({
        url: '/pages/user/resourcesManage/index?type=' + type
      });
    },
		//跳转我的订单
    goMyOrder(type) {
      this.$yrouter.push({
        path: '/pages/order/MyOrder/index',
        query: {
          type,
        },
      })
    },
		//发布商品
		toReleaseGoods(){
			if(this.userInfo.store !== null){
				this.$yrouter.push({
				  path: '/pages/life/addGoods/index'
				})
			} else{
				uni.showToast({
					title: '请先点最右边按钮去开店！',
					icon: 'none',
					duration: 2000
				})
			}
		},
		//跳转到退款售后订单
		goReturnList() {
			if(this.userInfo.store !== null){
				this.$yrouter.push('/pages/order/ReturnList/index')
			} else{
				uni.showToast({
					title: '请先点最右边按钮去开店！',
					icon: 'none',
					duration: 2000
				})
			}
		},
		toGoodsManage(){
			if(this.userInfo.store !== null){
				this.$yrouter.push('/pages/user/goodsManage/index')
			} else{
				uni.showToast({
					title: '请先点最右边按钮去开店！',
					icon: 'none',
					duration: 2000
				})
			}
		},
		toOrderManage(){
			this.$yrouter.push('/pages/user/orderManage/index')
		},
		toOpenShop(){
			this.$yrouter.push('/pages/user/openStore/index')
		},
		toMyShop(){
			this.$yrouter.push('/pages/user/myShop/index')
		},
  }
};
</script>
<style lang="less">
.home-page{
  min-height: 100vh;
  padding-bottom: 130rpx;
  background: #F3F3F3;
}
.page-top-box{
  width: 100%;
  height: 575rpx;
  position: relative;
}
.page-title{
  width: 100%;
  color: #fff;
  text-align: center;
  position: relative;
}
.top-bg{
  width: 100%;
  height: 598rpx;
  position: absolute;
}
.top-box-content{
  position: relative;
  padding: 0 40rpx;
  color: #fff;
}
.top-set-box{

}
.top-set-box .setIcon{
  width: 32rpx;
  height: 29rpx;
}
.top-set-box .message{
  width: 38rpx;
  height: 29rpx;
  margin-left: 34rpx;
}
.set-box-l{
  width: 160rpx;
  height: 44rpx;
  line-height: 44rpx;
  text-align: center;
  background: #FFA583;
  border-radius: 22rpx;
  font-size: 24rpx;
}
.userInfo-box{
  margin-top: 34rpx;
}
.userInfo-box .header-img{
  width: 120rpx;
  height: 120rpx;
  border-radius: 50%;
  margin-right: 12rpx;
}
.userInfo-r{
  width: calc(100% - 134rpx);
}
.userInfo-r .name{
  width: auto;
  font-size: 36rpx;
}
.level{
  padding: 2rpx 20rpx;
  font-size: 24rpx;
  background: #FEC313;
  text-align: center;
  border-radius: 25px;
}
.img-tags {
  margin-top: 14rpx;
}
.userInfo-r image{
  width: 132rpx;
  height: 48rpx;
}
.userInfo-r .tyg-tag{
  width: 188rpx;
  height: 44rpx;
  margin-left: 22rpx;
}
.auth-tips{
  font-size: 26rpx;
  color: #fff;
  margin-top: 12rpx;
}
.auth-tips image{
  width: 28rpx;
  height: 28rpx;
  transform: rotate(180deg);
}

.my-reminds-box {
  margin-top: 20rpx;
}
.remind-item{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 28rpx;
}
.count{
  font-size: 36rpx;
}
.to-tyg-box{
  text-align: center;
  margin-top: 24rpx;
}
.to-tyg-box image{
  width: 670rpx;
  height: 114rpx;
}
.menu-list-box{
  width: 100%;
  padding: 40rpx;
}
.needs-menu-list,.resources-menu-list,.searver-menu-list{
  width: 100%;
  background: #fff;
  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.07);
  border-radius: 12rpx;
  margin-bottom: 32rpx;
	position: relative;
}
.needs-menu-list .mask-box{
	position: absolute;
	top: 0; bottom: 0;
	left: 0; right: 0;
	width: 100%;
	height: 100%;
	margin: auto;
	border-radius: 5px;
	background: rgba(255, 255, 255, .9);
	overflow: hidden;
	text{
		width: 100%;
		position: absolute;
		left: 50%;
		top: 50%;
		text-align: center;
		transform: translate(-50%,-50%);
		color: #FF6D31;
		font-size: 36rpx;
		font-weight: bold;
	}
}
.needs-menu-list .mask-box::before{
	content: '';
	position: absolute;
	top: 0; bottom: 0;
	left: 0; right: 0;
	filter: blur(20px);
	z-index: -1;
	margin: -30px;
}
.menu-list{
  width: 100%;
  padding: 40rpx 22rpx 22rpx; 
}
.menu-item{
  /* width: 100%; */
}
.title-box{
  width: 100%;
  padding: 16rpx 20rpx;
  border-bottom: 1px solid #F0F0F0;
  font-size: 28rpx;
  color: #303030;
}
.seemore{
  font-size: 24rpx;
  color: #BFBFBF;
}
.seemore image{
  width: 12rpx;
  height: 22rpx;
  margin-left: 10rpx;
}
.menu-item{
  width: 25%;
  margin-bottom: 32rpx;
  color: #4A4A4A;
  font-size: 24rpx;
  line-height: 34rpx;
}

.add-service{
	width: 100%;
	height: 144rpx;
	margin-bottom: 32rpx;
	image{
		width: 100%;
		height: 100%;
	}
}
.myorder-menu-list .menu-item{
	width: 20%;
}
.menu-item image{
  width: 48rpx;
  height: 48rpx;
  margin-bottom: 14rpx;
}
.torelease-img {
  position: relative;
  width: 100%;
  height: 90rpx;
}
.torelease-img image{
  width: 630rpx;
  height: 62rpx;
  position: absolute;
  left: 20rpx;
}
.to-btn{
  width: 118rpx;
  height: 34rpx;
  line-height: 34rpx;
  text-align: center;
  font-size: 20rpx;
  color: #ED7632;
  background: #FFFFFF;
  border-radius: 20rpx;
  position: absolute;
  right: 44rpx;
  top: 14rpx;
}
</style>