settle_down_wx/pages/index/index.vue

<template>
  <view>
    <div class="managementBody" v-show="userType == 2">
      <image
        src="https://www.idea-co-sf.com/gardenProduct/image/banner.png"
        class="banner"
      ></image>
      <div class="needBox" v-if="false">
        <div
          class="needLeft"
          @click="toMsgPage('/pages/subPackages/todo/index')"
        >
          <div class="needLeftLeft">
            <span style="color: #18172a; font-size: 4.5vw; margin-bottom: 1vw"
              >我的待办</span
            >
            <span style="color: #666666; font-size: 3.5vw"
              >需处理待办<span
                style="color: #0365f9; font-weight: 600; margin-left: 0.5vw"
                >{{ handleSize }}</span
              ></span
            >
          </div>
          <img
            src="https://www.idea-co-sf.com/gardenProduct/image/dbImage.png"
            class="needImg"
          />
        </div>
        <div
          class="needRight"
          @tap.stop="toMsgPage('/pages/subPackages/toread/index')"
        >
          <div class="needLeftLeft">
            <span style="color: #18172a; font-size: 4.5vw; margin-bottom: 1vw"
              >我的待阅</span
            >
            <span style="color: #666666; font-size: 3.5vw"
              >需处理待阅<span
                style="color: #22b565; font-weight: 600; margin-left: 0.5vw"
                >{{ readSize }}</span
              ></span
            >
          </div>
          <img
            src="https://www.idea-co-sf.com/gardenProduct/image/dyImage.png"
            class="needImg"
          />
        </div>
      </div>
      <div class="titleTips">
        <div class="myLine"></div>
        <div>服务入口</div>
      </div>
      <div class="map">
        <div
          class="mapdom"
          style="float: left"
          v-for="(item, index) in mapList"
          :key="index"
          @click="jumpPage(item.path)"
        >
          <img class="mapIcon" :src="item.url" />
          <div class="maptxt">{{ item.label }}</div>
        </div>
      </div>
    </div>
    <!--    企业端页面-->
    <div class="enterpriseBody" v-show="userType == 1 || userType == 3">
      <enterprise-side></enterprise-side>
    </div>
  </view>
</template>
<script>
// import {demo} from "@/js_sdk/http"
import {
  getUserPower,
  getUserLocalStorageInfo,
  getReadSizeByTypes,
} from "@/js_sdk/http";
import EnterpriseSide from "./components/enterpriseSide.vue";
import { getHandleSizeTypes } from "../../js_sdk/http";
export default {
  components: { EnterpriseSide },
  data() {
    return {
      readSize: 0,
      handleSize: 0,
      userType: 2,
      mapList: [
        {
          label: "房源查看",
          url: "https://www.idea-co-sf.com/gardenProduct/image/fjgl.png",
          path: "/pages/subPackages/propertyManagement/maintenance",
        },
        {
          label: "选房及意向金",
          url: "https://www.idea-co-sf.com/gardenProduct/image/zsgl.png",
          path: "/pages/subPackages/chooseHouse/index",
        },
        {
          label: "意向金管理",
          url: "https://www.idea-co-sf.com/gardenProduct/image/zsgl.png",
          path: "/pages/subPackages/yxjlist/index",
        },
        {
          label: "定金管理",
          url: "https://www.idea-co-sf.com/gardenProduct/image/zsgl.png",
          path: "/pages/subPackages/djlist/index",
        },
      ],
    };
  },
  onShareAppMessage() {},
  mounted() {
    // demo();
  },
  onShow() {
    // this.getUserPower();
    // this.getReadSize();
    // this.getHandleSize();
  },
  onLoad(e) {
    // uni.$on("userType", (userType) => {
    //   if (userType === "OK") {
    //     this.userType = !this.userType;
    //   }
    // });
  },
  methods: {
    getReadSize() {
      const data = {
        userId: getUserLocalStorageInfo().userId,
        types: "1",
      };
      getReadSizeByTypes(data).then((res) => {
        this.readSize = res;
      });
    },
    getHandleSize() {
      const data = {
        userId: getUserLocalStorageInfo().userId,
        types: "0,1,8,9,10,11",
      };
      getHandleSizeTypes(data).then((res) => {
        this.handleSize = res;
      });
    },
    toMsgPage(e) {
      uni.navigateTo({
        url: e,
        fail: (fail) => {},
      });
    },
    // getUserLocalStorageInfo
    async getUserPower() {
      let that = this;
      console.log("getUserLocalStorageInfo", getUserLocalStorageInfo());
      that.userType = getUserLocalStorageInfo().userType;
      if (that.userType == 3) {
        uni.showModal({
          title: "提示",
          cancelText: "暂不",
          confirmText: "去切换",
          content: "您还不是企业用户，请切换登录身份后再进行相关操作。",
          success: function (res) {
            if (res.confirm) {
              uni.navigateTo({
                url: "/pages/login2/login",
                success: function (e) {
                  // uni.$emit('userType', 'OK')
                },
              });
            } else if (res.cancel) {
              console.log("用户点击取消");
            }
          },
        });
      }
      // if (getUserLocalStorageInfo().user.id == 1) return;

      // let newList = [];
      // let { data } = await getUserPower(getUserLocalStorageInfo().user.id);
      // for (let i = 0; i < that.mapList.length; i++) {
      //   let index = data.findIndex((e) => e == that.mapList[i].label);
      //   if (index != -1) {
      //     newList.push(that.mapList[i]);
      //   }
      // }
      // that.mapList = newList;
    },
    jumpPage(path) {
      uni.navigateTo({
        url: path,
        fail: (fail) => {},
      });
    },
  },
};
</script>

<style lang="scss">
page {
  background: white;
}
.managementBody {
  padding: 4vw;
}
.banner {
  width: 92vw;
  height: 250rpx;
  //position: absolute;
  z-index: 1;
}
.mapdom {
  width: 25%;
  height: 184rpx;
}
.maptxt {
  width: 100%;
  height: 34rpx;
  font-size: 24rpx;
  font-family: PingFang SC-Medium, PingFang SC;
  font-weight: 500;
  color: #18172a;
  text-align: center;
  margin-top: 8rpx;
}
.mapIcon {
  width: 65rpx;
  height: 80rpx;
  //background: linear-gradient(141deg, #89BCFF 0%, #2782FA 100%);
  display: block;
  margin: auto;
}
.map {
  //position: absolute;
  z-index: 2;
  width: calc(100% - 24rpx);
  //height: 770rpx;
  border-radius: 48rpx 48rpx 0rpx 0rpx;
  background: white;
  //margin-top: 402rpx;
  padding: 24rpx 12rpx;
  overflow-y: auto;
}
.needBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 2vw 0;
  .needLeft {
    display: flex;
    justify-content: space-around;
    background: rgba(238, 244, 255, 1);
    border-radius: 8rpx;
    align-items: center;
    width: 45vw;
    height: 23vw;
  }
  .needRight {
    display: flex;
    justify-content: space-around;
    background: #def6f8;
    border-radius: 8rpx;
    align-items: center;
    width: 45vw;
    height: 23vw;
  }
  .needLeftLeft {
    display: flex;
    flex-direction: column;
  }
  .needImg {
    width: 100rpx;
    height: 100rpx;
  }
}
.titleTips {
  display: flex;
  align-items: center;
  font-size: 4.7vw;
  font-weight: 600;
  color: #18172a;
  margin: 4vw 0 2vw 0;
  .myLine {
    width: 13rpx;
    height: 40rpx;
    background: linear-gradient(180deg, #509fff 0%, #034df7 100%);
    margin-right: 20rpx;
  }
}
</style>