<template>
	<div class="prosess-unit">
		<!-- <div class="process-status">
			<span :class="approveType===1 ? 'uni-text-green' : 'uni-text-red'">{{getStatus}}</span>
		</div> -->
		<!-- <div > -->
			<i class="ico" :class="approveType===1 ? 'ico-tg' :  'ico-bh'"></i>
			<div class="process-content">
				<div class='process-title'>
					
					<span>【{{getAdviceName}}】</span>
					<span class="process-adv">{{getTime}}<i class="ico ico-yd" v-if="item.APPROVED_MARK==2000"></i></span>
				</div>
				<div class="process-title" v-if="item.APPROVED_INFO.length<16">
					<p class="pl16">
						<span class="process-role">{{item.APPROVED_STAFF}}：</span>
						<span>{{item.APPROVED_INFO}}</span>
						
					</p>
					<span class="process-adv">{{item.SUMTIMES}}</span>
				</div>
				<block  v-else>
					
					<div class="process-title">
						<p class="pl16">
							<span class="process-role">{{item.APPROVED_STAFF}}：</span>
						
							
						</p>
						<span class="process-adv">{{item.SUMTIMES}}</span>
					</div>
					<p class="pl16">
						
						<span>{{item.APPROVED_INFO}}</span>
						
					</p>
				</block>
			</div>
		<!-- </div> -->
	</div>
</template>
<script>
	export default {
		props: {
			item:{
				required: true,
				type: Object
			},
			approveType:{ // 1 通过
				required: true,
				type: Number
			}
		},
		computed: {
			getAdviceName () {
				let _this = this
				if (_this.item) {
					let name = _this.item.APPROVED_NAME
					return _this.approveType===1 ? (name.indexOf('意见')>-1 ? name : name+'意见') : (name ||'驳回意见')
				}
			},
			getStatus () {
				let _this = this
				return _this.approveType===1 ? '通过' : '驳回'
			},
			getTime() {
				let _this = this
				return _this.$util.cutDate(_this.item.APPROVED_DATE,'YYYY-MM-DD hh:mm')
				
// 				if (t) {
// 					let arr = t.split(':').slice(0,-1)
// 					
// 					return  arr.join(':').split('/').join('.') // arr.join(':').replace(/\//g,'.')
// 				}
			}
			
		}
		
	}
</script>

<style scoped>
	.pl16 {
		padding-left: 16upx;
	}
	.ico-yd {
		display: flex;
		align-items: center;
	}
	.ico-yd:before {
		background-image: url('../../static/images/contract/htsp_mobile.png');
		margin-right: 0upx;
		height: 24upx;
		background-position: center right;
	}
	.prosess-unit {
		padding: 0 32upx;
		display: flex;
		align-items: baseline;
		justify-content: flex-start;
		position: relative;
		margin-bottom: 16upx;
		width: 100%;
		box-sizing: border-box;
	}
	.prosess-unit span, .prosess-unit p{
		font-size: 24upx;
	}
	.process-content {
		width: 658upx;
	}
	.process-title {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.process-adv{
		color: #8b8a8a;
		display: flex;
		align-items: center;
	}
	.process-role {
		color: #676767;
		font-size: 24upx;
		
		min-width: 120upx;
	}
	.process-yijian {
		display: flex;
		justify-content: flex-start;
		align-items: baseline;
	}
	.ico-bh:before {
		width: 25upx;
		height: 25upx;
		background-image: url('../../static/images/wrong-ico.png');
	}
	.ico-tg:before {
		width: 25upx;
		height: 25upx;
		background-image: url('../../static/images/right-ico.png');
	}
	
</style>