xnzt/xnzt-h5/pages/mine/businessesEntity/index.vue

<template>
  <!-- <div class="businesses-entity">businesses-entity</div> -->
  <view class="page">
    <view class="page-head">
      <view class="infoBody">
        <view class="wxInfoRow">
          <view class="entityInfo">
            <view class="via">
              <view style="
                  position: absolute;
                  width: 100%;
                  height: 100%;
                  opacity: 20%;
                ">
                <image :src="entityInfo.round" style="
                    left: 0px;
                    position: absolute;
                    width: 100%;
                    height: 100%;
                  " />
                <view style="
                    width: 80%;
                    height: 80%;
                    background-color: #2c2c2c;
                    align-self: center;
                    border-radius: 50%;
                    display: inline-block;
                    transform: translate(0.5%, 13%);
                  " />
              </view>
              <image :src="entityInfo.img" style="width: 70%; height: 70%; transform: translate(23%, 15%)" />
            </view>
            <view v-if="!haveEnterprise">
              <navigator :url="!checkRole(['admin']) && checkRole(['enterprise'])
                  ? '/pages/formPages/enterprise/baseInfo/index'
                  : '#'
                " class="navigator-text create-entity baseInfo-text" @click="navigator()">
                <view>创建主体</view>
              </navigator>
              <navigator :url="!checkRole(['admin']) && checkRole(['enterprise'])
                  ? '/pages/formPages/enterprise/baseInfo/index'
                  : '#'
                " class="navigator-arrow" @click="navigator()"></navigator>
            </view>
            <view class="baseInfo-text" v-else>{{ baseInfo.fullName }}</view>
          </view>
          <view v-if="false" class="spotting">
            <navigator url="/packageInfo/pages/integral.page/integral.page/integral.page" class="integral">
              <image :src="integral.img" />
              <view class="navigator-text">积分</view>
            </navigator>
          </view>
        </view>
      </view>
    </view>
    <view class="page-body">
      <template v-for="(item, index) in navigatorList">
        <navigator class="navi-list" wx:for-index="index" wx:for-item="item" :url="'/' + item.url" :key="index"
          v-if="item.isShow === true">
          <navigator :url="'#'" class="navigator-text">{{
            item.label
          }}</navigator>
          <navigator :url="'#'" class="navigator-arrow"></navigator>
        </navigator>
      </template>
    </view>
  </view>
</template>

<script>
import { selectBaseInfo } from "@/api/enterprise/baseInfo";
import { selectUserEntity } from "@/api/enterprise/userEntity";
import { checkPermi, checkRole } from "@/utils/permission";
export default {
  name: "businesses-entity",
  components: {},
  props: {},
  data() {
    return {
      haveEnterprise: false,
      baseInfo: {},
      entityInfo: {
        img: "../../../static/images/mine/xxlAuF.png",
        round: "../../../static/images/mine/xxWhzq.png",
      },
      integral: {
        id: "integral",
        name: "积分",
        page: "integral",
        img: "../../../static/images/mine/xxlC90.png",
      },
      navigatorList: [
        {
          label: "主体信息",
          name: "baseInfo",
          url: "pages/mine/businessesEntity/baseInfo/index",
          isShow: true
        },
        {
          label: "经营业务",
          name: "activity",
          url: "/packageInfo/pages/businesses-entity/activity/activity",
        },
        {
          label: "直报信息",
          name: "dirRepInfo",
          url: "pages/accounts/dirRepInfo/index",
          isShow: true
        },
      ],
    };
  },
  computed: {},
  methods: {
    checkRole,
    navigator() {
      if (this.$auth.hasRole("admin") || !this.$auth.hasRole("enterprise")) {
        this.$modal.confirm("非主体用户无法拥有主体！").then(() => { });
      }
    },
    getEnterprise() {
      selectUserEntity().then((response) => {
        this.options = response.data;
        if (response.data.length !== 0) {
          this.haveEnterprise = true;
        } else {
          this.haveEnterprise = false;
        }
      });
    },
    getBaseInfo() {
      selectBaseInfo().then((response) => {
        this.baseInfo = response.data;
      });
    },
  },
  watch: {
    haveEnterprise: {
      handler: function (val, oldVal) {
        if (this.haveEnterprise === true) {
          this.getBaseInfo();
        }
      },
      deep: true,
    },
  },
  onShow() {
    this.getEnterprise();
  },
};
</script>

<style lang="scss" scoped>
@import url("@/static/scss/infoBody.scss");

.page-head {
  background-position-x: center;
  background-position-y: top;
  background-size: 100% auto;
  width: 100%;
  height: 8%;
  padding: 10% 0px 10% 0px;
  position: relative;
}

.page-body {
  min-height: 50%;
  position: relative;
  width: 100vw;
}

.entityInfo>view>.navigator-arrow:after {
  // margin-top: -5px;
  left: 0px;
}

.wxInfoRow .navigator-text {
  padding: 0px;
}

.navi-list {
  width: 100%;
  line-height: 80px;
  display: inline-block;
  margin-top: 10px;
  background-color: white;
  color: #666;
}

.navigator-text {
  padding-left: 20px;
}

.navigator-arrow::after {
  margin-top: -45px;
}
</style>