hs_hzl_uniapp_ml/pages/task/index.vue

<template>
	<view>
		<view class="u-demo-block">
			<view>
				<view class="taskType uni-list-cell taskType-new" @click="isNewTaskShow">
					<view class="uni-list-cell-left">
						新任务
					</view>
					<view>
						<u-icon v-if="newTaskShow" name="arrow-down"></u-icon>
						<u-icon v-if="!newTaskShow" name="arrow-right"></u-icon>
					</view>
				</view>
				<view v-if="newTaskShow" v-for="item in data" style="padding: 0 10px;">
					<view v-if="item.taskStatus === 1"
						style="border-radius: 10px;padding: 15px; margin: 5px;background-color: #ffffff;"
						@click="toDetails(item.yqTaskId)">
						<view v-if="item.isRead === 0" style="position: absolute;right: 10px;">
							<view>
								<u-tag type="error" text="新任务"> </u-tag>
							</view>
						</view>
						<u-row style="margin-bottom: 5px;">
							<u-col>
								<u-text size="18" :text="item.taskNo+'：'+item.taskTitle" bold></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="地点："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.taskAddress"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="开始："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.planStartTime"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="结束："></u-text>
							</u-col>
							<u-col span="7">
								<u-text :text="item.planEndTime"></u-text>
							</u-col>
							<u-tag plain plainFill v-if="item.taskStatus == 5" text="进行中"></u-tag>
							<u-tag plain plainFill v-if="item.taskStatus == 1" text="未开始"></u-tag>
							<u-tag type="success" plain plainFill v-if="item.taskStatus == 2" text="已结束"></u-tag>
							<u-tag type="warning" plain plainFill v-if="item.taskStatus==3" text="暂停"></u-tag>
							<u-tag type="error" plain plainFill v-if="item.taskStatus == 4" text="异常"></u-tag>
						</u-row>
					</view>
				</view>
			</view>
			<view>
				<view class="taskType uni-list-cell taskType-beBing" @click="isBeBeingTaskShowTaskShow">
					<view class="uni-list-cell-left">
						进行中
					</view>
					<view>
						<u-icon v-if="beBeingTaskShow" name="arrow-down"></u-icon>
						<u-icon v-if="!beBeingTaskShow" name="arrow-right"></u-icon>
					</view>
				</view>
				<view v-if="beBeingTaskShow" v-for="item in data" style="padding: 0 10px;">
					<view v-if="item.taskStatus === 5"
						style="border-radius: 10px;padding: 15px; margin: 5px;background-color: #ffffff;"
						@click="toDetails(item.yqTaskId)">
						<u-row style="margin-bottom: 5px;">
							<u-col>
								<u-text size="18" :text="item.taskNo+'：'+item.taskTitle" bold></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="地点："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.taskAddress"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="开始："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.planStartTime"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="结束："></u-text>
							</u-col>
							<u-col span="7">
								<u-text :text="item.planEndTime"></u-text>
							</u-col>
							<u-tag plain plainFill v-if="item.taskStatus == 5" text="进行中"></u-tag>
							<u-tag plain plainFill v-if="item.taskStatus == 1" text="未开始"></u-tag>
							<u-tag type="success" plain plainFill v-if="item.taskStatus == 2" text="已结束"></u-tag>
							<u-tag type="warning" plain plainFill v-if="item.taskStatus==3" text="暂停"></u-tag>
							<u-tag type="error" plain plainFill v-if="item.taskStatus == 4" text="异常"></u-tag>
						</u-row>
					</view>
				</view>
			</view>
			<view>
				<view class="taskType uni-list-cell taskType-end" @click="isEndTaskShowTaskShow">
					<view class="uni-list-cell-left">
						已结束
					</view>
					<view>
						<u-icon v-if="endTaskShow" name="arrow-down"></u-icon>
						<u-icon v-if="!endTaskShow" name="arrow-right"></u-icon>
					</view>
				</view>
				<view v-if="endTaskShow" v-for="item in data" style="padding: 0 10px;">
					<view v-if="item.taskStatus === 2"
						style="border-radius: 10px;padding: 15px; margin: 5px;background-color: #ffffff;"
						@click="toDetails(item.yqTaskId)">
						<u-row style="margin-bottom: 5px;">
							<u-col>
								<u-text size="18" :text="item.taskNo+'：'+item.taskTitle" bold></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="地点："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.taskAddress"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="开始："></u-text>
							</u-col>
							<u-col span="6">
								<u-text :text="item.planStartTime"></u-text>
							</u-col>
						</u-row>
						<u-row>
							<u-col span="2">
								<u-text text="结束："></u-text>
							</u-col>
							<u-col span="7">
								<u-text :text="item.planEndTime"></u-text>
							</u-col>
							<u-tag plain plainFill v-if="item.taskStatus == 5" text="进行中"></u-tag>
							<u-tag plain plainFill v-if="item.taskStatus == 1" text="未开始"></u-tag>
							<u-tag type="success" plain plainFill v-if="item.taskStatus == 2" text="已结束"></u-tag>
							<u-tag type="warning" plain plainFill v-if="item.taskStatus==3" text="暂停"></u-tag>
							<u-tag type="error" plain plainFill v-if="item.taskStatus == 4" text="异常"></u-tag>
						</u-row>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				data: [],
				newTaskShow: false,
				beBeingTaskShow: false,
				endTaskShow: false,

			}
		},
		onShow() {
			this.getNotRead()
		},
		onHide() {

		},
		methods: {
			isNewTaskShow() {
				if (this.newTaskShow) {
					this.newTaskShow = false
				} else {
					this.newTaskShow = true
				}
			},
			isBeBeingTaskShowTaskShow() {
				if (this.beBeingTaskShow) {
					this.beBeingTaskShow = false
				} else {
					this.beBeingTaskShow = true
				}
			},
			isEndTaskShowTaskShow() {
				if (this.endTaskShow) {
					this.endTaskShow = false
				} else {
					this.endTaskShow = true
				}
			},
			async getNotRead() {
				const {
					data: res
				} = await this.$httpRequest({
					url: '/api/yq/readTask/?userNo=' + uni.getStorageSync("setUserName") +
						"&orgNo=" + uni.getStorageSync("orgInfo").organizationCode,
					method: 'get',
				})
				if (res.code == 200) {
					const data = res.data
					console.log(data)
					const count = data.count
					if (0 == count) {
						uni.removeTabBarBadge({
							index: 1
						})
					} else {
						uni.setTabBarBadge({
							index: 1,
							text: count + ""
						})
					}
					this.data = data.data

				} else {
					uni.showToast({
						icon: 'none',
						title: res.msg
					})
				}
			},
			toDetails(taskId) {
				uni.setStorageSync("taskId", taskId)
				this.$goto('details')
			}
		}
	}
</script>

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

	.taskType {
		padding: 10px;
		font-size: 18px;
		border-bottom: 1px solid #dedede;
		border-top: 1px solid #dedede;
		background-color: #ffffff;
	}

	.taskType-new {
		background-color: #ffffff;
	}

	.taskType-beBing {
		background-color: #ffffff;
	}

	.taskType-end {
		background-color: #ffffff;
	}
</style>