pika_shangjia/warning/userAlarm/userAlarm.vue

<template>
	<view>
		<view class="order-item" v-for="item,index in 10" @click="openPop(item)">
			<view class="ddflex order-item-header">
				<view class="order-time">2023-03-29 12:05:58</view>
				<block>
					<view v-if="index!=1" class="order-state">待处理</view>
					<view v-else class="order-state" style="color: #0FCB27;border: 2rpx solid #0FCB27;">已处理</view>
				</block>
			</view>
			<view class="order-item-body">
				<view class="order-item-content ddflex">
					<view class="order-item-content-label">机柜编号</view>
					<view class="order-item-content-data fflex tover">CHZD04TTCC200329109</view>
				</view>
				<view class="order-item-content ddflex">
					<view class="order-item-content-label">电池ID</view>
					<view class="order-item-content-data fflex tover">613880983244</view>
				</view>
				<view class="order-item-content ddflex">
					<view class="order-item-content-label">报障问题</view>
					<view class="order-item-content-data fflex tover">电池断电</view>
				</view>
			</view>
			<view class="order-item-body2">
				<view class="order-item-content-label">问题补充描述</view>
				<view class="order-item-content ddflex" style="font-size: 24rpx;font-weight: 400;">
					电池充不进去电，一开始可以充进去，不到5分钟就没电了，但是电量显示还有80%的电。
				</view>
				<view class="images-box ddflex">
					<image class="images" v-for="item in 3"></image>
				</view>
			</view>
		</view>
		
		<bottom-pop v-if="showPop" :showPop='showPop' :btnColor="'#11BB8B'" :showBtn='false' title="解除提醒"
			@closePop="closePop()" @popSubmit="popSubmit()">
			<view>
				<view>
					<image class="nodata-icon" src="../../static/pages/images/user_service1.png"></image>
					<view class="nodata-note">上传检修记录，恢复正常</view>
				</view>
				<view class="pop-btns ddflex">
					<view class="btn" @click="closePop">取消</view>
					<view class="btn2" @click="jumpUrl('warning/userAlarmUpload/userAlarmUpload')">上传检修记录</view>
				</view>
			</view>
		</bottom-pop>
		
	</view>
</template>

<script>
	const app = getApp();
	const req = require("../../utils/request.js");
	import bottomPop from "../../components/bottom-pop/index";
	export default {
		components: {
			bottomPop
		},
		props: {},
		data() {
			return {
				systems: {},
				isTop:0,
				
				showPop: false,
				tempData: null,
			}
		},
		onLoad(options) {

		},
		onShow() {
			
		},
		methods: {
			jumpUrl(url) {
				if (!req.isLogin()) return false;
				app.globalData.navigateTo(url);
			},
			// 弹窗弹出
			openPop(item) {
				this.tempData = JSON.parse(JSON.stringify(item))
				this.showPop = true
			},
			// 弹窗关闭
			closePop() {
				this.showPop = false
				this.tempData = null
			},
			// 弹窗确认
			popSubmit() {
				this.closePop()
			},
		},
		mounted() {
			const systemInfo = uni.getSystemInfoSync();
			// px转换到rpx的比例
			let pxToRpxScale = 750 / systemInfo.windowWidth;
			let systems = {
				ktxStatusHeight: systemInfo.statusBarHeight * pxToRpxScale, // 状态栏的高度
				navigationHeight: 44 * pxToRpxScale // 导航栏的高度
			};
			systems.barHeight = systems.ktxStatusHeight + systems.navigationHeight;
			this.systems = systems;
		},
		onPageScroll: function(e) {
			if (e.scrollTop > this.systems.barHeight) {
				this.isTop = 1;
			} else {
				this.isTop = 0;
			}
		}
	}
</script>

<style>
	@import "./userAlarm.css";
</style>