136 lines
3.0 KiB
Vue
136 lines
3.0 KiB
Vue
<template>
|
|
<view class="replyList">
|
|
<view class="reply-h2">整改记录</view>
|
|
<view class="reply-item flex" v-for="(item,index) in replyData" :key="index">
|
|
<view class="user-image">
|
|
<image src="/static/safeMange/upload_image.png"></image>
|
|
</view>
|
|
<view class="reply-detail">
|
|
<view class="detail-item">
|
|
<view class="detail-label flex">{{item.type == 1 ? '整改人':'复查人'}}<text>{{item.createTime}}</text></view>
|
|
<view class="detail-content">{{item.createUserName}}</view>
|
|
</view>
|
|
|
|
<view class="detail-item">
|
|
<view v-if="item.type == 1">
|
|
<view class="detail-label">整改状态</view>
|
|
<view class="detail-content status">{{item.status == 1 ? '待整改':'已整改'}}</view>
|
|
</view>
|
|
|
|
<view v-if="item.type == 2">
|
|
<view class="detail-label">复查状态</view>
|
|
<view class="detail-content" :class="{'error': item.status == 1, 'success': item.status == 2}">{{item.status == 1 ? '复查未通过':'复查通过'}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="detail-item">
|
|
<view class="detail-label">{{item.type == 1 ? '整改内容':'复查情况'}}</view>
|
|
<view class="detail-content">{{item.additionalRemarks}}</view>
|
|
</view>
|
|
|
|
<view class="detail-item" v-if="item.fileUrl">
|
|
<view class="detail-label">图片</view>
|
|
<view class="detail-content">
|
|
<view class="imgBox" v-show="item.fileUrl" v-for="(itm,idx) in item.fileUrl.split(',')" :key="idx">
|
|
<image :src="url_config+'image/'+itm" class="img"
|
|
@click="previewImage(url_config+'image/'+itm)"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default{
|
|
name: "reply-list",
|
|
props:{
|
|
replyData:{
|
|
type: Array
|
|
}
|
|
},
|
|
data(){
|
|
return{
|
|
imgFileList: []
|
|
}
|
|
},
|
|
methods:{
|
|
previewImage(url) {
|
|
uni.previewImage({
|
|
urls: [url]
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.replyList{
|
|
margin: 0 20rpx;
|
|
background: #fff;
|
|
padding: 36rpx 32rpx;
|
|
box-sizing: border-box;
|
|
.flex{
|
|
display: flex;
|
|
}
|
|
.reply-h2{
|
|
margin-bottom: 24rpx;
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
}
|
|
.reply-item{
|
|
font-size: 28rpx;
|
|
background: #F6FBFF;
|
|
padding: 26rpx 24rpx;
|
|
margin-bottom: 20rpx;
|
|
.user-image{
|
|
margin-right: 20rpx;
|
|
uni-image{
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
.reply-detail{
|
|
padding-top: 8rpx;
|
|
flex: 1;
|
|
.detail-item{
|
|
margin-bottom: 26rpx;
|
|
.detail-label{
|
|
color: #9399A9;
|
|
font-size: 24rpx;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-bottom: 12rpx;
|
|
}
|
|
.status{
|
|
color: #E6A23C;
|
|
}
|
|
.success{
|
|
color: #67C23A;
|
|
}
|
|
.error{
|
|
color: #F56C6C;
|
|
}
|
|
}
|
|
.imgBox {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
display: inline-flex;
|
|
position: relative;
|
|
margin-right: 12rpx;
|
|
margin-bottom: 16rpx;
|
|
border-radius: 10rpx;
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 12rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|