diff --git a/project.private.config.json b/project.private.config.json
index 437849d3e9a0e825ab6a0e70e580770ec63176de..e02e33c8324a8d4fe6cdc805a42bf21c0c46d4ee 100644
--- a/project.private.config.json
+++ b/project.private.config.json
@@ -126,6 +126,27 @@
           "query": "",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "",
+          "pathName": "pages/User/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "",
+          "pathName": "pages/Event/index",
+          "query": "type=take",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "",
+          "pathName": "pages/Event/view/detail/index",
+          "query": "caseId=1816703553093496832",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }
diff --git a/src/app.config.ts b/src/app.config.ts
index c274639cacc087d068c24c6c3069d2d6a859c03b..51f6a8f4cc18793a36f0a3ca5fd715cc1cd4244c 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -56,11 +56,13 @@ export default defineAppConfig({
     {
       root: "pages/Event",
       pages: [
-        "view/cameraComp/index",
-        "view/miniAiIdentify/index",
-        "view/confirmLocation/index",
-        "view/autoDispatch/index",
-        "view/orderDirect/index",
+        "index",//事件列表
+        "view/cameraComp/index",//拍照页
+        "view/miniAiIdentify/index",//极简上报（AI识别）
+        "view/confirmLocation/index",//确认位置
+        "view/autoDispatch/index",//自动派遣
+        "view/orderDirect/index",//单兵直达
+        "view/detail/index",//事件详情
       ],
     },
   ],
diff --git a/src/assets/images/event/blackMap.png b/src/assets/images/event/blackMap.png
new file mode 100644
index 0000000000000000000000000000000000000000..933f3988d74148b31afd736331391e1fed7f1701
Binary files /dev/null and b/src/assets/images/event/blackMap.png differ
diff --git a/src/assets/images/event/done.png b/src/assets/images/event/done.png
new file mode 100644
index 0000000000000000000000000000000000000000..14bd9518de30809e9d89701badfd6160c49adad7
Binary files /dev/null and b/src/assets/images/event/done.png differ
diff --git a/src/assets/images/event/halo.png b/src/assets/images/event/halo.png
new file mode 100644
index 0000000000000000000000000000000000000000..85feffd8b90635cb3311b1d6c5ab8c93b97f2be2
Binary files /dev/null and b/src/assets/images/event/halo.png differ
diff --git a/src/assets/images/event/map.png b/src/assets/images/event/map.png
new file mode 100644
index 0000000000000000000000000000000000000000..96ef4ae96ae85f873a74a01fe5f3508840e56766
Binary files /dev/null and b/src/assets/images/event/map.png differ
diff --git a/src/assets/images/event/right.png b/src/assets/images/event/right.png
new file mode 100644
index 0000000000000000000000000000000000000000..2122a7619828de7f1dab070674a3ede09daec272
Binary files /dev/null and b/src/assets/images/event/right.png differ
diff --git a/src/assets/images/event/time.png b/src/assets/images/event/time.png
new file mode 100644
index 0000000000000000000000000000000000000000..eaa0ff360cf216b737987175a177b06e761294f3
Binary files /dev/null and b/src/assets/images/event/time.png differ
diff --git a/src/assets/images/event/warn.png b/src/assets/images/event/warn.png
new file mode 100644
index 0000000000000000000000000000000000000000..582a2e41d0c61a19d7d6c534a958cd25656123b0
Binary files /dev/null and b/src/assets/images/event/warn.png differ
diff --git a/src/pages/Event/component/EventList/index.less b/src/pages/Event/component/EventList/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..3c61d8c18349442e1b5af9a01892605b455ed737
--- /dev/null
+++ b/src/pages/Event/component/EventList/index.less
@@ -0,0 +1,57 @@
+.scrollview{
+  width: 100%;
+  box-sizing: border-box;
+  padding: 40px;
+}
+.item {
+  width: 100%;
+  border-radius: 20px;
+  background: #fff;
+  padding: 40px;
+  margin-bottom: 30px;
+  box-sizing: border-box;
+}
+
+.top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 16px;
+
+  .name {
+    font-weight: bold;
+    font-size: 32px;
+    width: 75%;
+  }
+}
+
+.text {
+  display: flex;
+  align-items: center;
+  color: #7b8193;
+  line-height: 64px;
+  font-size: 30px;
+  .address{
+    display: inline-block;
+    width: 100%;
+  }
+}
+
+.pre-icon,
+.pre-icon1 {
+  width: 24px;
+  height: 24px;
+  margin-right: 12px;
+
+  &.pre-icon1 {
+    height: 30px;
+  }
+}
+
+
+.seat {
+  height: 280px;
+  font-size: 26px;
+  text-align: center;
+  color: #a8a7af;
+}
\ No newline at end of file
diff --git a/src/pages/Event/component/EventList/index.tsx b/src/pages/Event/component/EventList/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..06399efed3af420fecf056080d480bdfba5fd500
--- /dev/null
+++ b/src/pages/Event/component/EventList/index.tsx
@@ -0,0 +1,63 @@
+//事件列表
+import { ScrollView, View, Text, Image } from "@tarojs/components";
+import Taro from "@tarojs/taro";
+import ITag from "../ITag";
+import "./index.less";
+import map from "@/assets/images/event/map.png";
+import time from "@/assets/images/event/time.png";
+import { DiscoverEntryDto } from "@/store/report";
+interface EventListProps {
+  list: API.EventDto[];
+  noMoreText: string | undefined;
+  eventType: DiscoverEntryDto; //入口，随手拍显示状态，举手之劳不显示
+  onScrollToLower: () => void;
+}
+const EventList: React.FC<EventListProps> = ({
+  list = [],
+  noMoreText,
+  eventType,
+  onScrollToLower,
+}) => {
+  //进入案件详情
+  const handleToDetail = (caseId: string) => {
+    Taro.navigateTo({
+      url: "/pages/Event/view/detail/index?caseId=" + caseId,
+    });
+  };
+
+  return (
+    <ScrollView
+      className="scrollview"
+      style={{ height: "88vh" }}
+      scrollY
+      onScrollToLower={onScrollToLower}
+    >
+      <>
+        {list?.map((it) => (
+          <View
+            className="item"
+            key={it.id}
+            onClick={() => handleToDetail(it.id)}
+          >
+            <View className="top">
+              <Text className="name textellipsis">{it.standardEventTitle}</Text>
+              {eventType === "take" && (
+                <ITag title={it.caseStatusText} color={it.caseStatusColor} />
+              )}
+            </View>
+            <View className="text">
+              <Image src={map} className="pre-icon1" />
+              <Text className="textellipsis address">{it.address}</Text>
+            </View>
+            <View className="text">
+              <Image src={time} className="pre-icon" />
+              {it.reportTime}
+            </View>
+          </View>
+        ))}
+        {list.length > 10 && <View className="seat">{noMoreText}</View>}
+      </>
+    </ScrollView>
+  );
+};
+export default EventList;
diff --git a/src/pages/Event/component/ITag/index.less b/src/pages/Event/component/ITag/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..6d21845cccdfb03572cbed4ab463bf27c6db2e33
--- /dev/null
+++ b/src/pages/Event/component/ITag/index.less
@@ -0,0 +1,11 @@
+.tag {
+  display: inline-block;
+  width: 120px;
+  height: 56px;
+  text-align: center;
+  line-height: 56px;
+  border-radius: 60px;
+  font-size: 24px;
+  color: #fff;
+  background-color: #2fc7da;
+}
\ No newline at end of file
diff --git a/src/pages/Event/component/ITag/index.tsx b/src/pages/Event/component/ITag/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..3683bba6d6103001f7d1827279bbd3480589108c
--- /dev/null
+++ b/src/pages/Event/component/ITag/index.tsx
@@ -0,0 +1,18 @@
+//封装的tag
+import { Text } from '@tarojs/components';
+import { CSSProperties } from 'react';
+import './index.less';
+interface ITagProps {
+  title: string;
+  style?: CSSProperties;
+  color?: string; //颜色
+}
+function ITag({ title, color }: ITagProps) {
+  return (
+    <Text className="tag" style={{ background: color }}>
+      {title}
+    </Text>
+  );
+}
+
+export default ITag;
diff --git a/src/pages/Event/component/ITitle/index.less b/src/pages/Event/component/ITitle/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..bc08d2c9e4b157bf4dc3d9662e461be8742bd908
--- /dev/null
+++ b/src/pages/Event/component/ITitle/index.less
@@ -0,0 +1,9 @@
+.wrap-title{  
+  justify-content: space-between;
+  .title {
+    font-size:44px;
+    color: #333333;
+    font-weight: bold;
+  }
+   
+}
diff --git a/src/pages/Event/component/ITitle/index.tsx b/src/pages/Event/component/ITitle/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a1961598f9614a4a463dbd3110f1ab6ae63407a9
--- /dev/null
+++ b/src/pages/Event/component/ITitle/index.tsx
@@ -0,0 +1,19 @@
+//封装的标题
+import { View } from '@tarojs/components';
+import { CSSProperties, ReactNode } from 'react';
+import './index.less';
+interface ITitleProps {
+  title: string;
+  style?: CSSProperties;
+  rightExra?: ReactNode;
+}
+function ITitle({ title, style, rightExra }: ITitleProps) {
+  return (
+    <View className="wrap-title dflex" style={{ ...style }}>
+      <View className="title">{title}</View>
+      <View className='right'>{rightExra}</View>
+    </View>
+  );
+}
+
+export default ITitle;
diff --git a/src/pages/Event/component/LabelText/index.less b/src/pages/Event/component/LabelText/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..7a848419b2c763165a8100e51f9d544e48ad74a9
--- /dev/null
+++ b/src/pages/Event/component/LabelText/index.less
@@ -0,0 +1,19 @@
+.label-wrap {
+  width: 100%;
+  border-radius: 20px;
+  display: flex;
+  margin-top: 20px;
+  font-size: 28px;
+
+  .label {
+    color: #c3d7ff;
+  }
+
+  .value {
+    display: inline-block;
+    width: 340px;
+    word-wrap: break-word;
+    color: #fff; 
+    flex: 1;
+  }
+}
diff --git a/src/pages/Event/component/LabelText/index.tsx b/src/pages/Event/component/LabelText/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..867687fc0803c4f60782f94af85b6cff959af6b1
--- /dev/null
+++ b/src/pages/Event/component/LabelText/index.tsx
@@ -0,0 +1,20 @@
+//封装的LabelText
+import { View, Text } from '@tarojs/components';
+import './index.less';
+interface LabelTextProps {
+  label: string;
+  value: string | undefined;
+  labelColor?: string; //颜色
+}
+function LabelText({ label, value, labelColor }: LabelTextProps) {
+  return (
+    <View className="label-wrap">
+      <Text className="label" style={{ color: labelColor }}>
+        {label}：
+      </Text>
+      <Text className="value">{value}</Text>
+    </View>
+  );
+}
+
+export default LabelText;
diff --git a/src/pages/Event/index.config.ts b/src/pages/Event/index.config.ts
index 68494b6327d443619dd228eb9ebc648aee17000f..844b7bf232c5c8c613dd1a941789017636c93332 100644
--- a/src/pages/Event/index.config.ts
+++ b/src/pages/Event/index.config.ts
@@ -1,3 +1,4 @@
 export default definePageConfig({
-  navigationBarTitleText: "",
-});
+  navigationBarTitleText: '',
+  navigationBarBackgroundColor:'#e6ebfd', 
+})
diff --git a/src/pages/Event/index.less b/src/pages/Event/index.less
index c20c01e9c44cf72fbaa7f1563b5ebe47afcd9ef6..423b8b79dbc442779ddbbc2a5f5f5f66e51ef5d0 100644
--- a/src/pages/Event/index.less
+++ b/src/pages/Event/index.less
@@ -1,135 +1,9 @@
-.article-container {
-  padding: 0 32px;
-  font-family: "Georgia", serif;
-  line-height: 1.8;
-  color: #333;
-  min-height: 100%;
-  background-color: #f9f9f9;
-}
-
-/* 标题样式 */
-.h5-h1,
-.h5-h2,
-.h5-h3 {
-  font-family: "Merriweather", serif;
-  margin-bottom: 20px;
-  color: #2c3e50;
-}
-
-.h5-h1 {
-  font-size: 2.5rem;
-  border-bottom: 2px solid #2980b9;
-  padding-bottom: 10px;
-}
-
-.h5-h2 {
-  font-size: 2rem;
-  border-bottom: 1px solid #2980b9;
-  padding-bottom: 8px;
-}
-
-.h5-h3 {
-  font-size: 1.75rem;
-}
-
-/* 段落样式 */
-.h5-p {
-  margin-bottom: 20px;
-  text-align: justify;
-}
-
-/* 链接样式 */
-.h5-a {
-  color: #3498db;
-  text-decoration: none;
-  border-bottom: 1px dotted #3498db;
-}
-
-.h5-a:hover {
-  color: #2980b9;
-  border-bottom: 1px solid #2980b9;
-}
-
-/* 列表样式 */
-.h5-ul {
-  list-style-type: disc;
-  padding-left: 20px;
-  margin-bottom: 20px;
-}
-
-.h5-ol {
-  list-style-type: decimal;
-  padding-left: 20px;
-  margin-bottom: 20px;
-}
-
-.h5-li {
-  margin-bottom: 10px;
-}
-
-/* 引用块样式 */
-.h5-blockquote {
-  margin: 20px 0;
-  padding: 15px;
-  background-color: #ecf0f1;
-  border-left: 5px solid #3498db;
-  color: #7f8c8d;
-  font-style: italic;
-}
-
-/* 图片样式 */
-.h5-img {
-  max-width: 100%;
-  height: auto;
-  border-radius: 5px;
-  margin: 20px 0;
-}
-
-/* 表格样式 */
-.h5-table {
-  width: 100%;
-  border-collapse: collapse;
-  margin: 20px 0;
-}
-
-.h5-th,
-.h5-td {
-  border: 1px solid #ddd;
-  padding: 10px;
-}
-
-.h5-th {
-  background-color: #3498db;
-  color: white;
-}
-
-.h5-td {
-  background-color: #f9f9f9;
-}
-
-/* 强调样式 */
-.h5-strong {
-  font-weight: bold;
-  color: #2c3e50;
-}
-
-.h5-em {
-  font-style: italic;
-}
-
-/* 代码块样式 */
-.h5-pre {
-  background-color: #2c3e50;
-  color: #ecf0f1;
-  padding: 15px;
-  border-radius: 5px;
-  margin: 20px 0;
-  overflow-x: auto;
-}
-
-.h5-code {
-  background-color: #f9f9f9;
-  color: #e74c3c;
-  padding: 2px 4px;
-  border-radius: 3px;
+.wrap {
+  overflow: hidden;
+  height: 100vh;
+  background: #e6ebfd url('@/assets/images/event/halo.png') no-repeat;
+  background-size: 100% 40%;
+}
+.nut-empty {
+  background: transparent;
 }
diff --git a/src/pages/Event/index.tsx b/src/pages/Event/index.tsx
index 9d7b544ae34059f1d9ad76b084c7a1813a840387..7ee213c46cb8ea47e329f336d9b5ea28907c8fba 100644
--- a/src/pages/Event/index.tsx
+++ b/src/pages/Event/index.tsx
@@ -1,15 +1,70 @@
+//事件列表
 import { View } from "@tarojs/components";
-
+import { useEffect, useState } from "react";
+import EventList from "./component/EventList";
 import "./index.less";
+import ITitle from "./component/ITitle";
+import services from "@/services";
 import Taro from "@tarojs/taro";
-
-/** 文章详情 */
-export default function () {
+import Empty from "@/components/Empty";
+function MyEvent() {
   const params = Taro.getCurrentInstance().router?.params;
-
+  const [eventList, setEventList] = useState<API.EventListDto>({
+    //事件列表
+    items: [],
+    total: 0,
+    page: 1,
+    pages: 1,
+    noMoreText: "",
+  });
+  useEffect(() => {
+    queryEventList();
+  }, []);
+  //查询事件列表
+  const queryEventList = (page: number = 1, count: number = 10) => {
+    services.event
+      .postEventList({
+        page,
+        count,
+        eventType: params?.type === "take" ? 1 : 2,
+      })
+      .then((res) => {
+        let tableList =
+          page === 1 ? res.data.items : eventList.items.concat(res.data.items);
+        setEventList({
+          ...res.data,
+          items: tableList,
+          noMoreText: page == res.data.pages ? "没有更多数据了" : "加载中...",
+        });
+      });
+  };
+  //滚动触底
+  const onScrollToLower = () => {
+    if (eventList.hasNext) {
+      queryEventList(++eventList.page);
+    }
+  };
+  console.log(90, eventList);
   return (
-    <View className="article-container">
-      <View dangerouslySetInnerHTML={{ __html: params?.desc ?? "" }}></View>
+    <View className="wrap">
+      <ITitle
+        title={params?.type === "take" ? "我的随手拍" : "我的举手之劳"}
+        style={{ padding: "10px 15px 4px" }}
+      />
+      <>
+        {Number(eventList.total) === 0 ? (
+          <Empty />
+        ) : (
+          <EventList
+            list={eventList.items}
+            noMoreText={eventList.noMoreText}
+            onScrollToLower={onScrollToLower}
+            eventType={params?.type}
+          />
+        )}
+      </>
     </View>
   );
 }
+
+export default MyEvent;
diff --git a/src/pages/Event/view/confirmLocation/index.less b/src/pages/Event/view/confirmLocation/index.less
index f2a51f249ef533b330bfc9640ee279bd9bb13d27..f9b49108866edb7d9f01e1a87ed77ca414bcd131 100644
--- a/src/pages/Event/view/confirmLocation/index.less
+++ b/src/pages/Event/view/confirmLocation/index.less
@@ -1,4 +1,4 @@
-.wrap {
+.location-wrap {
   position: relative;
 
   .map-wrap {
diff --git a/src/pages/Event/view/confirmLocation/index.tsx b/src/pages/Event/view/confirmLocation/index.tsx
index cd6c285edd606a1f9a41651ca3c66f6d603fa5de..eaf42029c0bae6ecfdb64c7d6be490debbe32f62 100644
--- a/src/pages/Event/view/confirmLocation/index.tsx
+++ b/src/pages/Event/view/confirmLocation/index.tsx
@@ -132,7 +132,7 @@ function ConfirmLocation() {
     }
   };
   return (
-    <View className="wrap">
+    <View className="location-wrap">
       <Map
         id="myMap"
         longitude={marketPoint.longitude}
diff --git a/src/pages/Event/view/detail/index.config.ts b/src/pages/Event/view/detail/index.config.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d71a8872c0ae7c8930216c7550313d3599b6455d
--- /dev/null
+++ b/src/pages/Event/view/detail/index.config.ts
@@ -0,0 +1,4 @@
+export default definePageConfig({
+  navigationBarTitleText: '案件详情',
+  navigationBarBackgroundColor:'#e0e7fd'
+})
diff --git a/src/pages/Event/view/detail/index.less b/src/pages/Event/view/detail/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..539a6903647108843d863635e1fb942529b3998b
--- /dev/null
+++ b/src/pages/Event/view/detail/index.less
@@ -0,0 +1,202 @@
+.wrap {
+  padding: 36px;
+  height: 100vh;
+  overflow: auto;
+  background: linear-gradient(0deg, #f7f8fa 44%, #e0e7fd 100%);
+
+  .taroify-steps {
+    background: transparent;
+  }
+
+  .top-box {
+    width: 100%;
+    min-height: 540px;
+    background: url('https://xct.cdhncy.cn/file/zgf/2024/8/30/20248888888999.png') no-repeat;
+    background-size: 100% 100%;
+    padding: 40px;
+    color: #fff;
+
+    .event-name {
+      font-size: 38px;
+      font-weight: bold;
+      line-height: 64px;
+      margin-right: 36px;
+    }
+  }
+
+  .pic-container {
+    width: 100%;
+    height: 554px;
+    margin-top: -120px;
+    background: linear-gradient(0deg, #ffffff 0%, #dfe6ff 100%);
+    border-radius: 40px;
+    padding: 48px;
+  }
+
+  .pic-wrap {
+    gap: 36px;
+    align-items: flex-start;
+
+    .event {
+      flex: 1;
+      position: relative;
+      overflow: hidden;
+    }
+
+    .event-img {
+      width: 100%;
+      border-radius: 20px;
+      height: 376px;
+      background: #ccc;
+    }
+
+    .status {
+      display: inline-block;
+      position: absolute;
+      bottom: 10px;
+      left: 0;
+      width: 114px;
+      height: 56px;
+      line-height: 56px;
+      text-align: center;
+      background: rgba(121, 126, 139, 0.8);
+      border-radius: 0px 20px 0px 20px;
+      font-size: 26px;
+      color: #fff;
+
+      &.deal-status {
+        background: rgba(42, 176, 212, 0.8);
+      }
+    }
+  }
+
+  .text-wrap {
+    justify-content: space-between;
+    font-size: 30px;
+    margin-top: 40px;
+    color: #1d2541;
+
+    .address {
+      width: 360px;
+    }
+
+    .icon {
+      width: 22px;
+      height: 28px;
+      margin-right: 8px;
+    }
+
+    .go-icon {
+      width: 32px;
+      height: 32px;
+      margin-left: 12px;
+    }
+
+    .eye {
+      font-size: 28px;
+      color: #3e6bda;
+    }
+  }
+
+  .result {
+    width: 100%;
+    height: 106px;
+    background: #d7ddfa;
+    border-radius: 34px;
+    margin: 40px 0 60px;
+    padding: 40px;
+    justify-content: space-between;
+
+    .status-icon {
+      width: 96px;
+      height: 68px;
+      margin-right: 12px;
+    }
+
+    .status-text {
+      font-size: 32px;
+      color: #5055da;
+    }
+
+    .use-time {
+      color: #ff7741;
+      font-size: 30px;
+      margin-left: 12px;
+      font-weight: bold;
+    }
+  }
+
+  .subtitle {
+    font-size: 34px;
+    color: #1d2541;
+    margin-bottom: 20px;
+  }
+
+  .step-wrap {
+    width: 100%;
+    height: auto;
+    overflow-x: hidden;
+    justify-content: flex-start;
+    --nutui-steps-base-line-background: #ff0;
+
+    display: flex;
+  }
+
+  .step-item {
+    width: 616px;
+    min-height: 160px;
+    background: #ffffff;
+    border-radius: 34px;
+    padding: 36px 20px;
+    margin-bottom: 40px;
+
+    .user {
+      font-weight: bold;
+      font-size: 32px;
+      color: #1d2541;
+    }
+
+    .time {
+      font-size: 22px;
+      color: #7b8193;
+    }
+
+    .remark {
+      width: 70%;
+      font-size: 26px;
+      color: #444c68;
+    }
+
+    .operation {
+      font-weight: bold;
+      font-size: 28px;
+      color: #3e6bda;
+    }
+  }
+
+  .time-count {
+    background: #fff;
+    width: 204px;
+    height: 40px;
+    font-size: 22px;
+    color: #7b8193;
+    line-height: 40px;
+    text-align: center;
+    margin: 30px 0 8px;
+  }
+
+  .dflex {
+    display: flex;
+    align-items: center;
+  }
+
+  .dflex-between {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+
+  .m-t-16 {
+    margin-top: 16px;
+  }
+}
diff --git a/src/pages/Event/view/detail/index.tsx b/src/pages/Event/view/detail/index.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..ed7a6d11916f07c970ea3cc9dab73d97fc30c90d
--- /dev/null
+++ b/src/pages/Event/view/detail/index.tsx
@@ -0,0 +1,177 @@
+//事件详情
+import services from "@/services";
+import { caseStutsColor, splitStrToArr } from "@/utils/comm";
+import { View, Text, Image } from "@tarojs/components";
+import Taro, { useRouter } from "@tarojs/taro";
+import { useDidShow } from "@tarojs/taro";
+import dayjs from "dayjs";
+import { useState } from "react";
+import ITag from "../../component/ITag";
+import LabelText from "../../component/LabelText";
+import "./index.less";
+import blackMap from "@/assets/images/event/blackMap.png";
+import right from "@/assets/images/event/right.png";
+import done from "@/assets/images/event/done.png";
+import warn from "@/assets/images/event/warn.png";
+import { Steps } from "@taroify/core";
+function Detail() {
+  const { params } = useRouter<{ caseId: string }>();
+  const [info, setInfo] = useState<API.CaseInfoDto>(); //事件信息
+  const [attachment, setAttachment] = useState<API.CaseAttachment>(); //事件附件信息
+  const [circulation, setCirculation] = useState<API.CulationType[]>([]); //流转记录
+  useDidShow(() => {
+    //事件基本信息
+    services.event.getEventInfo(params.caseId).then((res) => {
+      setInfo(res.data);
+      if (res.data.handlingMethod !== "2") {
+        //举手之劳没有流转记录
+        //事件流转记录
+        services.event.getEventCirculation(params.caseId).then((res) => {
+          setCirculation(res.data);
+        });
+      }
+    });
+    //事件附件
+    services.event.getEventAttachmentInfo(params.caseId).then((res) => {
+      setAttachment(res.data);
+    });
+  });
+
+  //打开地图
+  const handleToMap = () => {
+    Taro.openLocation({
+      latitude: Number(info?.lat),
+      longitude: Number(info?.lon),
+      name: info?.address,
+      address: info?.address,
+      scale: 18,
+    });
+  };
+
+  //预览图片
+  const handlePreviewImage = (imgList: API.AttachmentInfo[]) => {
+    let imgResultList: any[] = imgList?.map((it) => it.attachmentPath) || [];
+    Taro.previewImage({
+      current: imgResultList[0], // 当前显示图片的http链接
+      urls: imgResultList, // 需要预览的图片http链接列表
+    });
+  };
+  const caseResult = circulation[circulation?.length - 1]; //流转结果
+  return (
+    <View className="wrap">
+      <View className="top-box">
+        <View>
+          <Text className="event-name">{info?.standardEventTitle ?? "无"}</Text>
+          <ITag
+            title={info?.jointStatusName || ""}
+            color={caseStutsColor[info?.eventStatus || ""]}
+          />
+        </View>
+        {info?.newInstCondName && (
+          <LabelText label={"案件类别"} value={info?.newInstCondName} />
+        )}
+        <LabelText label={"案件来源"} value={info?.eventCollectionModeName} />
+        <LabelText label={"案件编码"} value={info?.standardEventNumber} />
+      </View>
+      <View className="pic-container">
+        <View className="pic-wrap dflex">
+          <View className="event">
+            <Image
+              onClick={() =>
+                handlePreviewImage(attachment?.preHandleAttachmentInfos || [])
+              }
+              src={
+                attachment?.preHandleAttachmentInfos[0]
+                  ?.attachmentPath as string
+              }
+              className="event-img"
+              mode="aspectFill"
+            />
+            <Text className="status">处置前</Text>
+          </View>
+          <View className="event">
+            <Image
+              onClick={() =>
+                handlePreviewImage(attachment?.handledAttachmentInfos || [])
+              }
+              src={
+                attachment?.handledAttachmentInfos[0]?.attachmentPath as string
+              }
+              className="event-img"
+              mode="aspectFill"
+            />
+            <Text className="status deal-status">处置后</Text>
+          </View>
+        </View>
+        <View className="text-wrap dflex ">
+          <View className="dflex">
+            <Image src={blackMap} className="icon" />
+            <Text className="address textellipsis">
+              {" "}
+              {splitStrToArr(info?.extendAddress, "&")[1]}
+            </Text>
+          </View>
+          <View className="eye dflex" onClick={handleToMap}>
+            去地图查看
+            <Image src={right} className="go-icon" />
+          </View>
+        </View>
+      </View>
+      {/* 举手之劳不显示 */}
+      {info?.handlingMethod !== "2" && (
+        <>
+          <View className="result dflex">
+            <View className="dflex">
+              <Image
+                src={Number(caseResult?.caseStatus) === 90 ? done : warn}
+                className="status-icon"
+              />
+              <Text className="status-text fbold">
+                {caseResult?.caseStatusName}
+              </Text>
+            </View>
+            <View>
+              <Text>耗时</Text>
+              <Text className="use-time">{caseResult?.remainingTimeText}</Text>
+            </View>
+          </View>
+          <View className="subtitle fbold">案件流转</View>
+
+          <Steps direction="vertical" className="step-wrap">
+            {circulation?.map((it, index) => (
+              <Steps.Step key={index}>
+                <>
+                  <View className="step-item">
+                    <View className="dflex-between">
+                      <Text className="user">
+                        {it.circulationPersonName || it.personRoles}
+                      </Text>
+                      {it.recordTime && (
+                        <Text className="time">
+                          {dayjs(it.recordTime).format("YYYY.MM.DD HH:mm:ss")}
+                        </Text>
+                      )}
+                    </View>
+                    <View className="dflex-between m-t-16">
+                      <Text className="remark">备注：{it.remarks || "无"}</Text>
+                      <Text className="operation">
+                        {it.operationType || it.caseStatusName}
+                      </Text>
+                    </View>
+                  </View>
+                  {index !== circulation.length - 1 && (
+                    <View className="time-count">
+                      经过{circulation[index + 1]?.consumptionTimeText}
+                    </View>
+                  )}
+                </>
+              </Steps.Step>
+            ))}
+          </Steps>
+        </>
+      )}
+    </View>
+  );
+}
+
+export default Detail;
diff --git a/src/pages/user/index.tsx b/src/pages/user/index.tsx
index 6a3adba049ca7e821243057e593970c7767c44bf..24c29d160508135f338bb2f96b8a22ec480e65be 100644
--- a/src/pages/user/index.tsx
+++ b/src/pages/user/index.tsx
@@ -49,6 +49,7 @@ export default function Index() {
   };
 
   useLoad(() => {
+    console.log('12userInfo',userInfo)
     const systemInfo = Taro.getSystemInfoSync();
     setStatusBarHeight(systemInfo?.statusBarHeight ?? 0);
   });
@@ -135,12 +136,20 @@ export default function Index() {
           icon: icon27,
           extra: "",
           actionName: "随手拍",
-          enable: false,
+          onTap: () => {
+            Taro.navigateTo({
+              url: "/pages/Event/index?type=take",
+            });
+          },
         },
         {
           icon: icon28,
           actionName: "举手之劳",
-          enable: false,
+          onTap: () => {
+            Taro.navigateTo({
+              url: "/pages/Event/index?type=liftFinger",
+            });
+          },
         },
       ],
       [
diff --git a/src/services/core/apiCore.d.ts b/src/services/core/apiCore.d.ts
index 49c488605e2ac55cc6c5edde99e12dadc56f557d..3c61471ef51d13c2d4c62dc94bb6076cf0386532 100644
--- a/src/services/core/apiCore.d.ts
+++ b/src/services/core/apiCore.d.ts
@@ -248,7 +248,7 @@ declare namespace API {
     shape: string;
     workScheduleName: string;
   }
-  
+
   interface EventMembers {
     disposeMembers: UserMembersDto[];
     superviseMembers: UserMembersDto[];
@@ -257,4 +257,104 @@ declare namespace API {
     patrolNum: number;
     superviseNum: number;
   }
+
+  interface CaseStatus {
+    jointStatusName: string;
+    concatenatedJointStatusNames: string;
+    customSort: number;
+  }
+
+  interface ListDto<T> {
+    page: number;
+    hasNext?: boolean;
+    count?: number;
+    total: number;
+    pages: number;
+    noMoreText?: string;
+    items: T[];
+  }
+
+  interface EventListDto extends ListDto<any> {
+    items: EventDto[];
+  }
+
+  interface EventDto {
+    address: string;
+    caseStatus: string;
+    caseStatusText:string;
+    id: string;
+    reportTime: string;
+    standardEventContent:string;
+    standardEventTitle: string;
+    caseStatusColor:string;
+  }
+
+  interface EventListReq {
+    page: number;
+    count: number;
+    eventType: 1 | 2;//1随手拍 2举手之劳
+  }
+
+  interface CaseInfoDto {
+    handlingMethod: any;
+    standardEventTitle: string;
+    address: string;
+    aiFlag: string;
+    cityCode: string;
+    cityName: string;
+    communityCode: string;
+    eventCollectionModeName: string;
+    componentCode: string;
+    componentName: string;
+    extendAddress: string;
+    extendClass: string;
+    informantId: string;
+    informantName: string;
+    standardEventNumber: string;
+    newInstCondName: string;
+    lat: string;
+    lon: string;
+    jointStatusName: string;
+    eventStatusName: string;
+    eventStatus: string;
+    standardEventContent: string;
+  }
+
+  interface AttachmentInfo {
+    attachmentId: string;
+    attachmentPath: string;
+    attachmentType: string;
+    circulationRecordId: string;
+    createTime: string;
+    eventId: string;
+    fileType: string;
+  }
+
+  interface CaseAttachment {
+    handledAttachmentInfos: AttachmentInfo[];
+    preHandleAttachmentInfos: AttachmentInfo[];
+  }
+
+  //案件流转
+  interface CulationType {
+    caseStatus: string;
+    caseStatusName: string;
+    remainingTimeText: string;
+    circulationRecordId: string; //流转记录ID
+    consumptionTimeText: string;
+    createTime: string;
+    eventId: string; //事件ID
+    operationType: string; //节点办理内容（上报、受理、立案等）
+    circulationPersonName: string; //流转人员（设备）名称
+    circulationPersonId: string; //流转人员（设备）ID
+    personRoles: string; //人员岗位
+    personHeadPic: string; //人员头像
+    personRolesCode: string; //人员岗位代码
+    processingCenter: string; //办理中心
+    processingCenterId: string; //办理中心ID
+    contactNumber: string; //联系方式
+    recordTime: string; //记录时间
+    signStatus: string; //签收状态（0不需要签收，1待签收，2已签收）
+    remarks: string;
+  }
 }
diff --git a/src/services/event.ts b/src/services/event.ts
index 959f710aa285a73a70feba983f8974c1657367f7..cc5e7005d8e93251fb8e74873eb4bec33229a265 100644
--- a/src/services/event.ts
+++ b/src/services/event.ts
@@ -19,8 +19,63 @@ export async function postPhotoAcquisitionCategory(data: {
 export async function postReportEventSourceInfo(
   data: API.ReportEventSourceInfoReq
 ): Promise<Resp<API.EventMembers | boolean>> {
-  return request(api.eventUrl + "/preprocessing/event-info/reportSourceInfo", {
+  return request('http://172.23.0.154:21578'+ "/event-info/reportSourceInfo", {
     method: "POST",
     data,
   });
 }
+
+//事件列表
+export async function postEventList(
+  params: API.EventListReq
+): Promise<Resp<API.EventListDto>> {
+  return request(
+    api.reportUrl + "/citizenServices/getMyHandlingList",
+    {
+      method: "POST",
+      params,
+    }
+  );
+}
+
+//获取事件基本信息
+export async function getEventInfo(
+  eventId: string
+): Promise<Resp<API.CaseInfoDto>> {
+  return request(
+    api.eventUrl +
+      "/cgtfoperation/operation/event-info-details/event-info/" +
+      eventId,
+    {
+      method: "GET",
+    }
+  );
+}
+
+//获取事件附件
+export async function getEventAttachmentInfo(
+  eventId: string
+): Promise<Resp<API.CaseAttachment>> {
+  return request(
+    api.eventUrl +
+      "/cgtfoperation/operation/event-info-details/list-event-attachment-info/" +
+      eventId,
+    {
+      method: "GET",
+    }
+  );
+}
+
+//获取事件流转记录
+export async function getEventCirculation(
+  eventId: string
+): Promise<Resp<API.CulationType[]>> {
+  return request(
+    api.eventUrl +
+      "/cgtfoperation/operation/event-info-details/list-event-circulation-record/" +
+      eventId,
+    {
+      method: "GET",
+    }
+  );
+}