import { View, Text, Image, Swiper, SwiperItem } from "@tarojs/components";
import React, { useState } from "react";
import Taro, { useLoad } from "@tarojs/taro";
import "./index.scss";
import rightArrow from "../../assets/image/index/right-arrow.png";
import png1 from "../../assets/image/index/1.png";
import png2 from "../../assets/image/index/2.png";
import png3 from "../../assets/image/index/3.png";
import png4 from "../../assets/image/index/4.png";
import png5 from "../../assets/image/index/5.png";
import png6 from "../../assets/image/index/6.png";
import png7 from "../../assets/image/index/7.png";
import png8 from "../../assets/image/index/8.png";
import png9 from "../../assets/image/index/9.png";
import png10 from "../../assets/image/index/10.png";
import png11 from "../../assets/image/index/11.png";
import png12 from "../../assets/image/index/12.png";
import png13 from "../../assets/image/index/13.png";
import png14 from "../../assets/image/index/14.png";
import png15 from "../../assets/image/index/15.png";
import png16 from "../../assets/image/index/16.png";
import png17 from "../../assets/image/index/17.png";
import png18 from "../../assets/image/index/18.png";
import png19 from "../../assets/image/index/19.png";
import png20 from "../../assets/image/index/20.png";
import png21 from "../../assets/image/index/21.png";
import png22 from "../../assets/image/index/22.png";
import png23 from "../../assets/image/index/23.png";
import png24 from "../../assets/image/index/24.png";
import png25 from "../../assets/image/index/25.png";
import png26 from "../../assets/image/index/26.png";
import png27 from "../../assets/image/index/27.png";
import png28 from "../../assets/image/index/28.png";
import png29 from "../../assets/image/index/29.png";
import png30 from "../../assets/image/index/30.png";
import png31 from "../../assets/image/index/30.png";
import png32 from "../../assets/image/index/30.png";
import { getHeight, commonAuth } from "../../utils/tool";
export default function Index() {
const { barHeight, height, top } = getHeight();
useLoad(() => {
console.log("Page loaded.");
});
const [index, setIndex] = useState(0);
const navChane = (e) => {
console.log(e, "e");
setIndex(e.detail.current);
};
const navHandle = (e) => {
switch (e) {
case 1:
// Taro.navigateTo({
// url: '/operation/pages/admissionCertificate/index',
// });
Taro.navigateTo({
url: "/protection/pages/nearField/index",
});
break;
case 2:
Taro.navigateTo({
url: "/operation/pages/scanPark/index",
});
break;
case 3:
Taro.navigateTo({
url: "/operation/pages/carManage/index",
});
break;
case 4:
Taro.navigateTo({
url: "/operation/pages/driverManage/index",
});
break;
case 5:
Taro.navigateTo({
url: "/protection/pages/warnningStatus/index",
});
break;
case 6:
Taro.navigateTo({
url: "/protection/pages/overNightCar/index",
});
break;
case 7:
Taro.navigateTo({
url: "/protection/pages/visitorInvite/index",
});
break;
case 8:
Taro.navigateTo({
url: "/protection/pages/visitorRegistration/index",
});
break;
case 9:
Taro.navigateTo({
url: "/protection/pages/visitorStatus/index",
});
break;
case 10:
Taro.navigateTo({
url: "/protection/pages/serviceApplication/index",
});
break;
case 11:
Taro.navigateTo({
url: "/protection/pages/serviceApply/index",
});
break;
case 12:
Taro.navigateTo({
url: "/protection/pages/nightPatrol/index",
});
break;
case 13:
Taro.navigateTo({
url: "/protection/pages/problemReport/index",
});
break;
case 14:
Taro.navigateTo({
url: "/maintenance/pages/maintenanceTask/index",
});
break;
case 15:
Taro.navigateTo({
url: "/maintenance/pages/patrol/index",
});
break;
case 16:
Taro.navigateTo({
url: "/maintenance/pages/maintenanceTaskCheck/index",
});
break;
case 17:
Taro.navigateTo({
url: "/maintenance/pages/cm/index",
});
break;
case 18:
Taro.navigateTo({
url: "/maintenance/pages/cmCheck/index",
});
break;
case 19:
Taro.navigateTo({
url: "/maintenance/pages/knowledge/index",
});
break;
case 20:
Taro.navigateTo({
url: "/operation/pages/decorate/index",
});
break;
}
};
const toDetail = () => {
Taro.navigateTo({
url: "/protection/pages/notificationDetail/index",
});
};
const seeMore = () => {
Taro.navigateTo({
url: "/protection/pages/notification/index",
});
};
return (
<View className="index">
<View
className="index-title"
style={{
position: "fixed",
top: barHeight + top,
height: height,
left: "50%",
transform: "translateX(-50%)",
}}
>
烽火园区综合管理平台
</View>
{/* <button
onClick={() =>
commonAuth("scope.userLocation").then((res) => {
console.log(res, "res");
})
}
>
测试授权
</button> */}
<View
className="swiper-box"
style={{
marginTop: barHeight + top + height + 18,
}}
>
<Swiper
className="swiper"
indicatorColor="#999"
indicatorActiveColor="#333"
vertical={false}
circular
indicatorDots={false}
autoplay
>
<SwiperItem>
<Image src={""} className="banner" mode="widthFix"></Image>
</SwiperItem>
<SwiperItem>
<Image src={""} className="banner"></Image>
</SwiperItem>
<SwiperItem>
<Image src={""} className="banner"></Image>
</SwiperItem>
</Swiper>
</View>
<View className="content-box">
<Swiper className="swiper-nav" current={index} onChange={navChane}>
<SwiperItem>
<View className="scroll-box">
<View
className="scroll-item"
onClick={() => {
navHandle(1);
}}
>
<Image src={png1} className="icon"></Image>
<Text>入园凭证</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(2);
}}
>
<Image src={png2} className="icon"></Image>
<Text>扫码出入园</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(3);
}}
>
<Image src={png3} className="icon"></Image>
<Text>车辆管理</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(4);
}}
>
<Image src={png4} className="icon"></Image>
<Text>司机管理</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(5);
}}
>
<Image src={png5} className="icon"></Image>
<Text>告警处置</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(6);
}}
>
<Image src={png6} className="icon"></Image>
<Text>过夜车登记</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(7);
}}
>
<Image src={png7} className="icon"></Image>
<Text>访客邀请</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(8);
}}
>
<Image src={png8} className="icon"></Image>
<Text>访客登记</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(9);
}}
>
<Image src={png9} className="icon"></Image>
<Text>访客审批</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(10);
}}
>
<Image src={png10} className="icon"></Image>
<Text>服务申请</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(11);
}}
>
<Image src={png11} className="icon"></Image>
<Text>服务审批</Text>
</View>
<View
className="scroll-item"
onTap={() => {
navHandle(12);
}}
>
<Image src={png12} className="icon"></Image>
<Text>巡更任务</Text>
</View>
</View>
</SwiperItem>
<SwiperItem>
<View className="scroll-box">
<View
className="scroll-item"
onTap={() => {
navHandle(13);
}}
>
<Image src={png13} className="icon"></Image>
<Text>问题上报</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(14);
}}
>
<Image src={png14} className="icon"></Image>
<Text>保养任务</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(16);
}}
>
<Image src={png16} className="icon"></Image>
<Text>保养任务验收</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(15);
}}
>
<Image src={png15} className="icon"></Image>
<Text>巡检任务</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(17);
}}
>
<Image src={png17} className="icon"></Image>
<Text>故障维修</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(18);
}}
>
<Image src={png18} className="icon"></Image>
<Text>故障维修验收</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(19);
}}
>
<Image src={png19} className="icon"></Image>
<Text>运维知识库</Text>
</View>
<View
className="scroll-item"
onClick={() => {
navHandle(20);
}}
>
<Image src={png20} className="icon"></Image>
<Text>装修申请</Text>
</View>
</View>
</SwiperItem>
</Swiper>
<View className={index == 0 ? "progress-one" : "progress-two"}></View>
</View>
<View className="message-box">
<View className="message-header">
<View className="message-title">消息通知</View>
<View className="message-seemore" onTap={seeMore}>
查看更多
<Image src={rightArrow} className="seemore"></Image>
</View>
</View>
<View className="message-item" onTap={toDetail}>
<View className="message-item-left">
<View className="message-item-sign">通知</View>
<View className="message-item-title">一条XXXXXX通知…</View>
</View>
<View className="message-item-time">2025-03-11 14:15</View>
</View>
<View className="message-item">
<View className="message-item-left">
<View className="message-item-attention">消息</View>
<View className="message-item-title">一条XXXXXX消息待…</View>
</View>
<View className="message-item-time">2025-03-11 14:15</View>
</View>
<View className="message-item">
<View className="message-item-left">
<View className="message-item-wait">待办</View>
<View className="message-item-title">一条XXXXXX消息待…</View>
</View>
<View className="message-item-time">2025-03-11 14:15</View>
</View>
</View>
</View>
);
}
顶部图标第一页，若只有2排，显示起来布局就乱了
扫一扫
30万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
