80%

pages/project_supervision/project_detail/security_manage/security_manage.vue

@@ -1,22 +1,86 @@
 <template>
 	<view>
-		安全管理
+		<view class="filter-bar">
+			<view :class="`inspection left-btn ${activedIndex==0? 'active':''}`" @tap="switchTab(0)">
+				安全管理日志
+			</view>
+			<view :class="`rectification left-btn ${activedIndex==1? 'active':''}`" @tap="switchTab(1)">
+				安全检查记录
+			</view>
+			<u-button class='filter-btn' icon="map" text="筛选"></u-button>
+		</view>
+		<view class="quality-issues">
+			<IssueItems
+				:fields="{issuesName:'质量问题',person:'填报人员',submitDate:'填报日期',content:'整改内容',assignDate:'指派日期',feedback:'整改反馈',rectificationDate:'整改日期'}"
+				:data="{
+				issuesName:'采购电缆发现存在残次品',person:'离散多',submitDate:'2022/07/03',content:'发现800捆电缆中66捆存在残次品，需联系供应商进行全面更换',assignDate:'2022/07/03',
+				feedback:'已联系供应商进行全面更换，等待更换',rectificationDate:'2022/07/03',assignDate:'2020/11/32'
+			}">
+			</IssueItems>
+		</view>
 	</view>
 </template>
 
 <script>
+	import IssueItems from '../issue-item/issue-item.vue'
+	// import Inspection from './inspection/inspection.vue'
 	export default {
+		components: {
+			IssueItems,
+			// Inspection
+		},
 		data() {
 			return {
-
+				activedIndex: 0
 			}
 		},
 		methods: {
-
+			switchTab(index) {
+				this.activedIndex = index
+			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped>
+	.quality-issues {
+		// margin-top: 88rpx;
+		padding: 20rpx;
+	}
 
+	.filter-bar {
+		width: 750rpx;
+		height: 88rpx;
+		display: flex;
+		align-items: center;
+		background-color: #fff;
+
+		.left-btn {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 187rpx;
+			height: 88rpx;
+			font-family: PingFangSC-Regular;
+			font-size: 24rpx;
+			color: #8F959E;
+			letter-spacing: 0;
+			line-height: 24rpx;
+			font-weight: 400;
+		}
+
+		.active {
+			color: #466DF6;
+		}
+
+		.inspection {}
+
+		.rectification {}
+
+		.filter-btn {
+			width: 122rpx;
+			height: 56rpx;
+			margin-right: 32rpx;
+		}
+	}
 </style>