xunjian_app/components/slectdicsk/index.vue

<template>
	<navigator hover-class="none" :url="prourl" class="u-border-top  u-flex mes-block">
		<!-- <u-circle-progress  border-width="18" active-color="#2979ff" :percent="parobj.finishNum/parobj.pointNum">
			<view class="u-progress-content">
				<view class="u-progress-dot"></view>
				<text class='u-progress-info'>{{(parobj.finishNum/parobj.pointNum)*100}}% </text>
			</view>
		
		</u-circle-progress> -->
		<cyuan :percent="Math.round(parobj.completed/parobj.total)" />
		<view class="u-m-l-14">
			<view class="mes-rig-tile  u-f-30">{{parobj.name}}</view>
			<view  class="mes-rig-blue u-m-t-24">任务日期：{{beginTime.slice(0,10)}}</view>
			<view class="u-flex u-m-t-28">
				<view class="mes-rig-blue  u-m-r-18">开始时间：{{beginTime.slice(10,-3)}}</view>
				<view class="">
					<u-tag :type="parobj.status==1?'primary':parobj.status==2?'warning':'error' "
						:text="status[parobj.status]" size="mini" mode="dark" />
				</view>
			</view>
			<view class="mes-rig-blue u-m-t-28">截至时间：{{endTime.slice(10,-3)}}</view>
			<view class="mes-rig-blue u-m-t-28">今日巡检：{{`${parobj.completed}/${parobj.total}`}}</view>
			<!-- <view class="mes-rig-grey u-m-t-14">计划巡查：50</view> -->
		</view>
		<view class="u-absolute " style="right: 15rpx">
			<u-icon name="arrow-right" color="rgba(229, 229, 229, 1)" size="40"></u-icon>
		</view>
	</navigator>
</template>

<script>
	import dayjs from "dayjs";
	import cyuan from '../c-yuan/index.vue'
	export default {
		props: {
			prourl: {
				type: String
			},
			parobj: {
				type: Object,

			}
		},
		components: {
			cyuan
		},
		data() {
			return {
				status: ["", '未开始', '进行中', '已结束',"超时漏检","超时完成"]
			}
		},
		created() {
		},
		computed:{
			beginTime(){
				return dayjs(this.parobj.beginTime).format("YYYY-MM-DD HH:mm:ss")
			},
			endTime(){
				return dayjs(this.parobj.endTime).format("YYYY-MM-DD HH:mm:ss")
			}
		}
	}
</script>

<style lang="scss">
	.mes-block {
		padding: 34rpx;
		padding-bottom: 8rpx;
		text-align: left;
		font-size: 28rpx;

		.mes-rig-tile {
			font-size: 30rpx;
			font-family: Microsoft YaHei-3970(82674968);
			font-weight: 400;
			color: #333333;
		}

		.mes-rig-blue {
			font-size: 26rpx;
			font-family: Microsoft YaHei-3970(82674968);
			font-weight: 400;
			color: #999999;
		}

		.mes-rig-grey {
			color: rgba(128, 128, 128, 1);
		}

		.u-progress-info {
			font-size: 36rpx;
			font-family: Microsoft YaHei-3970(82674968);
			font-weight: 400;
			color: #4A8BFF;
		}
	}
</style>