uniapp2/pages/setting/setting.vue

<template>
  <view class="setting-wrapper">
    <view class="top-banner justify-center align-center text-center">
      <view>
        <image width="130" src="../../static/personal-head.png"></image>
        <view class="userName">admin</view>
        <view>伍继智慧用电</view>
      </view>
    </view>
    <view class="cu-list menu-avatar">
      <view class="cu-item" @tap="goMessagePush()">
        <view
          class="cu-avatar"
          style="background-image: url(../../static/setting-icon1.png)"
        ></view>
        <view class="content">
          <view class="">消息推送设置</view>
        </view>
        <view class="nav-right">
          <view class="text-grey">
            <text class="icon iconfont margin-right-xs margin-left-lg"
              >&#xe629;</text
            >
          </view>
        </view>
      </view>

      <view class="cu-item" @tap="goSiteArchive()" v-if="permissionLabel != 4">
        <view
          class="cu-avatar"
          style="background-image: url(../../static/settingIconDa.png)"
        ></view>
        <view class="content">
          <view class="">现场档案</view>
        </view>
        <view class="nav-right">
          <view class="text-grey">
            <text class="icon iconfont margin-right-xs margin-left-lg"
              >&#xe629;</text
            >
          </view>
        </view>
      </view>

      <view class="cu-item" @tap="goSiteManage" v-if="permissionLabel == 1">
        <view
          class="cu-avatar"
          style="background-image: url(../../static/setting-icon2.png)"
        ></view>
        <view class="content">
          <view class="">站点管理</view>
        </view>
        <view class="nav-right">
          <view class="text-grey">
            <text class="icon iconfont margin-right-xs margin-left-lg"
              >&#xe629;</text
            >
          </view>
        </view>
      </view>
      <view class="cu-item" @tap="goAuthManage" v-if="permissionLabel == 1">
        <view
          class="cu-avatar"
          style="background-image: url(../../static/setting-icon4.png)"
        ></view>
        <view class="content">
          <view class="">权限管理</view>
        </view>
        <view class="nav-right">
          <view class="text-grey">
            <text class="icon iconfont margin-right-xs margin-left-lg"
              >&#xe629;</text
            >
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      permissionLabel: 0,
    };
  },
  onLoad() {
    this.getAuthorization();
  },
  methods: {
    async getAuthorization(params) {
      const res = await this.$myRequest({
        url: "Com/getAuthorization",
        showLoading: true,
        data: params,
      });

      console.log(res.data.permissionLabel);
      this.permissionLabel = res.data.permissionLabel;
    },

    goSiteArchive() {
      uni.navigateTo({
        url: "/pages/siteArchive/siteArchive",
      });
    },

    goSiteManage() {
      uni.navigateTo({
        url: "/pages/siteManage/siteManage?type=1",
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
    goDeviceManage() {
      uni.navigateTo({
        url: "/pages/siteManage/siteManage?type=2",
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
    goAuthManage() {
      uni.navigateTo({
        url: "/pages/authManage/authManage",
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
    goMessagePush() {
      // uni.showModal({
      // 	title: 'Tips',
      // 	content: '此模块开发中~',
      // 	showCancel: false,
      // 	success: function(res) {
      // 		if (res.confirm) {
      // 		} else if (res.cancel) {
      // 		}
      // 	}
      // });
      uni.navigateTo({
        url: "/pages/messagePush/messagePush",
        success: (res) => {},
        fail: () => {},
        complete: () => {},
      });
    },
  },
};
</script>

<style lang="scss">
.setting-wrapper {
  .top-banner {
    width: 100%;
    height: 380rpx;
    background: url(../../static/setting-bg.png) no-repeat;
    background-size: cover;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    image {
      width: 130rpx;
      height: 130rpx;
    }
    .userName {
      margin-top: 30rpx;
      margin-bottom: 10rpx;
    }
  }
  .cu-avatar {
    width: 40rpx;
    height: 40rpx;
    background-color: #fff;
  }
  .cu-list.menu-avatar > .cu-item {
    height: 120rpx;
    .content {
      left: 70rpx;
    }
    .nav-right {
      margin-right: 10rpx;
    }
  }
}
</style>