diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>
diff --git a/src/views/basic/device/list.vue b/src/views/basic/device/list.vue
index e384713..9a98a52 100644
--- a/src/views/basic/device/list.vue
+++ b/src/views/basic/device/list.vue
@@ -30,8 +30,8 @@
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
   { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '180' },
 ])
 const dataList = ref<Array<IDeviceInfo>>([]) // 表格数据
 
@@ -136,7 +136,7 @@
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    delDevice(row.id).then((res) => {
+    delDevice([row.id]).then((res) => {
       if (res.code === 200) {
         ElMessage.success(`设备 ${row.devcode} 删除成功`)
         searchList()
@@ -217,6 +217,12 @@
               <el-button size="small" type="primary" link @click="detail(row)">
                 查看
               </el-button>
+              <el-button size="small" type="primary" link @click="detail(row)">
+                编辑
+              </el-button>
+              <el-button size="small" type="danger" link @click="deleteById(row)">
+                删除
+              </el-button>
             </template>
           </el-table-column>
         </template>

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>
diff --git a/src/views/basic/device/list.vue b/src/views/basic/device/list.vue
index e384713..9a98a52 100644
--- a/src/views/basic/device/list.vue
+++ b/src/views/basic/device/list.vue
@@ -30,8 +30,8 @@
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
   { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '180' },
 ])
 const dataList = ref<Array<IDeviceInfo>>([]) // 表格数据
 
@@ -136,7 +136,7 @@
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    delDevice(row.id).then((res) => {
+    delDevice([row.id]).then((res) => {
       if (res.code === 200) {
         ElMessage.success(`设备 ${row.devcode} 删除成功`)
         searchList()
@@ -217,6 +217,12 @@
               <el-button size="small" type="primary" link @click="detail(row)">
                 查看
               </el-button>
+              <el-button size="small" type="primary" link @click="detail(row)">
+                编辑
+              </el-button>
+              <el-button size="small" type="danger" link @click="deleteById(row)">
+                删除
+              </el-button>
             </template>
           </el-table-column>
         </template>
diff --git a/src/views/basic/locate/detail.vue b/src/views/basic/locate/detail.vue
index dd3c5cd..3b9f0f9 100644
--- a/src/views/basic/locate/detail.vue
+++ b/src/views/basic/locate/detail.vue
@@ -50,14 +50,14 @@
 const deviceList = ref<Array<IDeviceInfo>>([])
 // 表头
 const devColumns = ref<TableColumn[]>([
-  { text: '状态', value: 'onlineStateName', align: 'center', width: '60' },
-  { text: '设备编号', value: 'devcode', align: 'center', width: '160' },
-  { text: '监测类型', value: 'watchType', align: 'center', width: '160' },
+  { text: '状态', value: 'onlineStateName', align: 'center', width: '100' },
+  { text: '设备编号', value: 'devcode', align: 'center', width: '200' },
+  { text: '监测类型', value: 'watchType', align: 'center', width: '200' },
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
-  { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '安装时间', value: 'installDate', align: 'center', width: '200' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '200' },
 ])
 
 // 逻辑

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>
diff --git a/src/views/basic/device/list.vue b/src/views/basic/device/list.vue
index e384713..9a98a52 100644
--- a/src/views/basic/device/list.vue
+++ b/src/views/basic/device/list.vue
@@ -30,8 +30,8 @@
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
   { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '180' },
 ])
 const dataList = ref<Array<IDeviceInfo>>([]) // 表格数据
 
@@ -136,7 +136,7 @@
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    delDevice(row.id).then((res) => {
+    delDevice([row.id]).then((res) => {
       if (res.code === 200) {
         ElMessage.success(`设备 ${row.devcode} 删除成功`)
         searchList()
@@ -217,6 +217,12 @@
               <el-button size="small" type="primary" link @click="detail(row)">
                 查看
               </el-button>
+              <el-button size="small" type="primary" link @click="detail(row)">
+                编辑
+              </el-button>
+              <el-button size="small" type="danger" link @click="deleteById(row)">
+                删除
+              </el-button>
             </template>
           </el-table-column>
         </template>
diff --git a/src/views/basic/locate/detail.vue b/src/views/basic/locate/detail.vue
index dd3c5cd..3b9f0f9 100644
--- a/src/views/basic/locate/detail.vue
+++ b/src/views/basic/locate/detail.vue
@@ -50,14 +50,14 @@
 const deviceList = ref<Array<IDeviceInfo>>([])
 // 表头
 const devColumns = ref<TableColumn[]>([
-  { text: '状态', value: 'onlineStateName', align: 'center', width: '60' },
-  { text: '设备编号', value: 'devcode', align: 'center', width: '160' },
-  { text: '监测类型', value: 'watchType', align: 'center', width: '160' },
+  { text: '状态', value: 'onlineStateName', align: 'center', width: '100' },
+  { text: '设备编号', value: 'devcode', align: 'center', width: '200' },
+  { text: '监测类型', value: 'watchType', align: 'center', width: '200' },
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
-  { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '安装时间', value: 'installDate', align: 'center', width: '200' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '200' },
 ])
 
 // 逻辑
diff --git a/src/views/data/query/data-query.ts b/src/views/data/query/data-query.ts
index 885a786..3af1eb5 100644
--- a/src/views/data/query/data-query.ts
+++ b/src/views/data/query/data-query.ts
@@ -11,17 +11,10 @@
 
 export interface IDataDetailInfo {
   id: string
-  groupId: string
-  groupName: string
   devcode: string
-  deviceType?: string
-  deviceTypeName?: string
-  status?: string
-  statusName?: string
+  ddata: string
   cell?: string
-  dataJson: string
-  decryptBeforeData?: string
-  decryptAfterData?: string
+  descn?: string
   pci?: string
   rsrp?: string
   snr?: string

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>
diff --git a/src/views/basic/device/list.vue b/src/views/basic/device/list.vue
index e384713..9a98a52 100644
--- a/src/views/basic/device/list.vue
+++ b/src/views/basic/device/list.vue
@@ -30,8 +30,8 @@
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
   { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '180' },
 ])
 const dataList = ref<Array<IDeviceInfo>>([]) // 表格数据
 
@@ -136,7 +136,7 @@
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    delDevice(row.id).then((res) => {
+    delDevice([row.id]).then((res) => {
       if (res.code === 200) {
         ElMessage.success(`设备 ${row.devcode} 删除成功`)
         searchList()
@@ -217,6 +217,12 @@
               <el-button size="small" type="primary" link @click="detail(row)">
                 查看
               </el-button>
+              <el-button size="small" type="primary" link @click="detail(row)">
+                编辑
+              </el-button>
+              <el-button size="small" type="danger" link @click="deleteById(row)">
+                删除
+              </el-button>
             </template>
           </el-table-column>
         </template>
diff --git a/src/views/basic/locate/detail.vue b/src/views/basic/locate/detail.vue
index dd3c5cd..3b9f0f9 100644
--- a/src/views/basic/locate/detail.vue
+++ b/src/views/basic/locate/detail.vue
@@ -50,14 +50,14 @@
 const deviceList = ref<Array<IDeviceInfo>>([])
 // 表头
 const devColumns = ref<TableColumn[]>([
-  { text: '状态', value: 'onlineStateName', align: 'center', width: '60' },
-  { text: '设备编号', value: 'devcode', align: 'center', width: '160' },
-  { text: '监测类型', value: 'watchType', align: 'center', width: '160' },
+  { text: '状态', value: 'onlineStateName', align: 'center', width: '100' },
+  { text: '设备编号', value: 'devcode', align: 'center', width: '200' },
+  { text: '监测类型', value: 'watchType', align: 'center', width: '200' },
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
-  { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '安装时间', value: 'installDate', align: 'center', width: '200' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '200' },
 ])
 
 // 逻辑
diff --git a/src/views/data/query/data-query.ts b/src/views/data/query/data-query.ts
index 885a786..3af1eb5 100644
--- a/src/views/data/query/data-query.ts
+++ b/src/views/data/query/data-query.ts
@@ -11,17 +11,10 @@
 
 export interface IDataDetailInfo {
   id: string
-  groupId: string
-  groupName: string
   devcode: string
-  deviceType?: string
-  deviceTypeName?: string
-  status?: string
-  statusName?: string
+  ddata: string
   cell?: string
-  dataJson: string
-  decryptBeforeData?: string
-  decryptAfterData?: string
+  descn?: string
   pci?: string
   rsrp?: string
   snr?: string
diff --git a/src/views/data/query/dataDetailDialog.vue b/src/views/data/query/dataDetailDialog.vue
index c09a2a9..0cbe68f 100644
--- a/src/views/data/query/dataDetailDialog.vue
+++ b/src/views/data/query/dataDetailDialog.vue
@@ -10,9 +10,29 @@
 const sampleDataArray = ref<Array<lineDataI>>([])
 const chartTitle = ref<string>('')
 
+const radioItems = ref([
+  { name: '波形图', value: 'data-wave' },
+  { name: '频谱图', value: 'data-spectrum' },
+])
+const current = ref('')
+const currentLabel = ref('')
+
 const sampleChartRef = ref()
 
 // 逻辑
+// 详情页的各个tab切换操作
+const radioChangeHandler = (newVal: string | number | boolean) => {
+  const radioTarget = radioItems.value.filter(item => item.name === newVal)
+  if (radioTarget.length > 0) {
+    currentLabel.value = radioTarget[0].name
+    current.value = radioTarget[0].value
+  }
+  else {
+    currentLabel.value = radioItems.value[0].name
+    current.value = radioItems.value[0].value
+  }
+}
+
 const resetForm = () => {
   showDialog.value = false
 }
@@ -21,12 +41,16 @@
   // 从路由中获取参数
   showDialog.value = true
 
+  // 默认显示第一个tab内容
+  current.value = radioItems.value[0].value
+  currentLabel.value = radioItems.value[0].name
+
   detailDataInfo({ id: row.id }).then((res) => {
     if (res.code === 200) {
-      chartTitle.value = `${row.devcode} / ${row.logtime}`
+      chartTitle.value = `${row.devcode} / ${row.uptime}`
       sampleDataArray.value[0] = {
         name: '采样点',
-        data: JSON.parse(res.data),
+        data: JSON.parse(res.data.rawData),
       }
     }
   })
@@ -40,7 +64,19 @@
 <template>
   <el-dialog v-model="showDialog" title="数据详情" :append-to-body="true" :close-on-click-modal="false" width="75%" @closed="resetForm">
     <detail-block title="数据详情">
-      <line-chart ref="sampleChartRef" :data="sampleDataArray" height="500px" :gradient="false" :show-x-axis="false" :title="chartTitle" />
+      <el-radio-group v-model="currentLabel" style="margin-bottom: 20px;" @change="radioChangeHandler">
+        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" />
+      </el-radio-group>
+
+      <div v-show="current === 'data-wave'">
+        <line-chart ref="sampleChartRef" :data="sampleDataArray" height="500px" :gradient="false" :show-x-axis="false" :title="chartTitle" />
+      </div>
+
+      <div v-show="current === 'data-spectrum'">
+        <detail-block :need-title="false" title="">
+          敬请期待
+        </detail-block>
+      </div>
     </detail-block>
   </el-dialog>
 </template>

diff --git a/src/api/basic/device.ts b/src/api/basic/device.ts
index 4e251a5..debeba6 100644
--- a/src/api/basic/device.ts
+++ b/src/api/basic/device.ts
@@ -21,7 +21,7 @@
 // 导出
 export function exportDevice(data: object) {
   return request({
-    url: `${prefix}/list-export`,
+    url: `${prefix}/batchExport`,
     responseType: 'blob',
     method: 'post',
     data,
@@ -45,13 +45,11 @@
   })
 }
 // 删除设备
-export function delDevice(id: string) {
+export function delDevice(data: object) {
   return request({
     url: `${prefix}/delete`,
     method: 'post',
-    data: {
-      ids: [id],
-    },
+    data,
   })
 }
 
diff --git a/src/api/data/query.ts b/src/api/data/query.ts
index eed4d35..e057f2f 100644
--- a/src/api/data/query.ts
+++ b/src/api/data/query.ts
@@ -10,6 +10,15 @@
   })
 }
 
+// 查询数据 不分页
+export function getDeviceDataList(data: object) {
+  return request({
+    url: `${prefix}/list-all`,
+    method: 'post',
+    data,
+  })
+}
+
 // 查询噪声原始采样点数据信息
 export function detailDataInfo(data: object) {
   return request({
diff --git a/src/router/modules/leak.ts b/src/router/modules/leak.ts
index d650a21..8b203ea 100644
--- a/src/router/modules/leak.ts
+++ b/src/router/modules/leak.ts
@@ -131,7 +131,7 @@
           title: '设备详情',
           sidebar: false,
           breadcrumb: true,
-          activeMenu: '/basic/device',
+          activeMenu: '/basic/device/list',
         },
       },
       {
diff --git a/src/views/basic/device/detail.vue b/src/views/basic/device/detail.vue
index c915041..3a9582a 100644
--- a/src/views/basic/device/detail.vue
+++ b/src/views/basic/device/detail.vue
@@ -1,10 +1,14 @@
 <!-- 设备详情 -->
 <script name="DeviceInfoDetail" lang="ts" setup>
 import { ElMessage, ElMessageBox, dayjs } from 'element-plus'
+import type { DateModelType } from 'element-plus'
+import type { IDataDetailInfo, IListQuery } from '../../data/query/data-query'
+import DataDetailDialog from '../../data/query/dataDetailDialog.vue'
 import type { IDeviceInfo } from './device-info'
-import DeviceConfigList from './configList.vue'
-import DataQueryList from '@/views/data/query/list.vue'
-import { addDevice, updateDevice } from '@/api/basic/device'
+import type { TableColumn } from '@/components/NormalTable/table_interface'
+import { getDeviceDataList } from '@/api/data/query'
+import LineChart from '@/components/Echart/LineChart.vue'
+import type { lineDataI } from '@/components/Echart/echart-interface'
 
 // 从路由中传过来的参数
 const type = ref<string>('')
@@ -14,14 +18,6 @@
 const router = useRouter()
 const title = ref('')
 
-const radioItems = ref([
-  { name: '数据查询', value: 'device-data' },
-  { name: '下发配置', value: 'device-config' },
-  { name: '耗电分析', value: 'device-cell' },
-])
-const current = ref('')
-const currentLabel = ref('')
-
 const basicFormRef = ref()
 
 const deviceInfo = ref<IDeviceInfo>({
@@ -45,84 +41,77 @@
   dataValue: '',
 })
 
+const dataQuery = ref<IListQuery>({
+  keywords: '',
+  beginTime: '',
+  endTime: '', //
+})
+const dateRange = ref<[DateModelType, DateModelType]>(['', ''])// 筛选时间段数据
+const dataColumns = ref<TableColumn[]>([
+  { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
+  { text: '数值', value: 'ddata', align: 'center' },
+])
+const dataList = ref<Array<IDataDetailInfo>>([]) // 表格数据
+
+const chartTimeArray = ref<Array<string>>([])
+const yAxisData = ref<Array<number>>([])
+const chartDataArray = ref<Array<lineDataI>>([])
+
+const dataChartRef = ref()
+const refDataDialog = ref()
+const buttonIndex = ref<number>(2)
+
 // 逻辑
+const detailNoiseData = (row: IDataDetailInfo) => {
+  refDataDialog.value.initDialog(row)
+}
+
+const searchList = () => {
+  getDeviceDataList(dataQuery.value).then((res) => {
+    if (res.code === 200) {
+      dataList.value = res.data.slice() // 需要倒序排列 使用值复制
+
+      chartTimeArray.value = []
+      yAxisData.value = []
+
+      res.data.reverse().forEach((data: IDataDetailInfo) => {
+        chartTimeArray.value.push(data.uptime)
+        yAxisData.value.push(parseFloat(data.ddata))
+      })
+
+      chartDataArray.value[0] = {
+        name: '噪声值',
+        data: yAxisData.value,
+      }
+    }
+  })
+}
+
+const fastDateRangeChanged = (index: number) => {
+  switch (index) {
+    case 1:
+      dataQuery.value.beginTime = dayjs().add(-3, 'month').format('YYYY-MM-DD')
+      break
+
+    case 2:
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      break
+
+    case 3:
+      dataQuery.value.beginTime = dayjs().add(-1, 'week').format('YYYY-MM-DD')
+      break
+  }
+
+  buttonIndex.value = index
+  dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+  dateRange.value = [dataQuery.value.beginTime!, dataQuery.value.endTime]
+}
+
 const resetForm = () => {
   sessionStorage.removeItem('deviceInfo')
   router.go(-1)
 }
 
-// 详情页的各个tab切换操作
-const radioChangeHandler = (newVal: string | number | boolean) => {
-  const radioTarget = radioItems.value.filter(item => item.name === newVal)
-  if (radioTarget.length > 0) {
-    currentLabel.value = radioTarget[0].name
-    current.value = radioTarget[0].value
-  }
-  else {
-    currentLabel.value = radioItems.value[0].name
-    current.value = radioItems.value[0].value
-  }
-}
-
-// 添加
-const saveSealInfoForm = () => {
-  // 将创建时间改为提交的时间
-  deviceInfo.value.createTime = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
-  addDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-// 编辑
-const updateSealInfoById = () => {
-  updateDevice(deviceInfo.value).then((res) => {
-    if (res.code === 200) {
-      // 提示保存成功
-      ElMessage.success('保存成功')
-      type.value = 'detail'
-      title.value = '设备详情（详情）'
-    }
-    else {
-      // 提示失败信息
-      ElMessage.error(`保存失败：${res.message}`)
-    }
-  })
-}
-
-// 保存
-const saveForm = async () => {
-  if (!basicFormRef) { return }
-
-  await basicFormRef.value.validate((valid: boolean, fields: any) => {
-    if (valid === true) {
-      ElMessageBox.confirm(
-        '确认保存吗？',
-        '提示',
-        {
-          confirmButtonText: '确认',
-          cancelButtonText: '取消',
-          type: 'warning',
-        },
-      ).then(() => {
-        if (type.value === 'create') {
-          saveSealInfoForm()
-        }
-        else if (type.value === 'update') {
-          updateSealInfoById()
-        }
-      })
-    }
-  })
-}
-
 const initDialog = (params: any) => {
   // 从路由中获取参数
   type.value = params.type
@@ -130,15 +119,18 @@
 
   deviceInfo.value = JSON.parse(sessionStorage.getItem('deviceInfo')!)
 
-  // 默认显示第一个tab内容
-  current.value = radioItems.value[0].value
-  currentLabel.value = radioItems.value[0].name
-
   switch (params.type) {
     case 'detail':
       title.value = '设备详情'
       id.value = params.id
 
+      // 查询数据详情
+      dataQuery.value.keywords = deviceInfo.value.devcode
+      dataQuery.value.beginTime = dayjs().add(-1, 'month').format('YYYY-MM-DD')
+      dataQuery.value.endTime = dayjs().add(1, 'day').format('YYYY-MM-DD')
+      dateRange.value = [dataQuery.value.beginTime, dataQuery.value.endTime]
+      searchList()
+
       break
     default:
       title.value = ''
@@ -146,6 +138,21 @@
   }
 }
 
+watch(dateRange, (val) => {
+  if (val) {
+    dataQuery.value.beginTime = dayjs(val[0]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[0]).format('YYYY-MM-DD')
+    dataQuery.value.endTime = dayjs(val[1]).format('YYYY-MM-DD') === 'Invalid Date' ? '' : dayjs(val[1]).format('YYYY-MM-DD')
+  }
+  else {
+    dataQuery.value.beginTime = ''
+    dataQuery.value.endTime = ''
+
+    buttonIndex.value = 0
+  }
+
+  searchList()
+})
+
 onMounted(async () => {
   initDialog(route.query)
 })
@@ -191,24 +198,62 @@
           </el-col>
         </el-row>
       </el-form>
-
-      <el-radio-group v-model="currentLabel" style="margin: 20px;" @change="radioChangeHandler">
-        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" :disabled="id === ''" />
-      </el-radio-group>
-
-      <template v-if="current === 'device-data'">
-        <data-query-list :embedded="true" :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-config'">
-        <device-config-list :devcode="deviceInfo.devcode" />
-      </template>
-
-      <template v-if="current === 'device-cell'">
-        <detail-block :need-title="false" title="">
-          敬请期待
-        </detail-block>
-      </template>
     </detail-page>
+
+    <detail-block title="">
+      <el-row :gutter="24">
+        <el-col :span="6">
+          设备数据情况
+        </el-col>
+        <el-col :span="18" align="right">
+          <el-button ref="threeMonRef" round :type="buttonIndex === 1 ? 'primary' : ''" @click="fastDateRangeChanged(1)">
+            近3月
+          </el-button>
+          <el-button ref="oneMonRef" round :type="buttonIndex === 2 ? 'primary' : ''" @click="fastDateRangeChanged(2)">
+            近1月
+          </el-button>
+          <el-button ref="oneWeekRef" round :type="buttonIndex === 3 ? 'primary' : ''" @click="fastDateRangeChanged(3)">
+            近1周
+          </el-button>
+          <search-item style="padding: 0 10px;">
+            <el-date-picker v-model="dateRange" type="daterange" start-placeholder="采集时间（开始）" end-placeholder="采集时间（结束）" />
+          </search-item>
+        </el-col>
+      </el-row>
+
+      <el-row :gutter="24">
+        <el-col :span="16">
+          <line-chart ref="dataChartRef" :x-axis-data="chartTimeArray" :data="chartDataArray" height="500px" :gradient="false" />
+        </el-col>
+
+        <el-col :span="8">
+          <normal-table
+            :data="dataList" :columns="dataColumns"
+            :pagination="false"
+            :height="560"
+          >
+            <template #preColumns>
+              <el-table-column label="序号" width="55" align="center">
+                <template #default="scope">
+                  {{ scope.$index + 1 }}
+                </template>
+              </el-table-column>
+            </template>
+
+            <template #columns>
+              <el-table-column fixed="right" label="操作" align="center" width="80">
+                <template #default="{ row }">
+                  <el-button size="small" type="primary" link @click="detailNoiseData(row)">
+                    查看
+                  </el-button>
+                </template>
+              </el-table-column>
+            </template>
+          </normal-table>
+        </el-col>
+      </el-row>
+    </detail-block>
+
+    <data-detail-dialog ref="refDataDialog" />
   </app-container>
 </template>
diff --git a/src/views/basic/device/list.vue b/src/views/basic/device/list.vue
index e384713..9a98a52 100644
--- a/src/views/basic/device/list.vue
+++ b/src/views/basic/device/list.vue
@@ -30,8 +30,8 @@
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
   { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '180' },
 ])
 const dataList = ref<Array<IDeviceInfo>>([]) // 表格数据
 
@@ -136,7 +136,7 @@
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    delDevice(row.id).then((res) => {
+    delDevice([row.id]).then((res) => {
       if (res.code === 200) {
         ElMessage.success(`设备 ${row.devcode} 删除成功`)
         searchList()
@@ -217,6 +217,12 @@
               <el-button size="small" type="primary" link @click="detail(row)">
                 查看
               </el-button>
+              <el-button size="small" type="primary" link @click="detail(row)">
+                编辑
+              </el-button>
+              <el-button size="small" type="danger" link @click="deleteById(row)">
+                删除
+              </el-button>
             </template>
           </el-table-column>
         </template>
diff --git a/src/views/basic/locate/detail.vue b/src/views/basic/locate/detail.vue
index dd3c5cd..3b9f0f9 100644
--- a/src/views/basic/locate/detail.vue
+++ b/src/views/basic/locate/detail.vue
@@ -50,14 +50,14 @@
 const deviceList = ref<Array<IDeviceInfo>>([])
 // 表头
 const devColumns = ref<TableColumn[]>([
-  { text: '状态', value: 'onlineStateName', align: 'center', width: '60' },
-  { text: '设备编号', value: 'devcode', align: 'center', width: '160' },
-  { text: '监测类型', value: 'watchType', align: 'center', width: '160' },
+  { text: '状态', value: 'onlineStateName', align: 'center', width: '100' },
+  { text: '设备编号', value: 'devcode', align: 'center', width: '200' },
+  { text: '监测类型', value: 'watchType', align: 'center', width: '200' },
   { text: '设备类型', value: 'deviceTypeName', align: 'center', width: '200' },
   { text: '设备型号', value: 'modelName', align: 'center', width: '200' },
-  { text: '安装时间', value: 'installDate', align: 'center', width: '180' },
-  { text: '最新数据', value: 'dataValue', align: 'center' },
-  { text: '最新上线时间', value: 'logtime', align: 'center', width: '180' },
+  { text: '安装时间', value: 'installDate', align: 'center', width: '200' },
+  { text: '最新数据', value: 'latestData', align: 'center' },
+  { text: '最新上线时间', value: 'latestTime', align: 'center', width: '200' },
 ])
 
 // 逻辑
diff --git a/src/views/data/query/data-query.ts b/src/views/data/query/data-query.ts
index 885a786..3af1eb5 100644
--- a/src/views/data/query/data-query.ts
+++ b/src/views/data/query/data-query.ts
@@ -11,17 +11,10 @@
 
 export interface IDataDetailInfo {
   id: string
-  groupId: string
-  groupName: string
   devcode: string
-  deviceType?: string
-  deviceTypeName?: string
-  status?: string
-  statusName?: string
+  ddata: string
   cell?: string
-  dataJson: string
-  decryptBeforeData?: string
-  decryptAfterData?: string
+  descn?: string
   pci?: string
   rsrp?: string
   snr?: string
diff --git a/src/views/data/query/dataDetailDialog.vue b/src/views/data/query/dataDetailDialog.vue
index c09a2a9..0cbe68f 100644
--- a/src/views/data/query/dataDetailDialog.vue
+++ b/src/views/data/query/dataDetailDialog.vue
@@ -10,9 +10,29 @@
 const sampleDataArray = ref<Array<lineDataI>>([])
 const chartTitle = ref<string>('')
 
+const radioItems = ref([
+  { name: '波形图', value: 'data-wave' },
+  { name: '频谱图', value: 'data-spectrum' },
+])
+const current = ref('')
+const currentLabel = ref('')
+
 const sampleChartRef = ref()
 
 // 逻辑
+// 详情页的各个tab切换操作
+const radioChangeHandler = (newVal: string | number | boolean) => {
+  const radioTarget = radioItems.value.filter(item => item.name === newVal)
+  if (radioTarget.length > 0) {
+    currentLabel.value = radioTarget[0].name
+    current.value = radioTarget[0].value
+  }
+  else {
+    currentLabel.value = radioItems.value[0].name
+    current.value = radioItems.value[0].value
+  }
+}
+
 const resetForm = () => {
   showDialog.value = false
 }
@@ -21,12 +41,16 @@
   // 从路由中获取参数
   showDialog.value = true
 
+  // 默认显示第一个tab内容
+  current.value = radioItems.value[0].value
+  currentLabel.value = radioItems.value[0].name
+
   detailDataInfo({ id: row.id }).then((res) => {
     if (res.code === 200) {
-      chartTitle.value = `${row.devcode} / ${row.logtime}`
+      chartTitle.value = `${row.devcode} / ${row.uptime}`
       sampleDataArray.value[0] = {
         name: '采样点',
-        data: JSON.parse(res.data),
+        data: JSON.parse(res.data.rawData),
       }
     }
   })
@@ -40,7 +64,19 @@
 <template>
   <el-dialog v-model="showDialog" title="数据详情" :append-to-body="true" :close-on-click-modal="false" width="75%" @closed="resetForm">
     <detail-block title="数据详情">
-      <line-chart ref="sampleChartRef" :data="sampleDataArray" height="500px" :gradient="false" :show-x-axis="false" :title="chartTitle" />
+      <el-radio-group v-model="currentLabel" style="margin-bottom: 20px;" @change="radioChangeHandler">
+        <el-radio-button v-for="item in radioItems" :key="item.value" :label="item.name" />
+      </el-radio-group>
+
+      <div v-show="current === 'data-wave'">
+        <line-chart ref="sampleChartRef" :data="sampleDataArray" height="500px" :gradient="false" :show-x-axis="false" :title="chartTitle" />
+      </div>
+
+      <div v-show="current === 'data-spectrum'">
+        <detail-block :need-title="false" title="">
+          敬请期待
+        </detail-block>
+      </div>
     </detail-block>
   </el-dialog>
 </template>
diff --git a/src/views/data/query/list.vue b/src/views/data/query/list.vue
index 52aa763..c66e9de 100644
--- a/src/views/data/query/list.vue
+++ b/src/views/data/query/list.vue
@@ -40,6 +40,7 @@
   { text: '设备编号', value: 'devcode', align: 'center', width: '200' },
   { text: '采集时间', value: 'uptime', align: 'center', width: '200' },
   { text: '数值', value: 'ddata', align: 'center' },
+  { text: '电量', value: 'descn', align: 'center', width: '150' },
   { text: '信号强度', value: 'signalStr', align: 'center' },
   { text: '设备状态', value: 'status', align: 'center', width: '150' },
 ])