diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index 1c7cd17..beebc65 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -1,3 +1,380 @@
+<!--
+  Description: h5-信息查询详情
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchDetail">
+import { showToast } from 'vant'
+import showPosition from './components/showPosition.vue'
+// 基本信息
+const deviceInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  installDate: '2024-11-30',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 近期数据
+const data = ref([
+  {
+    logTime: '2024-05-18 17:05:01',
+    value: '0.00',
+    cell: '80'
+  },
+  {
+    logTime: '2024-07-18 13:02:11',
+    value: '1.00',
+    cell: '88'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '90'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '10'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: ''
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '2'
+  },
+])
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!deviceInfo.value.lon || !deviceInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([deviceInfo.value.lon, deviceInfo.value.lat])
+}
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('base-info')?.offsetHeight
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight
+  scrollHeight.value = window.innerHeight - 40 - 30 - (totalAreaHeight || 0) - (searchHeaderHeight || 0) - 14
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 计算电池图标
+const calcCellIcon = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70'
+  }
+}
+// 计算电池电量进度
+const calcCellWidth = (cell: string) => {
+  if (!cell) {
+    return '0'
+  }
+  else {
+    return Number(cell) >= 85 ? `${89}%` : `${cell}%`
+  }
+}
+// 计算电池颜色
+const calcCellColor = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20-color'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40-color'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70-color'
+  }
+}
+</script>
 <template>
-  信息查询详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ deviceInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备类型</div>
+        <div class="value">{{ deviceInfo.devTypeName }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ deviceInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ deviceInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ deviceInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">安装日期</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">最近上报时间</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+    </div>
+    <!-- 近期数据 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        近期数据
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in data" :key="index" :class="index !== 0 ? 'top-border' : ''" class="result-item">
+            <div class="cell">
+              <div class="title">{{ item.logTime }}</div>
+              <div class="value">
+                <!-- 电池图标 -->
+                <div class="cell-icon" :class="calcCellIcon(item.cell)">
+                  <!-- 电池电量 -->
+                  <div style="height: 14px;" :style="{ width: `${calcCellWidth(item.cell)}` }"
+                    :class="calcCellColor(item.cell)"></div>
+                  <!-- 数字 -->
+                  <div class="cell-count">{{ item.cell }}</div>
+                </div>
+
+
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">燃气浓度</div>
+              <div class="value">{{ item.value }}%LEL</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.cell-icon {
+  position: relative;
+  width: 30px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  padding-left: 2px;
+  .cell-count{
+    position: absolute;
+    color: #000;
+    text-align: center;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 0.8rem;
+    align-items: center;
+  }
+}
+
+.cell-70 {
+  background: url('@/assets/icons/icon-cell-70.svg') no-repeat center center / cover;
+}
+
+.cell-70-color {
+  background-color: rgb(37, 202, 37);
+}
+
+.cell-40 {
+  background: url('@/assets/icons/icon-cell-40.svg') no-repeat center center / cover;
+}
+
+.cell-40-color {
+  background-color: orange;
+}
+
+.cell-20 {
+  background: url('@/assets/icons/icon-cell-20.svg') no-repeat center center / cover;
+}
+
+.cell-20-color {
+  background-color: red;
+}
+
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index 1c7cd17..beebc65 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -1,3 +1,380 @@
+<!--
+  Description: h5-信息查询详情
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchDetail">
+import { showToast } from 'vant'
+import showPosition from './components/showPosition.vue'
+// 基本信息
+const deviceInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  installDate: '2024-11-30',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 近期数据
+const data = ref([
+  {
+    logTime: '2024-05-18 17:05:01',
+    value: '0.00',
+    cell: '80'
+  },
+  {
+    logTime: '2024-07-18 13:02:11',
+    value: '1.00',
+    cell: '88'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '90'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '10'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: ''
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '2'
+  },
+])
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!deviceInfo.value.lon || !deviceInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([deviceInfo.value.lon, deviceInfo.value.lat])
+}
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('base-info')?.offsetHeight
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight
+  scrollHeight.value = window.innerHeight - 40 - 30 - (totalAreaHeight || 0) - (searchHeaderHeight || 0) - 14
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 计算电池图标
+const calcCellIcon = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70'
+  }
+}
+// 计算电池电量进度
+const calcCellWidth = (cell: string) => {
+  if (!cell) {
+    return '0'
+  }
+  else {
+    return Number(cell) >= 85 ? `${89}%` : `${cell}%`
+  }
+}
+// 计算电池颜色
+const calcCellColor = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20-color'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40-color'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70-color'
+  }
+}
+</script>
 <template>
-  信息查询详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ deviceInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备类型</div>
+        <div class="value">{{ deviceInfo.devTypeName }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ deviceInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ deviceInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ deviceInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">安装日期</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">最近上报时间</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+    </div>
+    <!-- 近期数据 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        近期数据
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in data" :key="index" :class="index !== 0 ? 'top-border' : ''" class="result-item">
+            <div class="cell">
+              <div class="title">{{ item.logTime }}</div>
+              <div class="value">
+                <!-- 电池图标 -->
+                <div class="cell-icon" :class="calcCellIcon(item.cell)">
+                  <!-- 电池电量 -->
+                  <div style="height: 14px;" :style="{ width: `${calcCellWidth(item.cell)}` }"
+                    :class="calcCellColor(item.cell)"></div>
+                  <!-- 数字 -->
+                  <div class="cell-count">{{ item.cell }}</div>
+                </div>
+
+
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">燃气浓度</div>
+              <div class="value">{{ item.value }}%LEL</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.cell-icon {
+  position: relative;
+  width: 30px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  padding-left: 2px;
+  .cell-count{
+    position: absolute;
+    color: #000;
+    text-align: center;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 0.8rem;
+    align-items: center;
+  }
+}
+
+.cell-70 {
+  background: url('@/assets/icons/icon-cell-70.svg') no-repeat center center / cover;
+}
+
+.cell-70-color {
+  background-color: rgb(37, 202, 37);
+}
+
+.cell-40 {
+  background: url('@/assets/icons/icon-cell-40.svg') no-repeat center center / cover;
+}
+
+.cell-40-color {
+  background-color: orange;
+}
+
+.cell-20 {
+  background: url('@/assets/icons/icon-cell-20.svg') no-repeat center center / cover;
+}
+
+.cell-20-color {
+  background-color: red;
+}
+
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>
diff --git a/src/views/mobile/info/result.vue b/src/views/mobile/info/result.vue
index 895ef64..cd3404e 100644
--- a/src/views/mobile/info/result.vue
+++ b/src/views/mobile/info/result.vue
@@ -1,3 +1,219 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchResult">
+const total = ref(0)
+const list = ref([
+  {
+    devcode: '24102708',
+    devTypeName: '燃气智能监测终端',
+    tagNumber: 'N57C114',
+    position: '示范区联络线中压A闸9',
+    address: '百环花园调压站南侧',
+    installDate: '2024-11-30'
+  },
+  {
+    devcode: '322024010010',
+    devTypeName: '燃气智能监测终端（一体化）',
+    tagNumber: 'cprl001',
+    position: '92301部队中压A闸1',
+    address: '西环里35号院2号楼南',
+    installDate: '2024-01-30'
+  },
+  {
+    devcode: '341524019XX1',
+    devTypeName: '管网哨兵',
+    tagNumber: 'GX_33101',
+    position: '北新中压A闸6',
+    address: '北京市海淀区街道1',
+    installDate: '2024-11-18'
+  },
+  {
+    devcode: '211424152117',
+    devTypeName: '智能警示桩',
+    tagNumber: 'NCX_0001',
+    position: '东辰小区中压A闸1',
+    address: '北京市西城区复外大街与三里河路交叉口(地铁1号线地铁站木樨地站北侧)三里河3区',
+    installDate: '2024-11-26'
+  },
+  {
+    devcode: 'YT20240913',
+    devTypeName: '场站监测云台',
+    tagNumber: 'N53A888',
+    position: '定辛庄小学中压A闸1T',
+    address: '眼镜城',
+    installDate: '2024-09-13'
+  },
+])
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('search-info')?.offsetHeight || 0
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight || 0
+  scrollHeight.value = window.innerHeight - 40 - 30 - totalAreaHeight - searchHeaderHeight - 14
+}
+// 查看详情
+const $router = useRouter()
+const detail = (row: any) => {
+  $router.push({
+    name: 'InfoDetail'
+  })
+}
+onMounted(() => {
+  calcHeight()
+})
+onActivated(() => {
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+</script>
 <template>
-  信息查询结果
+  <div class="info-container">
+    <div id="search-info" class="search-info">
+      <span>共找到 </span>
+      <span style="font-weight: 700;">
+        {{ total }}条
+      </span>
+      <span>匹配的设备</span>
+    </div>
+    <!-- 查询结果 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        查询结果
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in list" :key="index" class="result-item" :class="index !== 0 ? 'top-border' : ''" @click="detail(item)">
+            <div class="devcode"> {{ item.devcode }}</div>
+            <div class="cell">
+              <div class="title">设备类型</div>
+              <div class="value">{{ item.devTypeName }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">安装位置</div>
+              <div class="value">{{ item.tagNumber }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">位置名称</div>
+              <!-- <div class="value">{{ item.position }}</div> -->
+              <div class="value"><van-text-ellipsis :rows="1" :content="item.position" expand-text="展开" collapse-text="收起" /></div>
+            </div>
+            <div class="cell">
+              <div class="title">详细位置</div>
+              <!-- <div class="value">{{ item.address }}</div> -->
+               <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.address" expand-text="展开" collapse-text="收起" />
+               </div>
+            </div>
+            <div class="cell">
+              <div class="title">安装日期</div>
+              <div class="value">{{ item.installDate }}</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+      // border-left: 4px solid #0d76d4;
+      // border-radius: 2px;
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      padding: 4px;
+      // box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+      .devcode {
+        font-weight: 700;
+        font-size: 1.3rem;
+      }
+
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 14px;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+          font-weight: 500;
+        }
+
+        .title,
+        .value {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+
+    }
+  }
+}
+</style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index 1c7cd17..beebc65 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -1,3 +1,380 @@
+<!--
+  Description: h5-信息查询详情
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchDetail">
+import { showToast } from 'vant'
+import showPosition from './components/showPosition.vue'
+// 基本信息
+const deviceInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  installDate: '2024-11-30',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 近期数据
+const data = ref([
+  {
+    logTime: '2024-05-18 17:05:01',
+    value: '0.00',
+    cell: '80'
+  },
+  {
+    logTime: '2024-07-18 13:02:11',
+    value: '1.00',
+    cell: '88'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '90'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '10'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: ''
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '2'
+  },
+])
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!deviceInfo.value.lon || !deviceInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([deviceInfo.value.lon, deviceInfo.value.lat])
+}
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('base-info')?.offsetHeight
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight
+  scrollHeight.value = window.innerHeight - 40 - 30 - (totalAreaHeight || 0) - (searchHeaderHeight || 0) - 14
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 计算电池图标
+const calcCellIcon = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70'
+  }
+}
+// 计算电池电量进度
+const calcCellWidth = (cell: string) => {
+  if (!cell) {
+    return '0'
+  }
+  else {
+    return Number(cell) >= 85 ? `${89}%` : `${cell}%`
+  }
+}
+// 计算电池颜色
+const calcCellColor = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20-color'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40-color'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70-color'
+  }
+}
+</script>
 <template>
-  信息查询详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ deviceInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备类型</div>
+        <div class="value">{{ deviceInfo.devTypeName }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ deviceInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ deviceInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ deviceInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">安装日期</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">最近上报时间</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+    </div>
+    <!-- 近期数据 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        近期数据
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in data" :key="index" :class="index !== 0 ? 'top-border' : ''" class="result-item">
+            <div class="cell">
+              <div class="title">{{ item.logTime }}</div>
+              <div class="value">
+                <!-- 电池图标 -->
+                <div class="cell-icon" :class="calcCellIcon(item.cell)">
+                  <!-- 电池电量 -->
+                  <div style="height: 14px;" :style="{ width: `${calcCellWidth(item.cell)}` }"
+                    :class="calcCellColor(item.cell)"></div>
+                  <!-- 数字 -->
+                  <div class="cell-count">{{ item.cell }}</div>
+                </div>
+
+
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">燃气浓度</div>
+              <div class="value">{{ item.value }}%LEL</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.cell-icon {
+  position: relative;
+  width: 30px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  padding-left: 2px;
+  .cell-count{
+    position: absolute;
+    color: #000;
+    text-align: center;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 0.8rem;
+    align-items: center;
+  }
+}
+
+.cell-70 {
+  background: url('@/assets/icons/icon-cell-70.svg') no-repeat center center / cover;
+}
+
+.cell-70-color {
+  background-color: rgb(37, 202, 37);
+}
+
+.cell-40 {
+  background: url('@/assets/icons/icon-cell-40.svg') no-repeat center center / cover;
+}
+
+.cell-40-color {
+  background-color: orange;
+}
+
+.cell-20 {
+  background: url('@/assets/icons/icon-cell-20.svg') no-repeat center center / cover;
+}
+
+.cell-20-color {
+  background-color: red;
+}
+
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>
diff --git a/src/views/mobile/info/result.vue b/src/views/mobile/info/result.vue
index 895ef64..cd3404e 100644
--- a/src/views/mobile/info/result.vue
+++ b/src/views/mobile/info/result.vue
@@ -1,3 +1,219 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchResult">
+const total = ref(0)
+const list = ref([
+  {
+    devcode: '24102708',
+    devTypeName: '燃气智能监测终端',
+    tagNumber: 'N57C114',
+    position: '示范区联络线中压A闸9',
+    address: '百环花园调压站南侧',
+    installDate: '2024-11-30'
+  },
+  {
+    devcode: '322024010010',
+    devTypeName: '燃气智能监测终端（一体化）',
+    tagNumber: 'cprl001',
+    position: '92301部队中压A闸1',
+    address: '西环里35号院2号楼南',
+    installDate: '2024-01-30'
+  },
+  {
+    devcode: '341524019XX1',
+    devTypeName: '管网哨兵',
+    tagNumber: 'GX_33101',
+    position: '北新中压A闸6',
+    address: '北京市海淀区街道1',
+    installDate: '2024-11-18'
+  },
+  {
+    devcode: '211424152117',
+    devTypeName: '智能警示桩',
+    tagNumber: 'NCX_0001',
+    position: '东辰小区中压A闸1',
+    address: '北京市西城区复外大街与三里河路交叉口(地铁1号线地铁站木樨地站北侧)三里河3区',
+    installDate: '2024-11-26'
+  },
+  {
+    devcode: 'YT20240913',
+    devTypeName: '场站监测云台',
+    tagNumber: 'N53A888',
+    position: '定辛庄小学中压A闸1T',
+    address: '眼镜城',
+    installDate: '2024-09-13'
+  },
+])
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('search-info')?.offsetHeight || 0
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight || 0
+  scrollHeight.value = window.innerHeight - 40 - 30 - totalAreaHeight - searchHeaderHeight - 14
+}
+// 查看详情
+const $router = useRouter()
+const detail = (row: any) => {
+  $router.push({
+    name: 'InfoDetail'
+  })
+}
+onMounted(() => {
+  calcHeight()
+})
+onActivated(() => {
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+</script>
 <template>
-  信息查询结果
+  <div class="info-container">
+    <div id="search-info" class="search-info">
+      <span>共找到 </span>
+      <span style="font-weight: 700;">
+        {{ total }}条
+      </span>
+      <span>匹配的设备</span>
+    </div>
+    <!-- 查询结果 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        查询结果
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in list" :key="index" class="result-item" :class="index !== 0 ? 'top-border' : ''" @click="detail(item)">
+            <div class="devcode"> {{ item.devcode }}</div>
+            <div class="cell">
+              <div class="title">设备类型</div>
+              <div class="value">{{ item.devTypeName }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">安装位置</div>
+              <div class="value">{{ item.tagNumber }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">位置名称</div>
+              <!-- <div class="value">{{ item.position }}</div> -->
+              <div class="value"><van-text-ellipsis :rows="1" :content="item.position" expand-text="展开" collapse-text="收起" /></div>
+            </div>
+            <div class="cell">
+              <div class="title">详细位置</div>
+              <!-- <div class="value">{{ item.address }}</div> -->
+               <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.address" expand-text="展开" collapse-text="收起" />
+               </div>
+            </div>
+            <div class="cell">
+              <div class="title">安装日期</div>
+              <div class="value">{{ item.installDate }}</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+      // border-left: 4px solid #0d76d4;
+      // border-radius: 2px;
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      padding: 4px;
+      // box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+      .devcode {
+        font-weight: 700;
+        font-size: 1.3rem;
+      }
+
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 14px;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+          font-weight: 500;
+        }
+
+        .title,
+        .value {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+
+    }
+  }
+}
+</style>
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index e98fed6..e382931 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -1,3 +1,71 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearch">
+const $router = useRouter()
+// 查询条件
+const searchQuery = ref({
+  devcode: '',
+  tagNumber: '',
+  position: '',
+  address: '',
+})
+
+// 查询
+const search = () => {
+  $router.push({
+    name: 'InfoResult'
+  })
+}
+</script>
+
 <template>
-  信息查询
+  <div class="info-container">
+    <!-- 查询条件 -->
+    <div class="search-info">
+      <van-form>
+        <van-cell-group>
+          <van-field v-model="searchQuery.devcode" label="设备编号" placeholder="输入设备编号" clearable input-align="right" />
+          <van-field v-model="searchQuery.tagNumber" label="安装位号" placeholder="输入安装位号" clearable input-align="right" />
+          <van-field v-model="searchQuery.position" label="位置名称" placeholder="输入位置名称" clearable input-align="right" />
+          <van-field v-model="searchQuery.address" label="安装地点" placeholder="输入安装地点" clearable input-align="right" />
+        </van-cell-group>
+      </van-form>
+    </div>
+    <!-- 查询按钮 -->
+    <div class="search-btn">
+      <el-button type="primary" style="width: 96%;" @click="search">开始查询</el-button>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+  .search-btn {
+    width: 100%;
+    position: fixed;
+    bottom: 1vh;
+    display: flex;
+    justify-content: center;
+  }
+}
+</style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index 1c7cd17..beebc65 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -1,3 +1,380 @@
+<!--
+  Description: h5-信息查询详情
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchDetail">
+import { showToast } from 'vant'
+import showPosition from './components/showPosition.vue'
+// 基本信息
+const deviceInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  installDate: '2024-11-30',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 近期数据
+const data = ref([
+  {
+    logTime: '2024-05-18 17:05:01',
+    value: '0.00',
+    cell: '80'
+  },
+  {
+    logTime: '2024-07-18 13:02:11',
+    value: '1.00',
+    cell: '88'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '90'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '10'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: ''
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '2'
+  },
+])
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!deviceInfo.value.lon || !deviceInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([deviceInfo.value.lon, deviceInfo.value.lat])
+}
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('base-info')?.offsetHeight
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight
+  scrollHeight.value = window.innerHeight - 40 - 30 - (totalAreaHeight || 0) - (searchHeaderHeight || 0) - 14
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 计算电池图标
+const calcCellIcon = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70'
+  }
+}
+// 计算电池电量进度
+const calcCellWidth = (cell: string) => {
+  if (!cell) {
+    return '0'
+  }
+  else {
+    return Number(cell) >= 85 ? `${89}%` : `${cell}%`
+  }
+}
+// 计算电池颜色
+const calcCellColor = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20-color'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40-color'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70-color'
+  }
+}
+</script>
 <template>
-  信息查询详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ deviceInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备类型</div>
+        <div class="value">{{ deviceInfo.devTypeName }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ deviceInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ deviceInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ deviceInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">安装日期</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">最近上报时间</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+    </div>
+    <!-- 近期数据 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        近期数据
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in data" :key="index" :class="index !== 0 ? 'top-border' : ''" class="result-item">
+            <div class="cell">
+              <div class="title">{{ item.logTime }}</div>
+              <div class="value">
+                <!-- 电池图标 -->
+                <div class="cell-icon" :class="calcCellIcon(item.cell)">
+                  <!-- 电池电量 -->
+                  <div style="height: 14px;" :style="{ width: `${calcCellWidth(item.cell)}` }"
+                    :class="calcCellColor(item.cell)"></div>
+                  <!-- 数字 -->
+                  <div class="cell-count">{{ item.cell }}</div>
+                </div>
+
+
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">燃气浓度</div>
+              <div class="value">{{ item.value }}%LEL</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.cell-icon {
+  position: relative;
+  width: 30px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  padding-left: 2px;
+  .cell-count{
+    position: absolute;
+    color: #000;
+    text-align: center;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 0.8rem;
+    align-items: center;
+  }
+}
+
+.cell-70 {
+  background: url('@/assets/icons/icon-cell-70.svg') no-repeat center center / cover;
+}
+
+.cell-70-color {
+  background-color: rgb(37, 202, 37);
+}
+
+.cell-40 {
+  background: url('@/assets/icons/icon-cell-40.svg') no-repeat center center / cover;
+}
+
+.cell-40-color {
+  background-color: orange;
+}
+
+.cell-20 {
+  background: url('@/assets/icons/icon-cell-20.svg') no-repeat center center / cover;
+}
+
+.cell-20-color {
+  background-color: red;
+}
+
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>
diff --git a/src/views/mobile/info/result.vue b/src/views/mobile/info/result.vue
index 895ef64..cd3404e 100644
--- a/src/views/mobile/info/result.vue
+++ b/src/views/mobile/info/result.vue
@@ -1,3 +1,219 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchResult">
+const total = ref(0)
+const list = ref([
+  {
+    devcode: '24102708',
+    devTypeName: '燃气智能监测终端',
+    tagNumber: 'N57C114',
+    position: '示范区联络线中压A闸9',
+    address: '百环花园调压站南侧',
+    installDate: '2024-11-30'
+  },
+  {
+    devcode: '322024010010',
+    devTypeName: '燃气智能监测终端（一体化）',
+    tagNumber: 'cprl001',
+    position: '92301部队中压A闸1',
+    address: '西环里35号院2号楼南',
+    installDate: '2024-01-30'
+  },
+  {
+    devcode: '341524019XX1',
+    devTypeName: '管网哨兵',
+    tagNumber: 'GX_33101',
+    position: '北新中压A闸6',
+    address: '北京市海淀区街道1',
+    installDate: '2024-11-18'
+  },
+  {
+    devcode: '211424152117',
+    devTypeName: '智能警示桩',
+    tagNumber: 'NCX_0001',
+    position: '东辰小区中压A闸1',
+    address: '北京市西城区复外大街与三里河路交叉口(地铁1号线地铁站木樨地站北侧)三里河3区',
+    installDate: '2024-11-26'
+  },
+  {
+    devcode: 'YT20240913',
+    devTypeName: '场站监测云台',
+    tagNumber: 'N53A888',
+    position: '定辛庄小学中压A闸1T',
+    address: '眼镜城',
+    installDate: '2024-09-13'
+  },
+])
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('search-info')?.offsetHeight || 0
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight || 0
+  scrollHeight.value = window.innerHeight - 40 - 30 - totalAreaHeight - searchHeaderHeight - 14
+}
+// 查看详情
+const $router = useRouter()
+const detail = (row: any) => {
+  $router.push({
+    name: 'InfoDetail'
+  })
+}
+onMounted(() => {
+  calcHeight()
+})
+onActivated(() => {
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+</script>
 <template>
-  信息查询结果
+  <div class="info-container">
+    <div id="search-info" class="search-info">
+      <span>共找到 </span>
+      <span style="font-weight: 700;">
+        {{ total }}条
+      </span>
+      <span>匹配的设备</span>
+    </div>
+    <!-- 查询结果 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        查询结果
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in list" :key="index" class="result-item" :class="index !== 0 ? 'top-border' : ''" @click="detail(item)">
+            <div class="devcode"> {{ item.devcode }}</div>
+            <div class="cell">
+              <div class="title">设备类型</div>
+              <div class="value">{{ item.devTypeName }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">安装位置</div>
+              <div class="value">{{ item.tagNumber }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">位置名称</div>
+              <!-- <div class="value">{{ item.position }}</div> -->
+              <div class="value"><van-text-ellipsis :rows="1" :content="item.position" expand-text="展开" collapse-text="收起" /></div>
+            </div>
+            <div class="cell">
+              <div class="title">详细位置</div>
+              <!-- <div class="value">{{ item.address }}</div> -->
+               <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.address" expand-text="展开" collapse-text="收起" />
+               </div>
+            </div>
+            <div class="cell">
+              <div class="title">安装日期</div>
+              <div class="value">{{ item.installDate }}</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+      // border-left: 4px solid #0d76d4;
+      // border-radius: 2px;
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      padding: 4px;
+      // box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+      .devcode {
+        font-weight: 700;
+        font-size: 1.3rem;
+      }
+
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 14px;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+          font-weight: 500;
+        }
+
+        .title,
+        .value {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+
+    }
+  }
+}
+</style>
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index e98fed6..e382931 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -1,3 +1,71 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearch">
+const $router = useRouter()
+// 查询条件
+const searchQuery = ref({
+  devcode: '',
+  tagNumber: '',
+  position: '',
+  address: '',
+})
+
+// 查询
+const search = () => {
+  $router.push({
+    name: 'InfoResult'
+  })
+}
+</script>
+
 <template>
-  信息查询
+  <div class="info-container">
+    <!-- 查询条件 -->
+    <div class="search-info">
+      <van-form>
+        <van-cell-group>
+          <van-field v-model="searchQuery.devcode" label="设备编号" placeholder="输入设备编号" clearable input-align="right" />
+          <van-field v-model="searchQuery.tagNumber" label="安装位号" placeholder="输入安装位号" clearable input-align="right" />
+          <van-field v-model="searchQuery.position" label="位置名称" placeholder="输入位置名称" clearable input-align="right" />
+          <van-field v-model="searchQuery.address" label="安装地点" placeholder="输入安装地点" clearable input-align="right" />
+        </van-cell-group>
+      </van-form>
+    </div>
+    <!-- 查询按钮 -->
+    <div class="search-btn">
+      <el-button type="primary" style="width: 96%;" @click="search">开始查询</el-button>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+  .search-btn {
+    width: 100%;
+    position: fixed;
+    bottom: 1vh;
+    display: flex;
+    justify-content: center;
+  }
+}
+</style>
diff --git a/src/views/mobile/record/detail.vue b/src/views/mobile/record/detail.vue
index 2fbea2f..1176721 100644
--- a/src/views/mobile/record/detail.vue
+++ b/src/views/mobile/record/detail.vue
@@ -1,3 +1,204 @@
+<!--
+  Description: h5-运维详情
+  Author: 李亚光
+  Date: 2025-01-03
+ -->
+<script lang="ts" setup name="H5OperationDetail">
+import { showToast } from 'vant'
+import showPosition from '@/views/mobile/info/components/showPosition.vue'
+// 基本信息
+const detailInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  repairType: '新装',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  repairDate: '2024-11-30',
+  repairPerson: '张三',
+  repairContent: '更换电池以及维护保养',
+  deptName: '第一分公司/运维一所',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!detailInfo.value.lon || !detailInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([detailInfo.value.lon, detailInfo.value.lat])
+}
+
+</script>
 <template>
-  详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">运维类型</div>
+        <div class="value">{{ detailInfo.repairType }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ detailInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ detailInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ detailInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ detailInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">运维日期</div>
+        <div class="value">{{ detailInfo.repairDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">运维人员</div>
+        <div class="value">{{ detailInfo.repairPerson }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">运维内容</div>
+        <div class="value">{{ detailInfo.repairContent }}</div>
+      </div>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>

diff --git a/src/assets/icons/icon-camera.svg b/src/assets/icons/icon-camera.svg
new file mode 100644
index 0000000..5cd6a26
--- /dev/null
+++ b/src/assets/icons/icon-camera.svg
@@ -0,0 +1 @@
+<svg t="1735872052683" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7295" width="200" height="200"><path d="M677.888 494.592q0 28.672-10.752 53.76t-29.184 43.52-43.008 29.184-53.248 10.752-53.248-10.752-43.008-29.184-29.184-43.52-10.752-53.76q0-27.648 10.752-52.736t29.184-43.52 43.008-29.184 53.248-10.752 53.248 10.752 43.008 29.184 29.184 43.52 10.752 52.736zM171.008 766.976q-28.672 0-51.2-5.12t-37.888-17.408-23.552-33.28-8.192-52.736l0-346.112q0-57.344 27.136-79.872t85.504-22.528l172.032 0q16.384 0 27.136-6.144t17.408-16.384 11.776-24.064 11.264-28.16q10.24-26.624 35.84-46.08t58.368-19.456l95.232 0q37.888 0 61.952 20.992t32.256 44.544q11.264 30.72 29.696 52.736t38.912 22.016l130.048 0q45.056-1.024 71.68 24.576t26.624 74.752l0 351.232q0 52.224-27.648 79.36t-73.728 27.136l-710.656 0zM539.648 280.576q-45.056 0-83.968 16.896t-67.584 46.08-45.568 68.096-16.896 82.944q0 45.056 16.896 83.968t45.568 67.584 67.584 45.568 83.968 16.896q44.032 0 82.944-16.896t67.584-45.568 45.568-67.584 16.896-83.968q0-44.032-16.896-82.944t-45.568-68.096-67.584-46.08-82.944-16.896zM611.328 169.984q0-16.384-1.536-25.6t-20.992-9.216l-84.992 0q-19.456-1.024-20.992 8.192t-1.536 26.624q-1.024 19.456 2.048 27.648t20.48 8.192l84.992 0q19.456 0 20.992-9.216t1.536-26.624z" p-id="7296"></path></svg>
diff --git a/src/assets/icons/icon-cell-20.svg b/src/assets/icons/icon-cell-20.svg
new file mode 100644
index 0000000..63427fd
--- /dev/null
+++ b/src/assets/icons/icon-cell-20.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#d81e06" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-40.svg b/src/assets/icons/icon-cell-40.svg
new file mode 100644
index 0000000..21f33b3
--- /dev/null
+++ b/src/assets/icons/icon-cell-40.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#E3D848" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-cell-70.svg b/src/assets/icons/icon-cell-70.svg
new file mode 100644
index 0000000..a8a6294
--- /dev/null
+++ b/src/assets/icons/icon-cell-70.svg
@@ -0,0 +1 @@
+<svg t="1735872200472" class="icon" viewBox="0 0 1945 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27160" width="200" height="200"><path d="M1792 341.2992V170.7008C1792 76.8 1715.2 0 1621.2992 0H170.7008C76.8 0 0 76.8 0 170.7008v682.5984C0 947.2 76.8 1024 170.7008 1024h1450.5984c93.9008 0 170.7008-76.8 170.7008-170.7008V682.7008a85.6064 85.6064 0 0 0 85.2992-85.4016V426.7008a85.6064 85.6064 0 0 0-85.2992-85.4016z m-85.2992 512a85.6064 85.6064 0 0 1-85.4016 85.4016H170.7008a85.6064 85.6064 0 0 1-85.4016-85.4016V170.7008c0-47.0016 38.4-85.4016 85.4016-85.4016h1450.5984c47.0016 0 85.4016 38.4 85.4016 85.4016v682.5984z" fill="#16D46B" p-id="27161"></path></svg>
diff --git a/src/assets/icons/icon-location.svg b/src/assets/icons/icon-location.svg
new file mode 100644
index 0000000..ebecd98
--- /dev/null
+++ b/src/assets/icons/icon-location.svg
@@ -0,0 +1 @@
+<svg t="1735871739565" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6055" width="200" height="200"><path d="M909.2096 917.6064H124.6208a51.2 51.2 0 0 1-42.3424-80.384L196.608 670.72a51.2 51.2 0 0 1 42.3424-22.3232h555.8784a51.2 51.2 0 0 1 42.3424 22.3232l114.3808 166.7072a51.2 51.2 0 0 1-42.3424 80.1792z" fill="#92DBFF" p-id="6056"></path><path d="M828.7232 404.48A311.8592 311.8592 0 0 0 506.88 92.6208c-168.6528 5.12-303.7696 146.688-302.08 315.4432 2.2016 200.9088 180.224 363.52 289.7408 420.9152a46.08 46.08 0 0 0 43.264 0c120.0128-65.5872 290.9184-227.2256 290.9184-424.4992z" fill="#42B4FA" p-id="6057"></path><path d="M516.9152 394.2912m-116.736 0a116.736 116.736 0 1 0 233.472 0 116.736 116.736 0 1 0-233.472 0Z" fill="#FFFFFF" p-id="6058"></path></svg>
diff --git a/src/assets/icons/icon-location_current.svg b/src/assets/icons/icon-location_current.svg
new file mode 100644
index 0000000..7b3cccf
--- /dev/null
+++ b/src/assets/icons/icon-location_current.svg
@@ -0,0 +1 @@
+<svg t="1735872092965" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11061" width="200" height="200"><path d="M512 512m-80 0a80 80 0 1 0 160 0 80 80 0 1 0-160 0Z" p-id="11062" fill="#2c2c2c"></path><path d="M960 480h-33.632C910.752 276.16 747.84 113.248 544 97.632V64a32 32 0 1 0-64 0v33.632C276.16 113.248 113.248 276.16 97.632 480H64a32 32 0 0 0 0 64h33.632C113.248 747.84 276.16 910.752 480 926.368V960a32 32 0 1 0 64 0v-33.632C747.84 910.752 910.752 747.84 926.368 544H960a32 32 0 1 0 0-64zM544 862.368V800a32 32 0 1 0-64 0v62.368C311.424 847.104 176.896 712.576 161.632 544H224a32 32 0 1 0 0-64H161.632C176.896 311.424 311.424 176.896 480 161.632V224a32 32 0 0 0 64 0V161.632c168.576 15.296 303.104 149.792 318.368 318.368H800a32 32 0 1 0 0 64h62.368c-15.264 168.576-149.792 303.104-318.368 318.368z" p-id="11063" fill="#2c2c2c"></path></svg>
diff --git a/src/components.d.ts b/src/components.d.ts
index 103d9be..a7714eb 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -52,6 +52,7 @@
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
+    offline: typeof import('./components/map/index offline.vue')['default']
     PageHeader: typeof import('./components/PageHeader/index.vue')['default']
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
@@ -72,10 +73,16 @@
     SystemInfo: typeof import('./components/SystemInfo/index.vue')['default']
     TableContainer: typeof import('./components/TableContainer/index.vue')['default']
     Trend: typeof import('./components/Trend/index.vue')['default']
+    VanBackTop: typeof import('vant/es')['BackTop']
     VanCell: typeof import('vant/es')['Cell']
     VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanDatePicker: typeof import('vant/es')['DatePicker']
+    VanDialog: typeof import('vant/es')['Dialog']
     VanField: typeof import('vant/es')['Field']
     VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPickerGroup: typeof import('vant/es')['PickerGroup']
     VanPopup: typeof import('vant/es')['Popup']
     VanTextEllipsis: typeof import('vant/es')['TextEllipsis']
   }
diff --git a/src/views/login-mobile.vue b/src/views/login-mobile.vue
index 6fd7b46..ba2cbf9 100644
--- a/src/views/login-mobile.vue
+++ b/src/views/login-mobile.vue
@@ -89,7 +89,8 @@
 </script>
 
 <template>
-  <div class="container">
+  <div style="height: 100vh;overflow: hidden;background-color: #fff;">
+    <div class="container">
     <!-- 背景图 -->
     <div class="bg" />
     <!-- title -->
@@ -136,6 +137,7 @@
       </el-form>
     </div>
   </div>
+  </div>
 </template>
 
 <style lang="scss" scoped>
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 682cf15..74e09a6 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -4,6 +4,8 @@
   Date: 2024-12-27
  -->
 <script lang="ts" setup name="H5DeviceAdd">
+import dayjs from 'dayjs'
+import { Toast, showImagePreview } from 'vant'
 import { getProductListPage } from '@/api/home/device/product'
 import { getDeviceTypeListPage } from '@/api/home/device/type'
 import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
@@ -15,6 +17,8 @@
   devcode: '',
   tagNumber: '',
   watchObject: '',
+  installDate: '',
+  photo: []
 })
 
 // 产品相关
@@ -47,8 +51,8 @@
     closeToast()
     searchForWell.value = false
     let message = ''
-    if(!res.data.rows.length) {
-      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1'  ? '闸井' : '场站'} ，请确认位号后重新搜索`
+    if (!res.data.rows.length) {
+      message = `未找到位号为 ${searchForInput.value} ${deciceInfo.value.watchObject === '1' ? '闸井' : '场站'} ，请确认位号后重新搜索`
     }
     else {
       // 判断位置
@@ -80,11 +84,70 @@
     searchForWell.value = true
     searchForInput.value = ''
   }
-  else {
+  // else {
 
-  }
+  // }
 }
 // const
+
+// 安装日期
+const showDatePicker = ref(false)
+const pickerValueInstallDate = ref<string[]>([])
+// 默认日期
+pickerValueInstallDate.value = dayjs().format('YYYY-MM-DD').split('-')
+deciceInfo.value.installDate = pickerValueInstallDate.value.join('-')
+const onConfirmInstallDate = ({ selectedValues }) => {
+  deciceInfo.value.installDate = selectedValues.join('-')
+  pickerValueInstallDate.value = selectedValues
+  showDatePicker.value = false
+}
+// 现场照片
+// const showCamera = ref(false)
+// 拍照
+const takePictures = () => {
+  if(deciceInfo.value.photo.length >= 3) {
+    showToast('最多上传三张照片')
+    return
+  }
+  // 调用摄像头
+  const camera = document.getElementById('camera-photo')
+  camera?.click()
+}
+const fileRef = ref() // 文件上传input，获取input的引用
+const onFileChange = (event: any) => {
+  // 原生上传
+  if (event.target.files?.length !== 0) {
+    const file = event.target.files[0]
+    const reader = new FileReader() // 实例化FileReader
+    reader.readAsDataURL(file)
+    // 读取成功以后执行的方法
+    reader.onload = (e) => {
+      deciceInfo.value.photo.push(e.target.result)
+      // let img = new Image()
+      // // base64
+      // img.src = e.target.result
+      // console.log(img.src, 'img.src')
+      // img.onload = () => {
+      //   imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
+      // }
+    }
+  }
+}
+// 删除图片
+const deletePhoto = (index: number) => {
+  deciceInfo.value.photo.splice(index, 1)
+}
+// 预览图片
+const previewPhoto = (index: number) => {
+  showImagePreview({
+    images: deciceInfo.value.photo,
+    startPosition: index
+  })
+}
+// 关闭摄像头
+// const closeCamera = () => {
+//   showCamera.value = false
+// }
 // 获取字典
 const deviceTypeList = ref<any[]>([]) // 设备类型列表
 const fetchDict = () => {
@@ -114,7 +177,7 @@
     deciceInfo.value.watchObject = ''
   }
 })
-
+const empty = ref('')
 </script>
 
 <template>
@@ -142,6 +205,32 @@
             :before-close="searchTagNumber">
             <van-field v-model="searchForInput" placeholder="请输入安装位号" />
           </van-dialog>
+          <!-- 安装日期 -->
+          <van-field v-model="deciceInfo.installDate" is-link readonly name="installDate" label="安装日期"
+            placeholder="点击选择时间" @click="showDatePicker = true" required />
+          <van-popup v-model:show="showDatePicker" destroy-on-close position="bottom">
+            <van-date-picker :model-value="pickerValueInstallDate" @confirm="onConfirmInstallDate"
+              @cancel="showDatePicker = false" />
+          </van-popup>
+          <!-- 现场照片 -->
+          <van-field v-model="empty" readonly name="photo" label="现场照片" required>
+            <template #input>
+              <!-- 展示照片 -->
+              <div v-for="(item, index) in deciceInfo.photo" :key="index" class="show-photo">
+                <div class="del_d">
+                  <div class="del" @click="deletePhoto(index)"></div>
+                </div>
+                <img :src="item" alt="" srcset="" width="30px" height="30px" @click="previewPhoto(index)">
+              </div>
+            </template>
+            <template #right-icon>
+              <div class="camera" @click="takePictures" />
+            </template>
+          </van-field>
+
+          <!-- 照相组件 -->
+          <input ref="fileRef" style="display: none;opacity: 0;" multiple id="camera-photo" type="file" accept="image/*"
+            @change="onFileChange">
         </van-cell-group>
       </van-form>
     </div>
@@ -149,6 +238,30 @@
 </template>
 
 <style lang="scss" scoped>
+.show-photo{
+  position: relative;
+  margin-left: 10px;
+}
+.del_d {
+  position: absolute;
+  width: 16px;
+  height: 16px;
+  background: red;
+  border-radius: 50%;
+  top: -10px;
+  right: -10px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+
+  .del {
+    width: 10px;
+    height: 3px;
+    background: white;
+  }
+}
+
 $primary: #0D76D4;
 $--van-primary-color: #0D76D4;
 
@@ -181,4 +294,10 @@
     }
   }
 }
+
+.camera {
+  width: 24px;
+  height: 24px;
+  background: url('@/assets/icons/icon-camera.svg') no-repeat center center / cover;
+}
 </style>
diff --git a/src/views/mobile/info/components/showPosition.vue b/src/views/mobile/info/components/showPosition.vue
new file mode 100644
index 0000000..ce8d077
--- /dev/null
+++ b/src/views/mobile/info/components/showPosition.vue
@@ -0,0 +1,100 @@
+<!--
+  Description: 展示位置
+  Author: 李亚光
+  Date: 2024-09-03
+ -->
+<script lang="ts" setup name="showMapPosition">
+import AMap from '@/components/map/index.vue'
+const dialogFormVisible = ref(false) // 对话框是否显示
+
+// 初始化对话框
+const mapRef = ref()
+// 地图是否加载完成
+const completeMapFlag = ref(false)
+const init = ref(false)
+const position = ref<string[]>(['116.397428', '39.90923'])
+const initDialog = (location: string[]) => {
+  position.value = location
+  dialogFormVisible.value = true
+  if (completeMapFlag.value === true) {
+    mapRef.value.map.setCenter(location)
+    mapRef.value.removeMarker()
+    mapRef.value.addMarker({
+      position: location,
+      content: '',
+      label: '',
+    })
+  }
+  else {
+    init.value = true
+  }
+}
+const completeMap = () => {
+  completeMapFlag.value = true
+  if (init.value) {
+    mapRef.value.map.setCenter(position.value)
+    mapRef.value.addMarker({
+      position: position.value,
+      content: '',
+      label: '',
+    })
+  }
+}
+defineExpose({
+  initDialog,
+})
+const cancel = () => {
+  dialogFormVisible.value = false
+}
+
+const resetMap = () => {
+  mapRef.value.map.setCenter(position.value)
+  mapRef.value.map.setZoom(17.5)
+}
+</script>
+
+<template>
+  <van-popup v-model:show="dialogFormVisible" round closeable style="width: 96%;">
+    <div style="position: relative;">
+      <div style="width: 100%;height: 50vh;">
+        <a-map ref="mapRef" :zoom="17.5" @complete="completeMap" />
+      </div>
+      <div class="reset-icon" @click="resetMap">
+        <div class="icon"></div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<style lang="scss" scoped>
+::v-deep(.van-popup__close-icon) {
+  color: #000 !important;
+}
+.reset-icon{
+  width: 30px;
+  height: 30px;
+  position: absolute;
+  bottom: 10px;
+  right: 16px;
+  border-radius: 6px;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0px 0px 12px rgba(0, 0, 0, .12);
+  background-color: #fff;
+  .icon {
+    width: 24px;
+    height: 24px;
+    background: url('@/assets/icons/icon-location_current.svg') no-repeat center center / cover;
+  }
+}
+
+.el-dialog {
+  width: 700px;
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index 1c7cd17..beebc65 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -1,3 +1,380 @@
+<!--
+  Description: h5-信息查询详情
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchDetail">
+import { showToast } from 'vant'
+import showPosition from './components/showPosition.vue'
+// 基本信息
+const deviceInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  installDate: '2024-11-30',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 近期数据
+const data = ref([
+  {
+    logTime: '2024-05-18 17:05:01',
+    value: '0.00',
+    cell: '80'
+  },
+  {
+    logTime: '2024-07-18 13:02:11',
+    value: '1.00',
+    cell: '88'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '90'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '10'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: ''
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '50'
+  },
+  {
+    logTime: '2024-09-18 17:05:01',
+    value: '0.00',
+    cell: '2'
+  },
+])
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!deviceInfo.value.lon || !deviceInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([deviceInfo.value.lon, deviceInfo.value.lat])
+}
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('base-info')?.offsetHeight
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight
+  scrollHeight.value = window.innerHeight - 40 - 30 - (totalAreaHeight || 0) - (searchHeaderHeight || 0) - 14
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 计算电池图标
+const calcCellIcon = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70'
+  }
+}
+// 计算电池电量进度
+const calcCellWidth = (cell: string) => {
+  if (!cell) {
+    return '0'
+  }
+  else {
+    return Number(cell) >= 85 ? `${89}%` : `${cell}%`
+  }
+}
+// 计算电池颜色
+const calcCellColor = (cell: string) => {
+  if (!cell) {
+    return ''
+  }
+  if (Number(cell) <= 20) {
+    return 'cell-20-color'
+  }
+  else if (Number(cell) > 20 && Number(cell) < 70) {
+    return 'cell-40-color'
+  }
+  else if (Number(cell) >= 70) {
+    return 'cell-70-color'
+  }
+}
+</script>
 <template>
-  信息查询详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ deviceInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备类型</div>
+        <div class="value">{{ deviceInfo.devTypeName }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ deviceInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ deviceInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ deviceInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">安装日期</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">最近上报时间</div>
+        <div class="value">{{ deviceInfo.installDate }}</div>
+      </div>
+    </div>
+    <!-- 近期数据 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        近期数据
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in data" :key="index" :class="index !== 0 ? 'top-border' : ''" class="result-item">
+            <div class="cell">
+              <div class="title">{{ item.logTime }}</div>
+              <div class="value">
+                <!-- 电池图标 -->
+                <div class="cell-icon" :class="calcCellIcon(item.cell)">
+                  <!-- 电池电量 -->
+                  <div style="height: 14px;" :style="{ width: `${calcCellWidth(item.cell)}` }"
+                    :class="calcCellColor(item.cell)"></div>
+                  <!-- 数字 -->
+                  <div class="cell-count">{{ item.cell }}</div>
+                </div>
+
+
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">燃气浓度</div>
+              <div class="value">{{ item.value }}%LEL</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.cell-icon {
+  position: relative;
+  width: 30px;
+  height: 18px;
+  display: flex;
+  align-items: center;
+  padding-left: 2px;
+  .cell-count{
+    position: absolute;
+    color: #000;
+    text-align: center;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 0.8rem;
+    align-items: center;
+  }
+}
+
+.cell-70 {
+  background: url('@/assets/icons/icon-cell-70.svg') no-repeat center center / cover;
+}
+
+.cell-70-color {
+  background-color: rgb(37, 202, 37);
+}
+
+.cell-40 {
+  background: url('@/assets/icons/icon-cell-40.svg') no-repeat center center / cover;
+}
+
+.cell-40-color {
+  background-color: orange;
+}
+
+.cell-20 {
+  background: url('@/assets/icons/icon-cell-20.svg') no-repeat center center / cover;
+}
+
+.cell-20-color {
+  background-color: red;
+}
+
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>
diff --git a/src/views/mobile/info/result.vue b/src/views/mobile/info/result.vue
index 895ef64..cd3404e 100644
--- a/src/views/mobile/info/result.vue
+++ b/src/views/mobile/info/result.vue
@@ -1,3 +1,219 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearchResult">
+const total = ref(0)
+const list = ref([
+  {
+    devcode: '24102708',
+    devTypeName: '燃气智能监测终端',
+    tagNumber: 'N57C114',
+    position: '示范区联络线中压A闸9',
+    address: '百环花园调压站南侧',
+    installDate: '2024-11-30'
+  },
+  {
+    devcode: '322024010010',
+    devTypeName: '燃气智能监测终端（一体化）',
+    tagNumber: 'cprl001',
+    position: '92301部队中压A闸1',
+    address: '西环里35号院2号楼南',
+    installDate: '2024-01-30'
+  },
+  {
+    devcode: '341524019XX1',
+    devTypeName: '管网哨兵',
+    tagNumber: 'GX_33101',
+    position: '北新中压A闸6',
+    address: '北京市海淀区街道1',
+    installDate: '2024-11-18'
+  },
+  {
+    devcode: '211424152117',
+    devTypeName: '智能警示桩',
+    tagNumber: 'NCX_0001',
+    position: '东辰小区中压A闸1',
+    address: '北京市西城区复外大街与三里河路交叉口(地铁1号线地铁站木樨地站北侧)三里河3区',
+    installDate: '2024-11-26'
+  },
+  {
+    devcode: 'YT20240913',
+    devTypeName: '场站监测云台',
+    tagNumber: 'N53A888',
+    position: '定辛庄小学中压A闸1T',
+    address: '眼镜城',
+    installDate: '2024-09-13'
+  },
+])
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // total区域
+  const totalAreaHeight = document.getElementById('search-info')?.offsetHeight || 0
+  // 查询结果头部
+  const searchHeaderHeight = document.getElementById('title')?.offsetHeight || 0
+  scrollHeight.value = window.innerHeight - 40 - 30 - totalAreaHeight - searchHeaderHeight - 14
+}
+// 查看详情
+const $router = useRouter()
+const detail = (row: any) => {
+  $router.push({
+    name: 'InfoDetail'
+  })
+}
+onMounted(() => {
+  calcHeight()
+})
+onActivated(() => {
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+</script>
 <template>
-  信息查询结果
+  <div class="info-container">
+    <div id="search-info" class="search-info">
+      <span>共找到 </span>
+      <span style="font-weight: 700;">
+        {{ total }}条
+      </span>
+      <span>匹配的设备</span>
+    </div>
+    <!-- 查询结果 -->
+    <div class="search-result">
+      <div id="title" class="title">
+        <div class="symbol"></div>
+        查询结果
+      </div>
+      <!-- 结果 -->
+      <el-scrollbar :max-height="`${scrollHeight}px`" style="margin-top: 14px;">
+        <lazy-component>
+          <div v-for="(item, index) in list" :key="index" class="result-item" :class="index !== 0 ? 'top-border' : ''" @click="detail(item)">
+            <div class="devcode"> {{ item.devcode }}</div>
+            <div class="cell">
+              <div class="title">设备类型</div>
+              <div class="value">{{ item.devTypeName }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">安装位置</div>
+              <div class="value">{{ item.tagNumber }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">位置名称</div>
+              <!-- <div class="value">{{ item.position }}</div> -->
+              <div class="value"><van-text-ellipsis :rows="1" :content="item.position" expand-text="展开" collapse-text="收起" /></div>
+            </div>
+            <div class="cell">
+              <div class="title">详细位置</div>
+              <!-- <div class="value">{{ item.address }}</div> -->
+               <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.address" expand-text="展开" collapse-text="收起" />
+               </div>
+            </div>
+            <div class="cell">
+              <div class="title">安装日期</div>
+              <div class="value">{{ item.installDate }}</div>
+            </div>
+          </div>
+        </lazy-component>
+      </el-scrollbar>
+    </div>
+  </div>
 </template>
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+      // border-left: 4px solid #0d76d4;
+      // border-radius: 2px;
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      padding: 4px;
+      // box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+      .devcode {
+        font-weight: 700;
+        font-size: 1.3rem;
+      }
+
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 14px;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+          font-weight: 500;
+        }
+
+        .title,
+        .value {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+      }
+
+
+    }
+  }
+}
+</style>
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index e98fed6..e382931 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -1,3 +1,71 @@
+<!--
+  Description: h5-信息查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5InfoSearch">
+const $router = useRouter()
+// 查询条件
+const searchQuery = ref({
+  devcode: '',
+  tagNumber: '',
+  position: '',
+  address: '',
+})
+
+// 查询
+const search = () => {
+  $router.push({
+    name: 'InfoResult'
+  })
+}
+</script>
+
 <template>
-  信息查询
+  <div class="info-container">
+    <!-- 查询条件 -->
+    <div class="search-info">
+      <van-form>
+        <van-cell-group>
+          <van-field v-model="searchQuery.devcode" label="设备编号" placeholder="输入设备编号" clearable input-align="right" />
+          <van-field v-model="searchQuery.tagNumber" label="安装位号" placeholder="输入安装位号" clearable input-align="right" />
+          <van-field v-model="searchQuery.position" label="位置名称" placeholder="输入位置名称" clearable input-align="right" />
+          <van-field v-model="searchQuery.address" label="安装地点" placeholder="输入安装地点" clearable input-align="right" />
+        </van-cell-group>
+      </van-form>
+    </div>
+    <!-- 查询按钮 -->
+    <div class="search-btn">
+      <el-button type="primary" style="width: 96%;" @click="search">开始查询</el-button>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+
+
+    ::v-deep(.van-cell__title) {
+      font-weight: 700;
+    }
+  }
+  .search-btn {
+    width: 100%;
+    position: fixed;
+    bottom: 1vh;
+    display: flex;
+    justify-content: center;
+  }
+}
+</style>
diff --git a/src/views/mobile/record/detail.vue b/src/views/mobile/record/detail.vue
index 2fbea2f..1176721 100644
--- a/src/views/mobile/record/detail.vue
+++ b/src/views/mobile/record/detail.vue
@@ -1,3 +1,204 @@
+<!--
+  Description: h5-运维详情
+  Author: 李亚光
+  Date: 2025-01-03
+ -->
+<script lang="ts" setup name="H5OperationDetail">
+import { showToast } from 'vant'
+import showPosition from '@/views/mobile/info/components/showPosition.vue'
+// 基本信息
+const detailInfo = ref({
+  devcode: '24102708',
+  devTypeName: '燃气智能监测终端',
+  repairType: '新装',
+  tagNumber: 'N57C114',
+  position: '示范区联络线中压A闸9',
+  address: '百环花园调压站南侧',
+  repairDate: '2024-11-30',
+  repairPerson: '张三',
+  repairContent: '更换电池以及维护保养',
+  deptName: '第一分公司/运维一所',
+  lon: '116.4159851074',
+  lat: '39.9000473022',
+})
+// 查看位置
+const locationRef = ref()
+const viewLocation = () => {
+  if (!detailInfo.value.lon || !detailInfo.value.lat) {
+    showToast('该位置缺少坐标信息');
+    return
+  }
+  locationRef.value.initDialog([detailInfo.value.lon, detailInfo.value.lat])
+}
+
+</script>
 <template>
-  详情
+  <div class="info-container">
+    <!-- 位置弹窗 -->
+    <show-position ref="locationRef" />
+    <!-- 基本信息 -->
+    <div id="base-info" class="search-info">
+      <div class="cell">
+        <div class="title">运维类型</div>
+        <div class="value">{{ detailInfo.repairType }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">设备编号</div>
+        <div class="value">{{ detailInfo.devcode }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">安装位置</div>
+        <div class="value">{{ detailInfo.tagNumber }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">位置名称</div>
+        <div class="value">{{ detailInfo.position }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">详细位置</div>
+        <div class="value" @click="viewLocation">{{ detailInfo.address }}
+          <span class="location"></span>
+        </div>
+      </div>
+      <div class="cell">
+        <div class="title">运维日期</div>
+        <div class="value">{{ detailInfo.repairDate }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">运维人员</div>
+        <div class="value">{{ detailInfo.repairPerson }}</div>
+      </div>
+      <div class="cell">
+        <div class="title">运维内容</div>
+        <div class="value">{{ detailInfo.repairContent }}</div>
+      </div>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.info-container {
+  width: 100%;
+  height: calc(100vh - 40px);
+  overflow: hidden;
+  color: #444;
+
+  .search-info {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-top: 0.8rem;
+    padding-bottom: 0.8rem;
+    padding-left: 0.8rem;
+    font-size: 1.2rem;
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+      align-items: center;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1rem;
+        vertical-align: middle;
+        // display: flex;
+        // flex-direction: column;
+        // justify-content: center;
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+
+        .location {
+          display: inline-block;
+          width: 22px;
+          height: 22px;
+          background: url('@/assets/icons/icon-location.svg') no-repeat center center / cover;
+          vertical-align: middle;
+          margin-left: 8px;
+        }
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+      }
+
+      // .title,
+      // .value {
+      //   white-space: nowrap;
+      //   overflow: hidden;
+      //   text-overflow: ellipsis;
+      // }
+    }
+  }
+
+  .search-result {
+    background-color: #fff;
+    width: 96%;
+    margin: 0 auto;
+    margin-top: 1vh;
+    border-radius: 6px;
+    padding: 4px;
+    padding-left: 0.6rem;
+
+    .title {
+      display: flex;
+      font-size: 1.2rem;
+
+      .symbol {
+        width: 4px;
+        height: 22px;
+        background-color: #0d76d4;
+        border-radius: 4px;
+        margin-right: 8px;
+      }
+    }
+
+    .top-border {
+      border-top: 1px solid #e4e7ed;
+      // margin-top: 8px;
+    }
+
+    .result-item {
+      .cell {
+        display: flex;
+        justify-content: space-between;
+        padding-top: 6px;
+        padding-bottom: 6px;
+        padding-right: 18px;
+        align-items: center;
+
+        .value {
+          color: #888;
+          width: 80%;
+          text-align: right;
+          font-size: 1rem;
+          vertical-align: middle;
+          // display: flex;
+          // flex-direction: column;
+          // justify-content: center;
+          display: flex;
+          align-items: center;
+          justify-content: flex-end;
+
+        }
+
+        .title {
+          width: 20%;
+          white-space: nowrap;
+        }
+      }
+    }
+
+  }
+}
+</style>
diff --git a/src/views/mobile/record/search.vue b/src/views/mobile/record/search.vue
index 2398a99..5f16354 100644
--- a/src/views/mobile/record/search.vue
+++ b/src/views/mobile/record/search.vue
@@ -1,3 +1,503 @@
+<!--
+  Description: h5-运维记录查询
+  Author: 李亚光
+  Date: 2025-01-02
+ -->
+<script lang="ts" setup name="H5OperationRecord">
+import dayjs from 'dayjs'
+import { showToast } from 'vant'
+import { getDictByCode } from '@/api/system/dict'
+import { getDeviceTypeListPage } from '@/api/home/device/type'
+import useUserStore from '@/store/modules/user'
+const list = ref([
+  {
+    devcode: '24102708',
+    devTypeName: '燃气智能监测终端',
+    repairType: '新装',
+    tagNumber: 'N57C114',
+    position: '示范区联络线中压A闸9',
+    address: '百环花园调压站南侧',
+    repairDate: '2024-11-30',
+    deptName: '第一分公司/运维一所'
+  },
+  {
+    devcode: '322024010010',
+    devTypeName: '燃气智能监测终端（一体化）',
+    tagNumber: 'cprl001',
+    position: '92301部队中压A闸1',
+    address: '西环里35号院2号楼南',
+    repairDate: '2024-01-30',
+    deptName: '第一分公司/运维一所',
+    repairType: '新装',
+  },
+  {
+    devcode: '341524019XX1',
+    devTypeName: '管网哨兵',
+    tagNumber: 'GX_33101',
+    position: '北新中压A闸6',
+    address: '北京市海淀区街道1',
+    repairDate: '2024-11-18',
+    deptName: '第一分公司/运维一所',
+    repairType: '新装',
+  },
+  {
+    devcode: '211424152117',
+    devTypeName: '智能警示桩',
+    tagNumber: 'NCX_0001',
+    position: '东辰小区中压A闸1',
+    address: '北京市西城区复外大街与三里河路交叉口(地铁1号线地铁站木樨地站北侧)三里河3区',
+    repairDate: '2024-11-26',
+    deptName: '第一分公司/运维一所',
+    repairType: '新装',
+  },
+  {
+    devcode: 'YT20240913',
+    devTypeName: '场站监测云台',
+    tagNumber: 'N53A888',
+    position: '定辛庄小学中压A闸1T',
+    address: '眼镜城',
+    repairDate: '2024-09-13',
+    deptName: '第一分公司/运维一所',
+    repairType: '新装',
+  },
+])
+const userInfo = useUserStore()
+const searchQuery = ref({
+  repairType: '',
+  deviceType: '',
+  userId: '',
+  timeType: '', // 时间类型  1 近7日 2近30日 3 自定义时间
+  beginTime: '',
+  endTime: '',
+})
+const searchQueryForNames = ref({
+  repairTypeName: '运维类型',
+  deviceTypeName: '设备类型',
+})
+// 运维类型
+const showRepairType = ref(false)
+const pickerRepairType = ref([])
+// 选择运维类型
+const selectRepairType = () => {
+  showRepairType.value = true
+}
+// 确认运维类型
+const onConfirmRepairType = ({ selectedValues, selectedOptions }) => {
+  searchQuery.value.repairType = selectedOptions[0]?.value
+  searchQueryForNames.value.repairTypeName = selectedOptions[0]?.text === '全部' ? '运维类型' : selectedOptions[0]?.text
+  pickerRepairType.value = selectedValues
+  showRepairType.value = false
+}
+// 设备类型
+const showDeviceType = ref(false)
+const pickerDeviceType = ref([])
+// 选择设备类型
+const selectDeviceType = () => {
+  showDeviceType.value = true
+}
+// 确认设备类型
+const onConfirmDeviceType = ({ selectedValues, selectedOptions }) => {
+  searchQuery.value.deviceType = selectedOptions[0]?.value
+  searchQueryForNames.value.deviceTypeName = selectedOptions[0]?.text === '全部' ? '设备类型' : selectedOptions[0]?.text
+  pickerDeviceType.value = selectedValues
+  showDeviceType.value = false
+}
+// 按钮类选择
+const searchBtn = (type: string) => {
+  // 仅看本人
+  if (type === 'self') {
+    searchQuery.value.userId = searchQuery.value.userId ? '' : userInfo.id
+  }
+  //  近7日
+  else if (type === 'week') {
+    if (searchQuery.value.timeType === '1') {
+      searchQuery.value.timeType = ''
+      searchQuery.value.beginTime = ''
+      searchQuery.value.endTime = ''
+    }
+    else {
+      searchQuery.value.timeType = '1'
+      searchQuery.value.beginTime = dayjs().subtract(7, 'day').format('YYYY-MM-DD')
+      searchQuery.value.endTime = dayjs().format('YYYY-MM-DD')
+    }
+  }
+  //  近30日
+  else if (type === 'month') {
+    if (searchQuery.value.timeType === '2') {
+      searchQuery.value.timeType = ''
+      searchQuery.value.beginTime = ''
+      searchQuery.value.endTime = ''
+    }
+    else {
+      searchQuery.value.timeType = '2'
+      searchQuery.value.beginTime = dayjs().subtract(1, 'month').format('YYYY-MM-DD')
+      searchQuery.value.endTime = dayjs().format('YYYY-MM-DD')
+    }
+  }
+}
+// 自定义日期
+const showDate = ref(false)
+// 默认开始日期
+const startDate = ref<string[]>([])
+// 默认结束日期
+const endDate = ref<string[]>([])
+startDate.value = dayjs().subtract(1, 'month').format('YYYY-MM-DD').split('-')
+endDate.value = dayjs().format('YYYY-MM-DD').split('-')
+// 结束日期的最大日期限制
+// const endMaxDate = ref(new Date(2025, 5, 1))
+// 选择日期
+const selectDate = () => {
+  showDate.value = true
+}
+// 确认日期选择
+const onConfirmDate = () => {
+  // 先判断结束日期是否在开始日期之前
+  if (new Date(endDate.value.join('-')).getTime() - new Date(startDate.value.join('-')).getTime() < 0) {
+    showToast('请选择正确时间范围');
+    return
+  }
+  // console.log('确认日期')
+  searchQuery.value.timeType = '3'
+  searchQuery.value.beginTime = startDate.value.join('-')
+  searchQuery.value.endTime = endDate.value.join('-')
+  showDate.value = false
+}
+// 取消日期选择
+const onCancelDate = () => {
+  showDate.value = false
+}
+// 清空自定义日期
+const cancelDate = () => {
+  searchQuery.value.timeType = ''
+  searchQuery.value.beginTime = ''
+  searchQuery.value.endTime = ''
+}
+const repairTypeList = ref<{ text: string; value: string }[]>([]) // 运维类型
+const deviceTypeList = ref<{ text: string; value: string }[]>([]) // 设备类型
+// 获取字典
+const fetchDict = async () => {
+  // 运维类型
+  getDictByCode('repairType').then(res => {
+    repairTypeList.value = res.data.map((item: { id: string; name: string; value: string }) => ({ text: item.name, value: item.value }))
+    repairTypeList.value.unshift({ text: '全部', value: '' })
+  })
+  // 设备类型
+  getDeviceTypeListPage({ offset: 1, limit: 9999 }).then(res => {
+    deviceTypeList.value = res.data.rows.map((item: any) => ({ text: item.typeName, value: item.id }))
+    deviceTypeList.value.unshift({ text: '全部', value: '' })
+  })
+}
+fetchDict()
+// 计算滚动区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+  // 公共头部高度40
+  // 边距安全 30
+  // 导出按钮
+  const exportBtnHeight = document.getElementById('export-btn-log')?.offsetHeight || 0
+  // 查询头部
+  const searchHeaderHeight = document.getElementById('search-area-log')?.offsetHeight || 0
+  scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+  calcHeight()
+})
+window.addEventListener('resize', () => {
+  calcHeight()
+})
+// 查看详情
+const $router = useRouter()
+const detail = (row: any) => {
+  $router.push({
+    name: 'RecordDetail'
+  })
+}
+</script>
+
 <template>
-  运维记录查询
+  <div style="position: relative;">
+    <!-- 查询条件 -->
+    <div id="search-area-log" class="search-area">
+      <!-- 运维类型选择 -->
+      <van-popup v-model:show="showRepairType" destroy-on-close position="bottom">
+        <van-picker :columns="repairTypeList" :model-value="pickerRepairType" @confirm="onConfirmRepairType"
+          @cancel="showRepairType = false" />
+      </van-popup>
+      <!-- 设备类型选择 -->
+      <van-popup v-model:show="showDeviceType" destroy-on-close position="bottom">
+        <van-picker :columns="deviceTypeList" :model-value="pickerDeviceType" @confirm="onConfirmDeviceType"
+          @cancel="showDeviceType = false" />
+      </van-popup>
+      <!-- 开始结束日期 -->
+      <van-popup v-model:show="showDate" destroy-on-close position="bottom">
+        <van-picker-group title="预约日期" :tabs="['开始日期', '结束日期']" @confirm="onConfirmDate" @cancel="onCancelDate">
+          <van-date-picker v-model="startDate" />
+          <van-date-picker v-model="endDate" />
+        </van-picker-group>
+      </van-popup>
+      <div class="search-container-top">
+        <div class="search-item" @click="selectRepairType">
+          <span class="value" :class="searchQueryForNames.repairTypeName === '运维类型' ? '' : 'active'">{{
+            searchQueryForNames.repairTypeName }}</span>
+          <van-icon name="arrow-down" class="icon" />
+        </div>
+
+        <div class="search-item">
+          <span class="value">管理单位</span>
+          <van-icon name="arrow-down" class="icon" />
+        </div>
+        <div class="search-item" @click="selectDeviceType">
+          <span class="value" :class="searchQueryForNames.deviceTypeName === '设备类型' ? '' : 'active'">{{
+            searchQueryForNames.deviceTypeName }}</span>
+          <van-icon name="arrow-down" class="icon" />
+        </div>
+
+        <div class="search-btn" @click="searchBtn('self')" :class="searchQuery.userId ? 'active-btn' : ''">
+          仅看本人
+        </div>
+      </div>
+      <div class="search-container-bottom">
+        <div class="search-btn" @click="searchBtn('week')" :class="searchQuery.timeType === '1' ? 'active-btn' : ''">
+          近7日
+        </div>
+        <div class="search-btn" @click="searchBtn('month')" :class="searchQuery.timeType === '2' ? 'active-btn' : ''">
+          近30日
+        </div>
+        <div class="date" :class="searchQuery.timeType === '3' ? 'active-btn' : ''">
+          <span @click="selectDate">
+            <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
+            {{ searchQuery.timeType === '3' ? searchQuery.beginTime : '开始时间' }}
+          </span>
+          <span @click="selectDate">至</span>
+          <span>
+            <span @click="selectDate">{{ searchQuery.timeType === '3' ? searchQuery.endTime : '结束时间' }}</span>
+            <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
+          </span>
+          <van-icon v-if="searchQuery.timeType === '3'" class="icon" name="close" size="1.2rem" @click="cancelDate" />
+        </div>
+      </div>
+    </div>
+    <!-- 查询结果 -->
+    <div class="search-result">
+      <el-scrollbar :max-height="`${scrollHeight}px`">
+        <lazy-component>
+          <div v-for="(item, index) in list" :key="index" class="result-item" :class="index !== 0 ? 'top-border' : ''"
+            @click="detail(item)">
+            <div class="devcode"> {{ item.devcode }}</div>
+            <div class="cell">
+              <div class="title">设备类型</div>
+              <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.devTypeName" expand-text="展开" collapse-text="收起" />
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">运维类型</div>
+              <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.repairType" expand-text="展开" collapse-text="收起" />
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">安装位置</div>
+              <div class="value">{{ item.tagNumber }}</div>
+            </div>
+            <div class="cell">
+              <div class="title">管理单位</div>
+              <div class="value">
+                <van-text-ellipsis :rows="1" :content="item.deptName" expand-text="展开" collapse-text="收起" />
+              </div>
+            </div>
+            <div class="cell">
+              <div class="title">运维时间</div>
+              <div class="value">{{ item.repairDate }}</div>
+            </div>
+          </div>
+        </lazy-component>
+        <!-- <div class="to-top">
+          <van-back-top />
+        </div> -->
+      </el-scrollbar>
+    </div>
+    <!-- 导出按钮 -->
+    <div id="export-btn-log" class="export-btn">
+      <el-button type="primary" style="width: 96%;" @click="exportLog">导出运维记录</el-button>
+    </div>
+  </div>
 </template>
+
+<style lang="scss" scoped>
+.to-top {
+  ::v-deep(.van-back-top) {
+    opacity: 0.4 !important;
+  }
+}
+
+$primary: #0D76D4;
+$--van-primary-color: #0D76D4;
+
+::v-deep(.van-picker-column__item--selected) {
+  color: $primary !important;
+}
+
+.active {
+  color: $primary !important;
+}
+
+.active-btn {
+  color: $primary !important;
+  border: 1px solid $primary !important;
+}
+
+.search-area {
+  background-color: #fff;
+  margin: 6px;
+  font-size: 0.8rem;
+  border-radius: 8px;
+}
+
+.search-container-top {
+  width: 100%;
+  display: flex;
+  padding: 6px;
+  // padding-left: 0;
+  // padding-right: 0;
+  justify-content: space-around;
+  color: #555;
+
+  .search-item {
+    width: 26%;
+    text-align: center;
+    padding: 4px;
+    display: flex;
+    // justify-content: space-between;
+    align-items: center;
+    vertical-align: middle;
+
+    .value {
+      width: 100%;
+
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .icon {
+      // display: inline-block;
+      // width: 20px;
+      // height: 20px;
+      vertical-align: middle;
+      margin-left: 6px;
+      // background: url('@/assets/icons/search-down.svg') no-repeat center center / cover;
+    }
+  }
+
+  .search-btn {
+    width: 20%;
+    padding: 4px;
+    text-align: center;
+    background-color: #fff;
+    border-radius: 16px;
+    border: 1px solid #e4e7ed;
+  }
+}
+
+.search-container-bottom {
+  width: 100%;
+  display: flex;
+  padding: 6px;
+  // padding-left: 0;
+  // padding-right: 0;
+  padding-top: 0;
+  color: #555;
+  justify-content: space-around;
+
+  .search-btn {
+    width: 18%;
+    padding: 4px;
+    text-align: center;
+    background-color: #fff;
+    border-radius: 16px;
+    border: 1px solid #e4e7ed;
+  }
+
+  .date {
+    width: 62%;
+    background-color: #fff;
+    border-radius: 6px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 5px;
+    border: 1px solid #e4e7ed;
+
+    // vertical-align:bottom;
+    .icon {
+      vertical-align: middle;
+    }
+  }
+}
+
+.search-result {
+  background-color: #fff;
+  margin: 6px;
+  font-size: 0.8rem;
+  border-radius: 8px;
+  color: #444;
+  padding: 14px;
+  padding-bottom: 0px;
+
+  // height: 600px;
+  .top-border {
+    border-top: 1px solid #e4e7ed;
+    // margin-top: 8px;
+  }
+
+  .result-item {
+    padding: 4px;
+
+    // box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
+    .devcode {
+      font-weight: 700;
+      font-size: 1.3rem;
+    }
+
+    .cell {
+      display: flex;
+      justify-content: space-between;
+      padding-top: 6px;
+      padding-bottom: 6px;
+      padding-right: 14px;
+
+      .value {
+        color: #888;
+        width: 80%;
+        text-align: right;
+        font-size: 1.05rem;
+      }
+
+      .title {
+        width: 20%;
+        white-space: nowrap;
+        font-weight: 500;
+        font-size: 1.2rem;
+      }
+
+      .title,
+      .value {
+        white-space: nowrap;
+        // overflow: hidden;
+        // text-overflow: ellipsis;
+      }
+    }
+
+
+  }
+}
+
+.export-btn {
+  width: 100%;
+  position: fixed;
+  bottom: 0;
+  display: flex;
+  justify-content: center;
+}
+</style>