You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

149 lines
3.9 KiB

8 months ago
<template>
<!-- 备件领用申请 -->
<view class="container">
<u-navbar back-icon-color='#fff' :background="{ background: '#409eff'}" back-text="" title-color='#fff'
title="备件领用申请">
<template v-slot:right>
<u-icon name="plus" color="#fff" size="36" style="padding-right: 30rpx;" @click="addForm"></u-icon>
</template>
</u-navbar>
<Search @search='search' @screen='screen' />
<view class="list">
<view class="item" v-for="(item,index) in data.list" :key="index">
<view class="title">
<view class="title-txt">
{{item.title}}
</view>
<view class="time" v-if="data.isShowTime">
2023-12-12 08:00:00
</view>
</view>
<view class="dec" v-for="(cur,key) in labelList" :key="key">
{{cur.label}}:<span>{{item[cur.field]}}</span>
</view>
<view class="bottom" v-if="data.isShowStatus">
<view class="status">
<u-tag text="待领取" v-if="item.status==1" bg-color='rgba(255,255,255,0)' color='#fe8463' border-color='#fe8463' type="primary" shape='circle'/>
<u-tag text="撤单" v-else-if="item.status==2" bg-color='rgba(255,255,255,0)' color='#d7d7d7' border-color='#d7d7d7 ' type="warning" shape='circle'/>
<u-tag text="待执行" v-else-if="item.status==3" bg-color='rgba(255,255,255,0)' color='#e01f54' border-color='#e01f54' type="success" shape='circle'/>
<u-tag text="维修中" v-else-if="item.status==4" bg-color='rgba(255,255,255,0)' color='#005eaa' border-color='#005eaa ' type="error" shape='circle'/>
<u-tag text="待验证" v-else-if="item.status==5" bg-color='rgba(255,255,255,0)' color='#2EC7C9' border-color='#2EC7C9' type="info" shape='circle'/>
<u-tag text="已完成" v-else-if="item.status==6" bg-color='rgba(255,255,255,0)' color='#2ba471' border-color='#2ba471' type="info" shape='circle'/>
</view>
</view>
</view>
</view>
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom);"></view>
</view>
</template>
<script>
export default {
data() {
return {
labelList: [{
label: '申请单号',
field: 'dec1',
}, {
label: '申请类型',
field: 'dec2',
}, {
label: ' 申 请 人',
field: 'dec3',
}],
data: {
isShowTime: true,
isShowStatus: true,
list: [{
title: '备件002领用',
dec1: '维修领用',
dec2: '刘冰雨',
status: 6
}, {
title: '设备报修205245',
dec1: 'BX-20224648',
dec2: 'BX-20224648',
dec3: 'BX-20224648',
dec4: 'BX-20224648',
dec5: 'BX-20224648',
time: '2023-12-12 06:00:00',
status: 2
}, {
title: '设备报修205245',
dec1: 'BX-20224648',
dec2: 'BX-20224648',
dec3: 'BX-20224648',
dec4: 'BX-20224648',
dec5: 'BX-20224648',
time: '2023-12-12 06:00:00',
status: 3
}, {
title: '设备报修205245',
dec1: 'BX-20224648',
dec2: 'BX-20224648',
dec3: 'BX-20224648',
dec4: 'BX-20224648',
dec5: 'BX-20224648',
time: '2023-12-12 06:00:00',
status: 4
}]
}
}
},
methods: {
// 筛选
screen() {
this.$tab.navigateTo(`/pages/sparePartsApplication/screen`)
},
addForm() {
this.$tab.navigateTo(`/pages/sparePartsApplication/addForm`)
}
}
}
</script>
<style lang="scss" scoped>
.list{
background: #f5f5f5;
margin-top: 20rpx;
.item{
padding: 30rpx 30rpx 0px 30rpx;
margin-top: 20rpx;
background: white;
position: relative;
.title{
display: flex;
align-items: center;
padding-bottom: 20rpx;
.title-txt{
color: #409eff;
font-weight: bold;
font-size: 36rpx;
width: 0px;
flex: 1;
}
.time{
color: #919191;
}
}
.dec{
padding-bottom: 20rpx;
span{
color: #999999;
}
}
.last{
padding-bottom: 30rpx;
}
.bottom{
position: absolute;
right: 30rpx;
bottom:40rpx;
}
}
}
</style>