factory_mp_old/pages/home/home.vue

<template>
	<view>
		<!-- <view :style="{background: 'url('+imageURL+')'}">
		</view> -->
		<view>
			<u-image :src="imageURL" mode="scaleToFill" height="300rpx"></u-image>
<!-- 			style="background-color: #2581e4;font-weight: bold;font-size: 30rpx;color:white;padding-left:8rpx" -->
			<view class="welcome">
				<span style="font-size: 40rpx;color:#2581e4;margin-left:4rpx">欢迎您:</span>
				<span style="font-size: 40rpx;color:darkblue;margin-left: 4rpx;">{{vuex_user.name}}</span>
			</view>
		</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-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" color="#2b85e4" size="80"></u-icon>
				<view class="grid-text">{{item.name}}</view>
			</u-grid-item>
		</u-grid>
		</view>
		<u-card title="事件通知" margin="4rpx">
		</u-card>
		<!-- <view style="margin-bottom: 12rpx;margin-left: 6rpx;" v-if="myinspecttaskList.length>0">
		<u-section title="最近任务" :right="false" ></u-section>
		</view>
		<u-card v-for="(item, index) in myinspecttaskList" v-bind:key="index" :title="item.name" margin="12rpx"
			:border="false" :foot-border-top="false" border-radius="8rpx" :head-style="headstyle"
			@body-click="taskClick" :index="item.id" padding="10">
			<view class="" slot="body">
				<view class="u-body-item-title">
					<span class="itemstate">{{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:darkblue;">{{item.depts_count}}</span>家
					巡查组:
					<span style="color:darkblue;">{{item.members.length}}</span>人
				</view>
			</view>
		</u-card> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imageURL: '/static/banner3.jpg',
				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: '/pages/document/index',
					}
				],
				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;
		}
	}
	.itemstate {
		color:$u-type-primary-dark;
		font-weight: bold;
		margin-right: 8rpx;
	}
	.welcome{
	    display: flex;
	    align-items: center;
		height: 60rpx;
	}
</style>