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.
 
 
 
 

103 lines
2.6 KiB

<template>
<view class="content">
<view class="list">
<view class="item" v-for="(item,index) in data.list" :key="index" @click="itemClick(item,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="time">
{{item.time}}
</view>
<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>
</template>
<script>
export default {
props: {
labelList:{
type: Array,
default:()=>{return []},
},
data:{
type: Object,
default:()=>{return {}},
},
},
data() {
return {
}
},
methods: {
itemClick(item,index){
this.$emit('itemClick',item,index)
}
}
}
</script>
<style lang="scss" scoped>
.list{
background: #f5f5f5;
margin-top: 20rpx;
.item{
padding: 30rpx 30rpx 0px 30rpx;
margin-top: 20rpx;
background: white;
.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{
display: flex;
justify-content: space-between;
align-items: center;
border-top: 1px solid #E4E4E4;
padding: 20rpx 0px;
}
}
}
</style>