by2025/SmartParks_uniapp
9
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

新增单位管理界面

Browse Source
This commit is contained in:
merak1237
2025-09-02 17:36:22 +08:00
parent 7b4050b55f
commit 5da423035d
9 changed files with 646 additions and 581 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
pages/sys/workbench/inspection/inspection.vue
View File

@@ -10,23 +10,21 @@
</view>
<!-- 列表区 -->
<view class="ins-list">
<view v-for="(item, idx) in list" :key="idx" class="ins-card" @click="goProcess(item)">
<view class="ins-row">
<view class="ins-no">保洁部日常巡检 {{ item.createTime.substring(0,11) }}</view>
<view class="ins-status" :class="getStatusColor(item.status)">
{{ getStatusLabel(item.status) }}
</view>
</view>
<image class="ins-line-image" src="/static/ic_my_repair_03.png" />
<view class="ins-info">巡检人：{{ item.createTime }}</view>
<view class="ins-info">计划完成时间：{{ item.typeName }}</view>
<view class="ins-info">实际完成时间：{{ item.location }}</view>
<view class="ins-info">巡检进度：{{ item.location }}</view>
</view>
<view v-for="(item, idx) in list" :key="idx" class="ins-card" @click="goProcess(item)">
<view class="ins-row">
<view class="ins-no">保洁部日常巡检 {{ item.createTime.substring(0,11) }}</view>
<view class="ins-status" :class="getStatusColor(item.status)">
{{ getStatusLabel(item.status) }}
</view>
</view>
<image class="ins-line-image" src="/static/ic_my_repair_03.png" />
<view class="ins-info">巡检人：{{ item.createTime }}</view>
<view class="ins-info">计划完成时间：{{ item.typeName }}</view>
<view class="ins-info">实际完成时间：{{ item.location }}</view>
<view class="ins-info">巡检进度：{{ item.location }}</view>
</view>
</view>
</view>
</view>
</template>
<script>
@@ -79,10 +77,10 @@
this.$set(this.tabLoaded, idx, true);
this.loading = false;
},
goProcess(item) {
goProcess(item) {
const detailItemStr = encodeURIComponent(JSON.stringify(item));
uni.navigateTo({
url: `/pages/sys/workbench/inspection/inspectionProcess?detailItem=${item}`
uni.navigateTo({
url: `/pages/sys/workbench/inspection/inspectionProcess?detailItem=${item}`
});
},
@@ -180,43 +178,43 @@
margin-top: 25rpx;
margin-left: 19rpx;
margin-right: 50rpx;
}
.ins-no {
font-size: 24rpx;
color: #0B0B0B;
font-weight: 500;
}
.ins-status {
font-size: 24rpx;
font-weight: 500;
}
.ins-line-image {
margin: left 29rpx;
margin-right: 39rpx;
height: 2rpx;
margin-bottom: 29rpx;
}
.ins-status.orange {
color: #F3AB44;
}
.ins-status.doing {
color: #00C9AA;
}
.ins-status.done {
color: #8A8A8A;
}
.ins-info {
font-size: 24rpx;
color: #888;
margin-bottom: 30rpx;
margin-left: 47rpx;
}
.ins-no {
font-size: 24rpx;
color: #0B0B0B;
font-weight: 500;
}
.ins-status {
font-size: 24rpx;
font-weight: 500;
}
.ins-line-image {
margin: left 29rpx;
margin-right: 39rpx;
height: 2rpx;
margin-bottom: 29rpx;
}
.ins-status.orange {
color: #F3AB44;
}
.ins-status.doing {
color: #00C9AA;
}
.ins-status.done {
color: #8A8A8A;
}
.ins-info {
font-size: 24rpx;
color: #888;
margin-bottom: 30rpx;
margin-left: 47rpx;
}
</style>

317
pages/sys/workbench/unitManagement/unitManagement.vue Normal file
View File

@@ -0,0 +1,317 @@
<template>
<view class="unit-management">
<!-- 顶部单位信息栏 -->
<view class="unit-header-container">
<view class="unit-header">
<image class="header-icon" src="/static/ic_enterprise.png" mode="aspectFit" />
<view class="unit-title">南川区******单位（共189人）</view>
</view>
</view>
<!-- 功能模块卡片区 -->
<view class="function-container">
<!-- 左侧列（员工审核+员工管理） -->
<view class="left-column">
<!-- 员工审核卡片 -->
<view class="function-card" @click="goToEmployeeReview">
<view class="card-content">
<view class="card-text">
<view class="card-title">员工审核</view>
<view class="card-subtitle">入职/审核</view>
</view>
<view class="card-icon">
<image src="/static/ic_review.png" mode="aspectFit" />
</view>
</view>
</view>
<!-- 员工管理卡片 -->
<view class="function-card" @click="goToEmployeeManagement">
<view class="card-content">
<view class="card-text">
<view class="card-title">员工管理</view>
<view class="card-subtitle">权限/离职</view>
</view>
<view class="card-icon">
<image src="/static/ic_resign.png" mode="aspectFit" />
</view>
</view>
</view>
</view>
<!-- 右侧邀请新员工卡片 -->
<view class="right-card" @click="showInviteDialog">
<image class="card-bg" src="/static/ic_unitBg.png" mode="aspectFill" />
<view class="card-content">
<view class="card-text">
<view class="card-title">邀请新员工</view>
<view class="card-subtitle">入职/邀请</view>
</view>
<view class="card-icon">
<image src="/static/ic_Invite_employees.png" mode="aspectFit" />
</view>
</view>
</view>
</view>
<!-- 邀请新员工弹窗 -->
<view class="invite-dialog" v-if="showDialog">
<view class="dialog-content">
<!-- 盾牌背景图 -->
<image class="shield-bg" src="/static/ic_shield.png" mode="aspectFit" />
<!-- 手机插画部分 -->
<view class="phone-illustration">
<image class="phone-image" src="/static/121221.png" mode="aspectFit" />
</view>
<!-- 二维码部分 -->
<view class="qr-code-container">
<image class="qr-code" src="/static/ic_qrcode.png" mode="aspectFit" />
</view>
<!-- 关闭按钮 -->
<view class="close-btn" @click="hideInviteDialog">
<image src="/static/ic_close.png" mode="aspectFit" />
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
showDialog: false
}
},
methods: {
goToEmployeeReview() {
uni.navigateTo({
url: '/pages/employee/review'
});
},
goToInviteEmployee() {
uni.navigateTo({
url: '/pages/employee/invite'
});
},
goToEmployeeManagement() {
uni.navigateTo({
url: '/pages/employee/management'
});
},
showInviteDialog() {
this.showDialog = true;
},
hideInviteDialog() {
this.showDialog = false;
}
}
}
</script>
<style scoped>
.unit-management {
display: flex;
flex-direction: column;
height: 100vh;
background-color: #f5f5f5;
padding: 20rpx;
}
.unit-header-container {
display: flex;
justify-content: center;
margin-bottom: 20rpx;
}
.unit-header {
background-color: #2186FF;
padding: 20rpx 30rpx;
color: white;
border-radius: 16rpx;
width: 100%;
max-width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.header-icon {
width: 40rpx;
height: 40rpx;
margin: 0 40rpx;
}
.unit-title {
font-size: 36rpx;
font-weight: bold;
}
.function-container {
flex: 1;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.left-column {
width: 48%;
height: 24%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.right-card {
width: 48%;
height: 24%;
background-color: white;
border-radius: 16rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
overflow: hidden;
}
.function-card {
width: 100%;
height: 46%;
background-color: white;
border-radius: 16rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
display: flex;
flex-direction: column;
justify-content: center;
}
.card-content {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 38rpx;
}
.card-text {
display: flex;
flex-direction: column;
}
.card-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
margin-bottom: 8rpx;
}
.card-subtitle {
font-size: 24rpx;
color: #ADADAD;
}
.card-icon {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
display: flex;
align-items: flex-end;
justify-content: center;
}
.card-icon image {
width: 60rpx;
height: 60rpx;
}
.card-bg {
padding-bottom: 24rpx;
width: 90%;
height: 50%;
top: 0;
left: 5%;
z-index: 0;
display: flex;
}
/* 邀请弹窗样式 */
.invite-dialog {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
}
.dialog-content {
width: 70%;
background-color: #2186FF;
border-radius: 20rpx;
padding: 40rpx;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
overflow: hidden;
}
.shield-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.phone-illustration {
position: relative;
width: 200rpx;
height: 200rpx;
margin-bottom: 40rpx;
z-index: 1;
}
.phone-image {
width: 100%;
height: 100%;
}
.qr-code-container {
width: 300rpx;
height: 300rpx;
background-color: white;
padding: 20rpx;
border-radius: 10rpx;
margin-bottom: 40rpx;
z-index: 1;
}
.qr-code {
width: 100%;
height: 100%;
}
.close-btn {
width: 60rpx;
height: 60rpx;
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
}
.close-btn image {
width: 40rpx;
height: 40rpx;
}
</style>