<template>
	<view class="add-form-container">
		<view class="list">
			<view class="title">
				<span>*</span>我的报修
			</view>
			<view class="add-btn">
				<u-button type="primary" @click="openDevice"><u-icon name="plus-circle" color="#ffffff"
						size="36"></u-icon>设备报修</u-button>
			</view>
			<view class="add-btn">
				<u-button type="primary" @click="openTool"><u-icon name="plus-circle" color="#ffffff"
						size="36"></u-icon>工装报修</u-button>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	const { proxy } = getCurrentInstance()
	function openDevice() {
		proxy.$tab.navigateTo(`/pages/eam/repairOrder/index?type=DEVICE&flag=2`)
	}
	function openTool() {
		proxy.$tab.navigateTo(`/pages/eam/repairOrder/index?type=EQUIPMENT&flag=2`)
	}
</script>

<style>
	.add-form-container {
		min-height: calc(100vh - 140rpx);
		background: white;
		padding: 0px 0rpx 140rpx;
	}
	
	.list {
		padding: 0rpx 30rpx;
	
		.item {
			display: flex;
			margin-bottom: 20rpx;
	
			.item-box {
				background: #F5F5F5;
				border-radius: 12rpx;
				flex: 1;
				width: 0rpx;
			}
	
			.spare-title {
				padding: 20rpx 30rpx;
				border-bottom: 1px solid #e4e4e4;
	
				.title-txt {
					color: #409eff;
					font-size: 30rpx;
					font-weight: bold;
				}
			}
	
			.dec {
				color: #9c9c9c;
				padding: 20rpx 30rpx 20rpx;
			}
	
		}
	}
	.title {
		padding: 32rpx 0rpx;
		position: relative;
	
		span {
			position: absolute;
			left: -16rpx;
			color: #fa3534;
			top: 19px;
		}
	}
	.add-btn {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-top: 20px;
	}

</style>
