LuYaShi
/
InspectionCleaning
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

管理员身份界面绘画中

This commit is contained in:
李彪 2025-04-15 11:04:10 +08:00
parent 5def8e859a
commit bb0279bc02
4 changed files with 333 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
pages.json
View File

@ -13,19 +13,21 @@
{
"path": "pages/adminHome/index",
"style": {
"navigationBarTitleText": "首页"
"navigationBarTitleText": "首页",
"navigationStyle": "custom"
}
},
{
"path": "pages/adminNfc/index",
"style": {
"navigationBarTitleText": "nfc写入"
"navigationBarTitleText": "nfc卡写入"
}
},
{
"path": "pages/adminMy/index",
"style": {
"navigationBarTitleText": "nfc写入"
"navigationBarTitleText": "我的",
"navigationStyle": "custom"
}
},
{
@ -223,7 +225,6 @@
]
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
@ -273,14 +274,15 @@
}
]
},
// 分包预载配置
"preloadRule": {
// 当我们进入了pages/index/index页面以后就会预下载pages/subPack分包
"pages/index/index": {
"network": "all", //在指定网络下预下载，可选值为：all（不限网络）、wifi（仅wifi下预下载）
"packages": ["pages/subPack"] //进入页面后预下载分包
"packages": [
"pages/subPack"
] //进入页面后预下载分包
}
},
"uniIdRouter": {}
}
}

63
pages/adminHome/index.vue
View File

@ -1,6 +1,28 @@
<template>
<view class="content">
<view>管理员首页</view>
<view class="bg-box">
<view style="height: 150rpx"></view>
<view class="tip">欢迎使用,张三</view>
<view class="desc">欢迎使用巡检管理端</view>
<view class="card">
<view class="card-item">
<view class="item-title">区域数量 </view>
<view class="item-totel">10 </view>
</view>
<view class="card-item">
<view class="item-title">子区域数量 </view>
<view class="item-totel">20 </view>
</view>
<view class="card-item">
<view class="item-title">已绑定子区域数 </view>
<view class="item-totel">30 </view>
</view>
<view class="card-item">
<view class="item-title">未绑定子区域数 </view>
<view class="item-totel">40 </view>
</view>
</view>
</view>
<u-tabbar :list="vuex_tabbar"></u-tabbar>
</view>
</template>
@ -22,9 +44,44 @@ export default {
</script>
<style lang="scss" scoped>
.content {
height: 100vh; // 确保容器有明确高度
height: calc(100vh - 100rpx); // 确保容器有明确高度
// background-color: skyblue;
overflow: hidden;
padding-bottom: 100rpx;
// padding-bottom: 100rpx;
.bg-box {
background-color: #528dfe;
height: 800rpx;
.tip {
padding-left: 30rpx;
color: white;
font-size: 40rpx;
}
.desc {
margin-top: 20rpx;
padding-left: 30rpx;
color: white;
}
.card {
border: 1px solid red;
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, 1fr);
gap: 30rpx;
padding: 50rpx;
.card-item {
border: 1px solid blue;
border-radius: 20rpx;
background-color: #e8efff;
height: 300rpx;
padding: 30rpx;
.item-title {
font-size: 30rpx;
}
.item-totel {
font-size: 50rpx;
}
}
}
}
}
</style>

236
pages/adminMy/index.vue
View File

@ -1,30 +1,242 @@
<template>
<view class="content">
<view>管理员--我的</view>
<view class="content-title">我的</view>
<view class="head">
<view class="avatar-box">
<u-avatar
:src="baseInfo.avatar || '/static/images/avatar.png'"
size="140"
mode="circle"
class="avatar"
></u-avatar>
</view>
<view class="content-name">姓名姓名</view>
</view>
<view class="cell-list-box">
<view class="cell-list-group">
<view class="cell-list-item" v-for="item in cellList" @click="toPage(item.path)">
<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 v-if="item.content">{{ item.content }}</text>
<u-icon v-else name="arrow-right" color="#a5a7ab" size="32"></u-icon>
</view>
</view>
</view>
</view>
<u-tabbar :list="vuex_tabbar"></u-tabbar>
</view>
</template>
<script>
import { loginApi } from "@/api/apiList";
import { GetCompanyInformation } from "@/api/apiList.js";
import {
toast,
clearStorageSync,
setStorageSync,
getStorageSync,
useRouter,
} from "@/utils/utils.js";
export default {
data() {
return {
phone: "13800451500",
pwd: "123456",
baseInfo: {
avatar: "",
companyName: "南昌理工",
name: "保洁",
sex: 0, // 0 男 1 女
time: "2025/4/2-2026/4/2",
personType: "保洁员",
},
clickCount: 0, // 用于记录点击次数
version: "",
cellList: [
{
title: "性别",
icon: "/static/images/icon-unit.png",
path: "",
content: "男",
},
{
title: "人员类型",
icon: "/static/images/icon-info.png",
path: "/pages/user/versionInfo/index",
content: "区域管理员",
},
{
title: "所属区域",
icon: "/static/images/icon-logout.png",
path: "",
content: "区域111",
},
{
title: "版本信息",
icon: "/static/images/icon-logout.png",
path: "/pages/user/versionInfo/index",
},
{
title: "注销",
icon: "/static/images/icon-logout.png",
path: "",
},
],
};
},
mounted() {
uni.hideLoading(); // 关闭 Loading
onLoad() {
// this.getUserInfo();
// const that = this;
// uni.getSystemInfo({
// success: function (res) {
// console.log("res", res);
// that.version = res.appVersion;
// },
// });
},
onShow() {
// this.getCompanyInformation();
// uni.$on("refresh", (e) => {
// this.getUserInfo();
// uni.$off("refresh");
// });
},
// 下拉刷新
onPullDownRefresh() {
//console.log('refresh');
// this.getUserInfo();
// uni.stopPullDownRefresh(); //停止刷新
},
methods: {
handleClick() {
this.clickCount++; // 每次点击增加点击次数
if (this.clickCount === 6) {
this.clickCount = 0; // 执行完函数后重置点击次数
uni.navigateTo({
url: "/pages/login/login",
});
}
},
upload_avatar() {
const _this = this;
uni.chooseImage({
count: 1,
sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
sourceType: ["album", "camera"], //从相册选择
success: function (res) {
uni.uploadFile({
url: _this.$api_url + "/api/index/upload_cos",
filePath: res.tempFilePaths[0],
name: "file",
formData: {
floder: "avatar",
},
success: (uploadFileRes) => {
//let retData = JSON.parse(uploadFileRes)
let retData = JSON.parse(uploadFileRes.data);
console.log("up:", retData);
const _data = {
avatar: retData.data.file,
};
_this.$api.baseInfoSave(_data).then((ret) => {
if (ret.code == 1) {
_this.baseInfo.avatar = retData.data.file;
} else {
toast(res.msg);
}
});
},
});
},
});
},
// 获取单位信息
async getCompanyInformation() {
const res = await GetCompanyInformation();
if (res.succeed) {
this.baseInfo = res.data;
this.cellList[0].content = this.baseInfo.time;
}
},
toPage(path) {
if (!path) return;
useRouter(path, {}, "navigateTo");
},
},
onLoad() {},
methods: {},
};
</script>
<style lang="scss" scoped>
.content {
height: 100vh; // 确保容器有明确高度
// background-color: skyblue;
overflow: hidden;
padding-bottom: 100rpx;
height: calc(100vh - 100rpx);
// background: #f6f8fc;
.content-title {
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 0;
// background: linear-gradient(to bottom, #e5ebfd, #f6f8fc);
.avatar-box {
width: 140rpx;
height: 140rpx;
border-radius: 50%;
position: relative;
.avatar {
width: 100%;
}
}
}
.content-name {
margin-top: 20rpx;
}
.cell-list-box {
margin-top: 20rpx;
padding: 0 32rpx;
.cell-list-group {
.cell-list-item {
border-bottom: 1px solid #e9eaee;
padding: 0 10rpx;
height: 120rpx;
display: flex;
justify-content: space-between;
align-items: center;
&-left {
display: flex;
text {
margin-left: 24rpx;
align-self: center;
}
}
}
}
}
}
</style>

43
pages/adminNfc/index.vue
View File

@ -1,6 +1,16 @@
<template>
<view class="content">
<view>管理员--NFC</view>
<!-- 头部两个卡片 -->
<view class="card">
<view class="card-item card-left">
<view class="card-title">已绑定子区域数</view>
<view class="card-totel">10</view>
</view>
<view class="card-item card-right">
<view class="card-title">未绑定子区域数</view>
<view class="card-totel">10</view>
</view>
</view>
<u-tabbar :list="vuex_tabbar"></u-tabbar>
</view>
</template>
@ -22,9 +32,36 @@ export default {
</script>
<style lang="scss" scoped>
.content {
height: 100vh; // 确保容器有明确高度
// background-color: skyblue;
height: calc(100vh - 100rpx); // 确保容器有明确高度
overflow: hidden;
padding-bottom: 100rpx;
.card {
display: flex;
padding-left: 30rpx;
padding-right: 30rpx;
.card-item {
position: relative;
flex: 1;
height: 200rpx;
border-radius: 30rpx;
color: white;
padding: 20rpx;
font-size: 30rpx;
.card-title {
font-size: 30rpx;
}
.card-totel {
padding-left: 20rpx;
font-size: 40rpx;
}
}
.card-left {
background-color: #4974f3;
}
.card-right {
margin-left: 20rpx;
background-color: #53d5a9;
}
}
}
</style>