<template>
	<view>
		<u-swiper @change="change" :height="250" :list="swiper_list" :title="swtitle" :effect3d="effect3d"
			:indicator-pos="indicatorPos" :mode="mode" :interval="3000" @click="click"></u-swiper>
		<view style="margin-top:12rpx;margin-bottom: 12rpx;">
		<u-grid :col="3" :border="false">
			<u-grid-item v-for="(item, index) in grids" v-bind:key="index" @click="clickGrid(item)">
				<u-icon :name="item.icon" :size="60"></u-icon>
				<view class="grid-text">{{item.name}}</view>
			</u-grid-item>
		</u-grid>
		</view>
		<view style="margin-bottom: 12rpx;margin-left: 6rpx;">
		<u-section title="最近任务" :right="false" ></u-section>
		</view>
		<u-card v-for="(item, index) in myinspecttaskList" v-bind:key="index" :title="item.name" margin="6rpx"
			:border="false" :foot-border-top="false" border-radius="2rpx" :head-style="headstyle"
			@body-click="taskClick" :index="item.id" padding="10">
			<view class="" slot="body">
				<view class="u-body-item-title">
					<span style="color:#2979FF;font-weight: bold;margin-right: 8rpx;">{{item.state}}</span>
					{{item.name}}
				</view>
				<view class="u-body-item">
					所属任务:
					<span>{{item.inspecttask_.name}}</span>
				</view>
				<view class="u-body-item">
					检查期限:
					<span>{{item.inspecttask_.start_date}}</span>至
					<span>{{item.inspecttask_.end_date}}</span>
				</view>
				<view class="u-body-item">
					涉及单位:
					<span style="color:blue;">{{item.depts_count}}</span>家
					巡查组:
					<span style="color:blue;">{{item.members.length}}</span>人
				</view>
			</view>
		</u-card>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				swiper_list: [{
						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
						title: '昨夜星辰昨夜风，画楼西畔桂堂东'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
						title: '身无彩凤双飞翼，心有灵犀一点通'
					},
					{
						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
						title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
					}
				],
				swtitle: false,
				mode: 'round',
				indicatorPos: 'bottomCenter',
				effect3d: true,
				test: '',
				myinspecttaskList: [],
				grids: [{
						name: '巡查任务',
						icon: 'calendar',
						path: '/pages/subtask/my',
					},
					{
						name: '能力共享',
						icon: 'share',
						path: '',
					},
					{
						name: '手册/资料',
						icon: 'file-text',
						path: '',
					}
				],
				headstyle: {
					"padding-top": "12rpx",
					"padding-bottom": "12rpx"
				}
			}
		},
		computed: {
			getIcon() {
				return path => {
					return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
				}
			},
		},
		onLoad() {

		},
		onShow() {
			this.getMyInspectTaskList();
		},
		methods: {
			getMyInspectTaskList() {
				this.$u.api.getMyInspectTaskList({
					state: '执行中'
				}).then(res => {
					this.myinspecttaskList = res.data
				}).catch(e => {
					uni.reLaunch({
						url:'/pages/login/login'
					})
				})
			},
			openPage(path) {
				this.$u.route({
					url: path
				})
			},
			change() {

			},
			click() {

			},
			taskClick(index) {
				uni.navigateTo({
					url:"/pages/subtask/subtaskdetail?id="+index
				})
			},
			clickGrid(val){
				if(val.path){
					uni.navigateTo({
						url:val.path
					})
				}else{
					uni.showToast({
						title:"暂未开放",
						icon:"none"
					})
				}
				
			}
		}
	}
</script>

<style>
	page{
		background-color: #ededed;
	}
</style>

<style lang="scss" scoped>
	.u-body-item-title {
		font-size: 32rpx;
		color: #333;
	}

	.u-body-item {
		margin-top: 4rpx;
		span {
			color: #333;
		}
	}
</style>
