InspectionCleaning/pages/adminMy/index.vue

<template>
  <view class="content">
    <view class="content-title">我的</view>
    <view class="head">
      <view class="avatar-box">
        <u-avatar :src="'/static/images/avatar.png'" size="140" mode="circle" class="avatar"></u-avatar>
      </view>
      <view class="content-name">{{ userName }}</view>
    </view>
    <view class="cell-list-box">
      <view class="cell-list-item" v-for="item in cellList" @click="toPage(item.path, item)">
        <view class="cell-list-item-left">
          <image style="width: 60rpx; height: 60rpx" mode="aspectFit" :src="item.icon"></image>
          <text>{{ item.title }}</text>
        </view>

        <view class="cell-list-item-right">
          <text>{{ item.content }}</text>
          <!-- <u-icon v-else name="arrow-right" color="#a5a7ab" size="32"></u-icon> -->
        </view>
      </view>
    </view>
    <view class="empty-box"></view>
    <view class="cell-list-box2">
      <view class="cell-list-item" v-for="item in cellList2" @click="toPage(item.path, item)">
        <view class="cell-list-item-left">
          <image style="width: 60rpx; height: 60rpx" mode="aspectFit" :src="item.icon"></image>
          <text>{{ item.title }}</text>
        </view>

        <view class="cell-list-item-right">
          <u-icon name="arrow-right" color="#cccccc" size="32"></u-icon>
        </view>
      </view>
    </view>
    <u-tabbar :list="vuex_tabbar"></u-tabbar>
  </view>
</template>

<script>
import { GetUserDataApi } from "@/api/apiAdmin.js";
import {
  toast,
  clearStorageSync,
  setStorageSync,
  getStorageSync,
  useRouter,
} from "@/utils/utils.js";

export default {
  data() {
    return {
      form: {
        "id": "08dd80a7-f2fa-46df-8374-4e132418512e",
        "name": "计算机学院教学大楼12栋",
        "description": "12栋",
        "companyId": "4b2d9662-a768-08f2-a0c8-762b8c76da2a",
        "departmentId": "08dd6dcf-ffc9-4000-89b2-b53ea1d5acfb",
        "department": null,
        "userId": "21645b80-8aff-3cf2-b1f3-2ba9d485fecd",
        "areas": [],
        "createTime": "2025-04-21T15:41:36.897423",
        "isDeleted": false
      },
      // 用户姓名
      userName: '',
      // 人员类型
      userType: '',
      clickCount: 0, // 用于记录点击次数
      version: "",

      cellList: [
        {
          title: "性别",
          icon: "/static/adminImg/item1.png",
          path: "",
          content: "男",
        },
        {
          title: "人员类型",
          icon: "/static/adminImg/item2.png",
          path: "/pages/user/versionInfo/index",
          content: "区域管理员",
        },
        {
          title: "所属区域",
          icon: "/static/adminImg/item3.png",
          path: "",
          content: "区域111",
        },
      ],
      cellList2: [
        {
          title: "版本信息",
          icon: "/static/adminImg/item4.png",
          path: "/pages/user/versionInfo/index",
        },
        {
          title: "注销",
          icon: "/static/adminImg/item5.png",
          path: "",
        },
      ],
    };
  },
  onLoad() {
  },
  onShow() {
    this.getDataFn();
  },
  methods: {
    async getDataFn() {
      const res = await GetUserDataApi();
      console.log(res, "用户数据");
      Object.assign(this.form, res.data.userRegion);
      // 用户名称
      this.userName = res.data.userName
      // 人员类型
      this.userType = res.data.userType
      this.cellList[1].content = res.data.userType
      // 所属区域
      this.cellList[2].content = res.data.userRegion.name
    },
    handleClick() {
      this.clickCount++; // 每次点击增加点击次数
      if (this.clickCount === 6) {
        this.clickCount = 0; // 执行完函数后重置点击次数
        uni.navigateTo({
          url: "/pages/login/login",
        });
      }
    },
    toPage(path, item) {
      if (item.title === "注销") {
        uni.showModal({
          title: "提示",
          content: "确定注销吗？",
          showCancel: true,
          success: function (res) {
            if (!res.confirm) { return }
            console.log(res, 'res--')
            // 确定退出
            let u = navigator.userAgent;
            let isAndroid =
              u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android
            // let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios
            try {
              if (isAndroid && AndroidJs) {
                console.log("%c%s", "color:red", "安卓--调用返回方法");
                const reqRow = {
                  name: "logout",
                  data: "",
                };
                AndroidJs.func(JSON.stringify(reqRow)); // 给安卓传参
              } else {
                console.log("%c%s", "color:red", "苹果--调用返回方法");
                const reqRow = {
                  name: "back-iphone",
                  data: "",
                };
                window.webkit.messageHandlers.func.postMessage(
                  JSON.stringify(reqRow)
                ); // 给ios 传参
              }
            } catch (e) {
              console.log(e, "e-----判断安卓苹果类型出错");
            }
            return
          },
        });
        return;
      }
      if (!path) return;
      useRouter(path, {}, "navigateTo");
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  height: calc(100vh - 100rpx);

  // background: #f6f8fc;
  .content-title {
    background: #fff;
    text-align: center;
    padding-top: 40rpx;
    font-size: 30rpx;
    font-weight: bold;
  }

  .head {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 200rpx;
    padding: 70rpx 40rpx 32rpx;
    // background: linear-gradient(to bottom, #e5ebfd, #f6f8fc);
    background-color: #fff;

    .avatar-box {
      width: 140rpx;
      height: 140rpx;
      border-radius: 50%;
      position: relative;

      .avatar {
        width: 100%;
      }
    }
  }

  .content-name {
    margin-top: 20rpx;
    font-weight: bold;
  }

  .empty-box {
    height: 20rpx;
    background-color: #f6f8fc;
  }

  .cell-list-box {
    // margin-top: 20rpx;
    padding: 0 32rpx;
    background-color: #fff;

    .cell-list-item {
      border-bottom: 1px solid #f4f4f4;
      padding: 0 10rpx;
      height: 100rpx;
      display: flex;
      justify-content: space-between;
      align-items: center;

      &-left {
        display: flex;

        text {
          margin-left: 24rpx;
          align-self: center;
        }
      }

      &-right {
        color: #999;
      }
    }
  }

  .cell-list-box2 {
    margin-top: 20rpx;
    padding: 0 32rpx;
    background-color: #fff;

    .cell-list-item {
      border-bottom: 1px solid #f4f4f4;
      padding: 0 10rpx;
      height: 100rpx;
      display: flex;
      justify-content: space-between;
      align-items: center;

      &-left {
        display: flex;

        text {
          margin-left: 24rpx;
          align-self: center;
        }
      }
    }
  }
}
</style>