gwlz/jp-mobile/pages/commonseal/commonInfo.vue

<template>
	<view class="page_main">
		<commonCard :gwId="gwId"></commonCard>
		<view class="info_main">
			<u-steps :current="current" direction="column" inactiveColor="#36a7f3" activeColor="#5fdf50">
				<u-steps-item :error="isSuspend" title="发起" :desc="inputForm.createTruename +' - '+inputForm.createTime">
				</u-steps-item>
				<u-steps-item v-for="item in downList"
				:error="isSuspend"
					:title="item.which=='0'?'承办科(室)意见':item.which=='1'?'办公室意见':item.which=='2'?'分管领导意见':item.which=='3'?'主要领导意见':item.which == '4'
                  ? '已归档'
                  : '已中止'"
					:desc="item.nextTruename +' - '+item.updateTime">
				</u-steps-item>
				<u-steps-item v-for="item in gwList"
					:title="item.which=='0'?'承办科(室)意见':item.which=='1'?'办公室意见':item.which=='2'?'分管领导意见':item.which=='3'?'主要领导意见':'待归档'"
					:desc="item.nextTruename">
				</u-steps-item>
			</u-steps>
		</view>
		<view class="info_footer">
			
		</view>
	</view>
</template>

<script>
	import commonCard from "./commonCard.vue"
	import yzCirculationCardService from '@/api/commonseal/yzCirculationCardService.js'
	import yzFlowService from '@/api/commonseal/yzFlowService.js'
	export default {
		onLoad(option) {
			this.gwId = option.id
		},
		components: {
			commonCard,
		},
		data() {
			return {
				isSuspend: false,
				gwId: '',
				downList: [],
				gwList: [],
				current: 0,
				inputForm: {},
			}
		},
		mounted() {
			yzFlowService.queryByYzId(this.gwId).then(data => {
				data.sort((a, b) => a.createTime.localeCompare(b.createTime) || a.createTime
					.localeCompare(b.createTime));
				this.inputForm = data[0]
				data.forEach(item => {
					if (item.which == "5") this.isSuspend = true;
					if (item.state == 0) {
						this.downList.push(item)
					} else {
						this.gwList.push(item)
					}
				})
				this.downList.sort((a, b) => a.updateTime.localeCompare(b.updateTime) || a.updateTime
					.localeCompare(b.updateTime));
				this.current = this.downList.length + 1
			})
		}
	}
</script>

<style>
	.page_main {
		width: 100%;
		background-color: #fefefe;
	}

	.info_main {
		margin: 20px;
	}
	.info_footer {
		width: 100%;
		height: 20px;
	}
</style>