罗广辉
2026-06-18 44dd9c4eb8a2489c63a5eb53fd4254bbb3510e95
src/pages/user/index.vue
@@ -1,68 +1,231 @@
<!-- 我的 -->
<template>
  <view class="page-wrap">
    <u-navbar title="" placeholder left-icon="" right-icon="camera-fill"/>
    <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
      <view class="mr-10rpx">
        <u-avatar src="/static/images/logo.png" size="70"/>
      </view>
      <view class="flex-1">
        <view class="pb-20rpx text-36rpx">{{ userStore?.userInfo?.nick_name }}</view>
        <view class="u-tips-color text-28rpx" @click="toCopy">
          ID:{{ userStore?.userInfo?.user_id }}
    <view class="userBox">
      <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx">
        <view class="mr-20rpx">
          <u-avatar :src="user.avatar" size="70" />
        </view>
        <view class="flex-1">
          <view class="userName">{{ userStore?.userInfo?.nick_name }}</view>
          <view class="departs">
            <image
              src="https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/mobile.png"
              alt=""
            />
            <span>{{ user.deptName }}</span>
          </view>
        </view>
        <view class="rightLogo">
          <image
            src="https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/logo2.png"
            alt=""
          />
        </view>
      </view>
      <view class="ml-10rpx p-10rpx">
        <u-icon name="scan" color="#969799"/>
      <view class="personalInformation">
        <div class="message">
          <div class="messagebox">个人信息</div>
          <div class="editInfo" @click="handelEdit(1)">
            点击编辑
            <image :src="rightImage" alt="" />
          </div>
        </div>
        <div class="passwordBox">
          <div class="messagebox">修改密码</div>
          <div class="editInfo" @click="handelEdit(2)">
            点击编辑
            <image :src="rightImage" alt="" />
          </div>
        </div>
      </view>
      <view class="ml-10rpx p-10rpx">
        <u-icon name="arrow-right" color="#969799"/>
      </view>
    </view>
    <view class="mt-20rpx">
      <u-cell-group>
        <u-cell icon="setting" title="退出登录" is-link @click="logOut"/>
      </u-cell-group>
      <view class="mt-20rpx">
        <div class="goOutStyle" @click="logOut">退出登录</div>
      </view>
      <div class="bottomLogo">
        <image :src="logoImage" alt="" />
      </div>
    </view>
  </view>
</template>
<script setup>
import {useClipboard} from "@/hooks";
import {useUserStore} from "@/store/index.js";
import {onShow} from "@dcloudio/uni-app";
import {getDeviceRegionApi} from "@/api/map.js";
import { getAssetsImage } from "@/utils/index.js";
import { getUserInfo } from "@/api/user/index.js";
import { useUserStore } from "@/store/index.js";
import { onShow } from "@dcloudio/uni-app";
import { getDeviceRegionApi } from "@/api/map.js";
const {setClipboardData, getClipboardData} = useClipboard();
const rightImage = getAssetsImage("/images/user/rightBtn.png");
const logoImage = getAssetsImage("/images/user/logo1.png");
const userStore = useUserStore();
// 复制
const toCopy = async () => {
  await setClipboardData({data: "1234567890"});
  const data = await getClipboardData();
const user = ref("");
const getUserInfoData = () => {
  getUserInfo().then((res) => {
    user.value = res.data.data;
  });
};
function logOut() {
  userStore.setUserInfo(null)
  uni.redirectTo({
    url: '/pages/login/index'
  })
  userStore.setUserInfo(null);
  uni.reLaunch({
    url: "/pages/login/index",
  });
}
function getDeviceRegion() {
  getDeviceRegionApi().then(res =>{
    console.log(res.data.data,'用户设备')
  })
  getDeviceRegionApi().then((res) => {});
}
const handelEdit = (val) => {
  if (val === 1) {
    uni.navigateTo({
      url: `/subPackages/userDetail/infos/index`,
    });
  } else {
    uni.navigateTo({
      url: `/subPackages/userDetail/password/index`,
    });
  }
};
onShow(() => {
  getUserInfoData();
// 登录鉴权,微信小程序端点击tabbar的底层逻辑不触发uni.switchTab,需要在页面onShow生命周期中校验权限
onShow(async () => {
  getDeviceRegion()
  // window.addEventListener('message', (event) => {
  //   console.log('message')
  // })
  // setInterval(() => {
    // sWebViewRef.value.evalJs(`x_sun('${test.value}')`)
  // }, 2000)
  // #ifndef MP-WEIXIN
  uni.setTabBarItem({
    index: 2, // Tab 的索引(从0开始)
    visible: false,
  });
  uni.setTabBarItem({
    index: 3, // Tab
    visible: true,
  });
  // #endif
});
</script>
<style scoped lang="scss">
.page-wrap {
  width: 100%;
  height: 100%;
}
.userBox {
  padding-top: 88rpx;
}
/* #ifdef MP-WEIXIN */
.userBox {
   padding-top: 180rpx;
}
/* #endif */
.userName {
  font-weight: 700;
  font-size: 36rpx;
  color: #000000;
}
.departs {
  display: flex;
  align-items: center;
  margin-top: 22rpx;
  image {
    width: 28rpx;
    height: 28rpx;
  }
  span {
    font-family: "Source Han Sans CN";
    font-weight: 400;
    font-size: 28rpx;
    color: rgba(0, 0, 0, 0.6);
    margin-left: 6rpx;
  }
}
.rightLogo {
  width: 200rpx;
  height: 80rpx;
  image {
    width: 100%;
    height: 100%;
  }
}
.bottomLogo {
  position: absolute;
  bottom: 50rpx;
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
  image {
    width: 128rpx;
    height: 52rpx;
  }
}
.goOutStyle {
  width: 590rpx;
  height: 76rpx;
  background: #1d6fe9;
  border-radius: 40rpx;
  font-family: "Source Han Sans CN";
  font-weight: 400;
  font-size: 28rpx;
  color: #ffffff;
  text-align: center;
  line-height: 76rpx;
  margin: auto;
  margin-top: 114rpx;
}
.personalInformation {
  display: flex;
  justify-content: space-between;
  padding: 0 24rpx;
  .message,
  .passwordBox {
    width: 340rpx;
    height: 160rpx;
    .messagebox {
      padding: 20rpx 24rpx;
      font-family: "Source Han Sans CN";
      font-weight: 500;
      font-size: 28rpx;
      color: #000000;
    }
    .editInfo {
      padding: 20rpx 24rpx;
      color: rgba(0, 0, 0, 0.5);
      font-family: "Source Han Sans CN";
      font-weight: 400;
      font-size: 24rpx;
      display: flex;
      align-items: center;
      image {
        width: 28rpx;
        height: 28rpx;
      }
    }
  }
  .message {
    background: url(https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/info.png)
      no-repeat center;
    background-size: 100% 100%;
  }
  .passwordBox {
    background: url(https://wrj.shuixiongit.com/aiskyminio/cloud-bucket/ztzf_app_assets/images/user/password.png)
      no-repeat center;
    background-size: 100% 100%;
  }
}
</style>