jsy-app/pages/irrigation/details/taskdetails.vue

<template>
	<!-- 顶部导航栏 -->
	<custom-nav-bar :left="true" leftText="" @leftClick="" title="任务详情"></custom-nav-bar>

	<view class="card">
		<uni-collapse>
			<uni-collapse-item title-border="none" :border="false" :show-arrow="false" :open="true">
				<template v-slot:title>
					<view class="cards-title">
						<view>
							<view class="text">任务名称：006</view>
						</view>
						<view class="title-r">
							<uni-tag class="bg-green" :circle="true" text="轮灌中" />
						</view>
					</view>
				</template>
				<view class="content">
					<view class="cards-content">
						<view class="txt-list" @click="irrigationdetails">
							<view class="list1">
								<view><text>轮灌方案：</text>全设备</view>
								<view><text>起始组：</text>外部程曦</view>
								<view><text>开始时间：</text>2025-01-05&nbsp;&nbsp;10:11</view>
								<view><text>结束时间：</text>2025-01-05&nbsp;&nbsp;10:11</view>
								<view><text>是否调压：</text>是</view>
							</view>
							<view class="right">
								<view class="iconfont icon-you">
								</view>
							</view>
						</view>
					</view>
				</view>
			</uni-collapse-item>
		</uni-collapse>
	</view>
	<view class="flex-btn">
		<uni-grid :column="4" :showBorder="false" :square="false">
			<uni-grid-item>
				<view class="iconfont icon-zz"></view>
				<text class="text">终止</text>
			</uni-grid-item>
			<uni-grid-item>
				<view class="iconfont icon-zanting"></view>
				<text class="text">暂停</text>
			</uni-grid-item>
			<uni-grid-item>
				<view class="iconfont icon-jixu"></view>
				<text class="text">继续</text>
			</uni-grid-item>  
			<uni-grid-item @click="irrigationdetails">
				<view class="iconfont icon-xiangqing"></view>
				<text class="text">详情</text>
			</uni-grid-item>
		</uni-grid>
	</view>
</template>

<script>
	export default {

		methods: {

			// 页面跳转
			irrigationdetails() {
				uni.navigateTo({
					url: '/pages/irrigation/details/irrigationdetails'
				});
			}
		},

	};
</script>

<style lang="scss" scoped>
	.flex-btn {width: 90%;
		position: fixed;
		bottom: 10px;
		left: 5%;
		background-color: #fff;
		border-radius: 10px;
		box-shadow: 0 1px 9px rgb(209, 209, 209, 0.5);
		text-align: center;
		padding: 10px 0;
	}
	.uni-grid-item__box .iconfont{color: #39ac4f;font-size: 2.3rem;}
</style>