diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+
diff --git a/src/views/device/stateManage/components/templatePage.vue b/src/views/device/stateManage/components/templatePage.vue
new file mode 100644
index 0000000..5fb0163
--- /dev/null
+++ b/src/views/device/stateManage/components/templatePage.vue
@@ -0,0 +1,60 @@
+<!-- 状态管理公共模板 -->
+<script lang="ts" setup name="stateMangeTemplate">
+import list from './templateList.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  authority: {
+    type: String,
+    required: true,
+  },
+})
+interface menuType {
+  name: string
+  comp: any
+}
+const menu = shallowRef<menuType[]>([
+  { name: '全部', comp: list },
+  { name: '草稿箱', comp: list },
+  { name: '待审批', comp: list },
+  { name: '审批中', comp: list },
+  { name: '已通过', comp: list },
+  { name: '未通过', comp: list },
+  { name: '已取消', comp: list },
+])
+const current = ref('全部')
+const currentComp = shallowRef(list)
+watch(current, (newValue) => {
+  currentComp.value = menu.value.filter(item => item.name === newValue)[0].comp
+})
+</script>
+
+<template>
+  <div class="container">
+    <div class="btns">
+      <!-- 三级菜单 -->
+      <el-radio-group v-model="current">
+        <el-radio-button v-for="item in menu" :key="item.name" :label="item.name">
+          {{ item.name }}
+        </el-radio-button>
+      </el-radio-group>
+    </div>
+    <!-- 展示区域 -->
+    <component :is="currentComp" :title="current" :name="props.name" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+  position: relative;
+
+  .btns {
+    position: fixed;
+    top: 67px;
+    right: 15px;
+    z-index: 999;
+  }
+}
+</style>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+
diff --git a/src/views/device/stateManage/components/templatePage.vue b/src/views/device/stateManage/components/templatePage.vue
new file mode 100644
index 0000000..5fb0163
--- /dev/null
+++ b/src/views/device/stateManage/components/templatePage.vue
@@ -0,0 +1,60 @@
+<!-- 状态管理公共模板 -->
+<script lang="ts" setup name="stateMangeTemplate">
+import list from './templateList.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  authority: {
+    type: String,
+    required: true,
+  },
+})
+interface menuType {
+  name: string
+  comp: any
+}
+const menu = shallowRef<menuType[]>([
+  { name: '全部', comp: list },
+  { name: '草稿箱', comp: list },
+  { name: '待审批', comp: list },
+  { name: '审批中', comp: list },
+  { name: '已通过', comp: list },
+  { name: '未通过', comp: list },
+  { name: '已取消', comp: list },
+])
+const current = ref('全部')
+const currentComp = shallowRef(list)
+watch(current, (newValue) => {
+  currentComp.value = menu.value.filter(item => item.name === newValue)[0].comp
+})
+</script>
+
+<template>
+  <div class="container">
+    <div class="btns">
+      <!-- 三级菜单 -->
+      <el-radio-group v-model="current">
+        <el-radio-button v-for="item in menu" :key="item.name" :label="item.name">
+          {{ item.name }}
+        </el-radio-button>
+      </el-radio-group>
+    </div>
+    <!-- 展示区域 -->
+    <component :is="currentComp" :title="current" :name="props.name" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+  position: relative;
+
+  .btns {
+    position: fixed;
+    top: 67px;
+    right: 15px;
+    z-index: 999;
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/unusedApply.vue b/src/views/device/stateManage/unusedApply.vue
index fb2cffa..4b02b09 100644
--- a/src/views/device/stateManage/unusedApply.vue
+++ b/src/views/device/stateManage/unusedApply.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup name="unusedApply">
-// 逻辑代码
+import page from './components/templatePage.vue'
 </script>
 
 <template>
   <app-container>
-    设备闲置申请
+    <page name="设备闲置申请" authority="unusedApply" />
   </app-container>
 </template>
 

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+
diff --git a/src/views/device/stateManage/components/templatePage.vue b/src/views/device/stateManage/components/templatePage.vue
new file mode 100644
index 0000000..5fb0163
--- /dev/null
+++ b/src/views/device/stateManage/components/templatePage.vue
@@ -0,0 +1,60 @@
+<!-- 状态管理公共模板 -->
+<script lang="ts" setup name="stateMangeTemplate">
+import list from './templateList.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  authority: {
+    type: String,
+    required: true,
+  },
+})
+interface menuType {
+  name: string
+  comp: any
+}
+const menu = shallowRef<menuType[]>([
+  { name: '全部', comp: list },
+  { name: '草稿箱', comp: list },
+  { name: '待审批', comp: list },
+  { name: '审批中', comp: list },
+  { name: '已通过', comp: list },
+  { name: '未通过', comp: list },
+  { name: '已取消', comp: list },
+])
+const current = ref('全部')
+const currentComp = shallowRef(list)
+watch(current, (newValue) => {
+  currentComp.value = menu.value.filter(item => item.name === newValue)[0].comp
+})
+</script>
+
+<template>
+  <div class="container">
+    <div class="btns">
+      <!-- 三级菜单 -->
+      <el-radio-group v-model="current">
+        <el-radio-button v-for="item in menu" :key="item.name" :label="item.name">
+          {{ item.name }}
+        </el-radio-button>
+      </el-radio-group>
+    </div>
+    <!-- 展示区域 -->
+    <component :is="currentComp" :title="current" :name="props.name" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+  position: relative;
+
+  .btns {
+    position: fixed;
+    top: 67px;
+    right: 15px;
+    z-index: 999;
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/unusedApply.vue b/src/views/device/stateManage/unusedApply.vue
index fb2cffa..4b02b09 100644
--- a/src/views/device/stateManage/unusedApply.vue
+++ b/src/views/device/stateManage/unusedApply.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup name="unusedApply">
-// 逻辑代码
+import page from './components/templatePage.vue'
 </script>
 
 <template>
   <app-container>
-    设备闲置申请
+    <page name="设备闲置申请" authority="unusedApply" />
   </app-container>
 </template>
 
diff --git a/src/views/measure/file/components/approve/passed.vue b/src/views/measure/file/components/approve/passed.vue
index 8e08302..50ea492 100644
--- a/src/views/measure/file/components/approve/passed.vue
+++ b/src/views/measure/file/components/approve/passed.vue
@@ -4,5 +4,5 @@
 </script>
 
 <template>
-  <template-pag name="已通过" />
+  <template-pag name="已通过" value="4" />
 </template>

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+
diff --git a/src/views/device/stateManage/components/templatePage.vue b/src/views/device/stateManage/components/templatePage.vue
new file mode 100644
index 0000000..5fb0163
--- /dev/null
+++ b/src/views/device/stateManage/components/templatePage.vue
@@ -0,0 +1,60 @@
+<!-- 状态管理公共模板 -->
+<script lang="ts" setup name="stateMangeTemplate">
+import list from './templateList.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  authority: {
+    type: String,
+    required: true,
+  },
+})
+interface menuType {
+  name: string
+  comp: any
+}
+const menu = shallowRef<menuType[]>([
+  { name: '全部', comp: list },
+  { name: '草稿箱', comp: list },
+  { name: '待审批', comp: list },
+  { name: '审批中', comp: list },
+  { name: '已通过', comp: list },
+  { name: '未通过', comp: list },
+  { name: '已取消', comp: list },
+])
+const current = ref('全部')
+const currentComp = shallowRef(list)
+watch(current, (newValue) => {
+  currentComp.value = menu.value.filter(item => item.name === newValue)[0].comp
+})
+</script>
+
+<template>
+  <div class="container">
+    <div class="btns">
+      <!-- 三级菜单 -->
+      <el-radio-group v-model="current">
+        <el-radio-button v-for="item in menu" :key="item.name" :label="item.name">
+          {{ item.name }}
+        </el-radio-button>
+      </el-radio-group>
+    </div>
+    <!-- 展示区域 -->
+    <component :is="currentComp" :title="current" :name="props.name" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+  position: relative;
+
+  .btns {
+    position: fixed;
+    top: 67px;
+    right: 15px;
+    z-index: 999;
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/unusedApply.vue b/src/views/device/stateManage/unusedApply.vue
index fb2cffa..4b02b09 100644
--- a/src/views/device/stateManage/unusedApply.vue
+++ b/src/views/device/stateManage/unusedApply.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup name="unusedApply">
-// 逻辑代码
+import page from './components/templatePage.vue'
 </script>
 
 <template>
   <app-container>
-    设备闲置申请
+    <page name="设备闲置申请" authority="unusedApply" />
   </app-container>
 </template>
 
diff --git a/src/views/measure/file/components/approve/passed.vue b/src/views/measure/file/components/approve/passed.vue
index 8e08302..50ea492 100644
--- a/src/views/measure/file/components/approve/passed.vue
+++ b/src/views/measure/file/components/approve/passed.vue
@@ -4,5 +4,5 @@
 </script>
 
 <template>
-  <template-pag name="已通过" />
+  <template-pag name="已通过" value="4" />
 </template>
diff --git a/src/views/measure/file/components/approve/templatePage.vue b/src/views/measure/file/components/approve/templatePage.vue
index c0e4c86..44e3e4d 100644
--- a/src/views/measure/file/components/approve/templatePage.vue
+++ b/src/views/measure/file/components/approve/templatePage.vue
@@ -4,7 +4,7 @@
 import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
 // import addDialog from './addDialog.vue'
 // import type { fileListType, fileResType, fileSearchType } from '@/views/measure/file/file-interface'
-import { deleteApi, listPageApi, updateApi } from '@/api/measure/file'
+import { approvallistPageApi, approvallistPageDetailApi } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { exportExcel } from '@/utils/exportXlsx'
 // import { uploadApi } from '@/api/system/notice'
@@ -13,18 +13,23 @@
     type: String,
     default: '',
   },
+  value: {
+    type: String,
+    default: '',
+  },
 })
 const searchQuery = reactive({
   fileNo: '', // 编号
   fileName: '', // 名称
   publishTime: '', // 发布时间
   fileCode: '', // 文件号
-  effectiveTime: '', // 实施时间
-  effectiveStatus: '', // 实施状态
+  createUser: '', // 创建人
+  createTime: '', // 创建
+  approvalStatus: props.value, // 审批状态
   limit: 10,
   offset: 1,
   fileType: '', // 类型
-  create: '', // 创建人
+  formId: '',
 }) // 查询参数
 const loadingTable = ref<boolean>(false) // 表格loading
 const total = ref<number>(0) // 数据总条数
@@ -66,19 +71,19 @@
   fileTypeList.value = res.data
   searchQuery.fileType = res.data.filter(item => item.name === props.name)[0].value
 }
-// const effectiveStatusSelect = ref<fileResType[]>([])
-// 获取实施状态
-// const getStatus = () => {
-//   getDictByCode('effectiveStatus').then((res) => {
-//     if (res.code === 200) {
-//       effectiveStatusSelect.value = res.data
-//     }
-//   })
-// }
+const approvalStatus = ref([])
+// 获取审批状态
+const getStatus = () => {
+  getDictByCode('approvalStatus').then((res) => {
+    if (res.code === 200) {
+      approvalStatus.value = res.data
+    }
+  })
+}
 // 获取数据列表
 const getList = () => {
   loadingTable.value = true
-  listPageApi(searchQuery).then((res) => {
+  approvallistPageApi(searchQuery).then((res) => {
     if (res.code === 200) {
       list.value = res.data.rows
       total.value = res.data.total
@@ -255,10 +260,10 @@
 //   dialogVisible.value = false
 // }
 onMounted(() => {
-  // getStatus()
-  getType().then((_) => {
-    getList()
-  })
+  getStatus()
+  // getType().then((_) => {
+  getList()
+  // })
 })
 </script>
 
@@ -290,10 +295,10 @@
         </search-item>
         <search-item>
           <el-date-picker
-            v-model="searchQuery.publishTime" type="datetime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
+            v-model="searchQuery.createTime" type="datetime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
             placeholder="创建时间"
             class="normal-date"
-            style="width: 130px;"
+            style="width: 170px;"
           />
         </search-item>
         <search-item>
@@ -303,7 +308,7 @@
             class="normal-date"
             style="width: 130px;"
           /> -->
-          <el-input v-model="searchQuery.create" placeholder="创建人" clearable class="w-50 m-2 normal-input" />
+          <el-input v-model="searchQuery.createUser" placeholder="创建人" clearable class="w-50 m-2 normal-input" />
         </search-item>
         <search-item>
           <!-- <el-select v-model="searchQuery.effectiveStatus" class="m-2 normal-select" placeholder="实施状态">
@@ -383,15 +388,15 @@
 
 <style lang="scss" scoped>
 .normal-input {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 .normal-date {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 .normal-select {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 :deep(.el-table__header) {

diff --git a/src/api/measure/file.ts b/src/api/measure/file.ts
index 3e3ccb0..f29d997 100644
--- a/src/api/measure/file.ts
+++ b/src/api/measure/file.ts
@@ -69,3 +69,20 @@
     responseType: 'blob',
   })
 }
+
+// 文件审批列表(分页)
+export function approvallistPageApi(data: any) {
+  return request({
+    url: `/meter/file/approval/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
+// 审批详情
+export function approvallistPageDetailApi(data: object) {
+  return request({
+    url: '/meter/file/approval/listPage',
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/api/measure/measureDept.ts b/src/api/measure/measureDept.ts
index b0841fd..9a30ce3 100644
--- a/src/api/measure/measureDept.ts
+++ b/src/api/measure/measureDept.ts
@@ -35,4 +35,11 @@
     data,
   })
 }
-
+// 获取标准装置列表
+export function standardlistPageApi(data: any) {
+  return request({
+    url: `/meter/standard/listPage?limit=${data.limit}&offset=${data.offset}`,
+    method: 'post',
+    data,
+  })
+}
diff --git a/src/components.d.ts b/src/components.d.ts
index b9d5f3c..5a09663 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -30,7 +30,6 @@
     ImagePreview: typeof import('./components/ImagePreview/index.vue')['default']
     ImagesUpload: typeof import('./components/ImagesUpload/index.vue')['default']
     ImageUpload: typeof import('./components/ImageUpload/index.vue')['default']
-    LineChart: typeof import('./components/Echart/LineChart.vue')['default']
     NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default']
     NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default']
     NormalTable: typeof import('./components/NormalTable/index.vue')['default']
@@ -38,7 +37,6 @@
     PageMain: typeof import('./components/PageMain/index.vue')['default']
     PcasCascader: typeof import('./components/PcasCascader/index.vue')['default']
     Pie: typeof import('./components/echarts/pie.vue')['default']
-    PieChart: typeof import('./components/Echart/PieChart.vue')['default']
     PromoterDrawer: typeof import('./components/drawer/promoterDrawer.vue')['default']
     RoleDialog: typeof import('./components/dialog/roleDialog.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
diff --git a/src/components/Echart/BarChartHorizontal.vue b/src/components/Echart/BarChartHorizontal.vue
new file mode 100644
index 0000000..475cdbf
--- /dev/null
+++ b/src/components/Echart/BarChartHorizontal.vue
@@ -0,0 +1,449 @@
+<script lang="ts" setup name="BarChartHorizontal">
+/**
+ * 水平条形图，支持渐变，支持增加背景颜色，支持标签在最末尾显示
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init, number } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 10,
+        left: 20,
+        right: 60,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+        ['#2d8cf0', '#2352d6', '#3e29ce'],
+        ['#fed700', '#fdb302', '#fb9600'],
+        ['#68dfe3', '#2fade0', '#0182de'],
+        ['#fd9a19', '#fd6f1b', '#fe421c'],
+        ['#fed700', '#feb501', '#fd9502'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '#caddff',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  barWidth: {
+    type: [Number, String],
+    default: '15',
+  },
+  // 是否显示轴线
+  showAxis: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，如果设置为fixedEnd，请务必设置axisLabelWidth
+   */
+  labelPosition: {
+    type: String,
+    default: 'fixedEnd',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}%',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    xAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: props.showAxis,
+          color: props.fontColor, // X轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+      option.yAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: 'right',
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: true,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 1, 0, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/BarChartVertical.vue b/src/components/Echart/BarChartVertical.vue
new file mode 100644
index 0000000..02f9f14
--- /dev/null
+++ b/src/components/Echart/BarChartVertical.vue
@@ -0,0 +1,456 @@
+<script lang="ts" setup name="BarChartVertical">
+/**
+ * 垂直条形图，支持渐变，支持增加背景颜色
+ */
+import * as echarts from 'echarts/core'
+import type { ECharts } from 'echarts'
+import { init } from 'echarts'
+import type { Ref } from 'vue'
+import type { ECBasicOption } from 'echarts/types/dist/shared'
+import type { barOption, barSeriesOption, lineDataI } from './echart-interface'
+import tdTheme from './theme.json' // 引入默认主题
+const props = defineProps({
+  /**
+   * id
+   */
+  id: {
+    type: String,
+    default: 'chart',
+  },
+  /**
+   * 标题
+   */
+  title: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 加载状态
+   */
+  loading: {
+    type: Boolean,
+    default: false,
+  },
+  /**
+   * 网格配置
+   */
+  grid: {
+    type: Object,
+    default: () => {
+      return {
+        top: 50,
+        left: 20,
+        right: 20,
+        bottom: 10,
+        containLabel: true, // 是否包含坐标轴的刻度标签
+      }
+    },
+  },
+  /**
+   * 图例设置对象
+   */
+  legend: {
+    type: Object,
+    default: () => {
+      return {
+        show: true,
+        icon: 'circle',
+        orient: 'vertile', // 图例方向
+        align: 'left', // 图例标记和文本的对齐，默认自动
+        top: 5,
+        right: 20,
+        itemWidth: 12,
+        itemHeight: 12,
+        padding: [0, 0, 0, 120],
+      }
+    },
+  },
+  /**
+   * 图例列表，非必传
+   */
+  legendData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 图表宽
+   */
+  width: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * 图表高
+   */
+  height: {
+    type: String,
+    default: '100%',
+  },
+  /**
+   * X轴刻度数据，格式为['周一','周二'...]
+   */
+  xAxisData: {
+    type: Array<string>,
+    default: () => { return [] },
+  },
+  /**
+   * 数据，格式为[{name:'系列名',data:[0,0,0,...0], color:'可选'},...]
+   */
+  data: {
+    type: Array<lineDataI>,
+    default: () => { return [] },
+  },
+  /**
+   * 固定纵轴最大值，非必填
+   */
+  max: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 单位
+   */
+  unit: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 调色盘取色策略： series按照系列，data按照数据项
+   */
+  colorBy: {
+    type: String,
+    default: 'series',
+  },
+  /**
+   * 柱子颜色，渐变，
+   * 若colorBy为data, 格式[['柱1颜色1','柱1颜色2','柱1颜色3'],['柱2颜色1','柱2颜色2','柱2颜色3']]
+   * 若colorBy为series, 格式[['柱1颜色1','柱1颜色2','柱1颜色3']]
+   */
+  colors: {
+    type: Array,
+    default: () => {
+      return [
+        ['#2d8cf0', '#fff'],
+        ['#2352d6', '#fff'],
+        ['#fed700', '#fff'],
+        ['#feb501', '#fff'],
+      ]
+    },
+  },
+  /**
+   * 柱子背景颜色
+   */
+  backgroundColor: {
+    type: String,
+    default: '',
+  },
+  /**
+   * 柱子圆角
+   */
+  barConer: {
+    type: [Number, Array],
+    default: 50,
+  },
+  /**
+   * 柱子宽度
+   */
+  barWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  // 是否显示X轴线
+  showXAxis: {
+    type: Boolean,
+    default: true,
+  },
+  // 是否显示Y轴线
+  showYAxis: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否显示Y轴线
+  showYSplitLine: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 轴线颜色
+   */
+  axisLineColor: {
+    type: String,
+    default: '#96989b',
+  },
+  /**
+   * 轴线上文字颜色
+   */
+  fontColor: {
+    type: String,
+    default: '#000000',
+  },
+  // 轴线文本宽度
+  axisLabelWidth: {
+    type: [Number, String],
+    default: '',
+  },
+  /**
+   * 是否显示标签
+   */
+  showLabel: {
+    type: Boolean,
+    default: true,
+  },
+  /**
+   * 图形上文本标签颜色
+   */
+  labelColor: {
+    type: String,
+    default: '#3d7eff',
+  },
+  /**
+   * 标签位置，top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+   */
+  labelPosition: {
+    type: String,
+    default: 'top',
+  },
+  /**
+   * 标签格式化
+   */
+  labelFormatter: {
+    type: String,
+    default: '{c}',
+  },
+  /**
+   * 是否为渐变柱状图
+   */
+  gradient: {
+    type: Boolean,
+    default: true,
+  },
+})
+
+// 图表对象
+let chart: ECharts
+const chartRef: Ref<HTMLElement | null> = ref(null)
+
+// 监听数据变化
+watch(
+  [() => props.xAxisData, props.data], ([newName, newNums], [oldName, oldNums]) => {
+    refreshChart()
+  },
+  {
+    immediate: true,
+    deep: true,
+  },
+)
+// 构建option
+function buildOption() {
+  const option: barOption = {
+    grid: props.grid,
+    legend: props.legend, // 图例
+    tooltip: {
+      trigger: 'axis',
+      textStyle: {
+        fontSize: 16,
+      },
+      axisPointer: {
+        type: 'cross',
+        label: {
+          fontSize: 13,
+        },
+      },
+      valueFormatter: (value: string | number) => {
+        return value ? value + props.unit : ''
+      },
+    }, // 提示框
+    yAxis: [
+      {
+        name: props.unit,
+        type: 'value',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showYAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        nameTextStyle: { // 坐标轴名称的文字样式
+          color: props.fontColor,
+          fontSize: '60%',
+          verticalAlign: 'middle',
+        },
+        axisLabel: {
+          show: true,
+          color: props.fontColor, // y轴名称颜色
+          fontSize: 14,
+        },
+        splitLine: {
+          show: props.showYSplitLine,
+          lineStyle: {
+            color: ['#7a6b74'],
+            type: 'dashed',
+          },
+        },
+      },
+    ],
+    xAxis: [
+      {
+        type: 'category',
+        boundaryGap: true,
+        axisLine: {
+          show: props.showXAxis,
+          lineStyle: {
+            color: props.axisLineColor, // 轴线的颜色
+          },
+        },
+        axisLabel: {
+          color: props.fontColor,
+          fontSize: 15,
+        },
+        splitLine: {
+          show: false,
+        },
+      },
+    ],
+    series: [] as barSeriesOption[],
+  }
+  // 标题
+  if (props.title) {
+    option.title = {
+      show: true,
+      text: props.title,
+    }
+  }
+  // 图例
+  if (props.legend && props.legendData.length > 0) {
+    option.legend!.data = props.legendData
+  }
+  // 横轴数据
+  if (props.xAxisData && props.xAxisData.length > 0) {
+    if (Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+      option.xAxis[0].data = props.xAxisData // 横轴, 水平柱状图，y轴为横轴
+    }
+  }
+  // 轴线文本宽度
+  if (props.axisLabelWidth && Array.isArray(option.xAxis) && option.xAxis.length > 0) {
+    option.xAxis[0].axisLabel!.width = props.axisLabelWidth
+  }
+  // 如果有最大值规定，固定最大值
+  if (props.max && Array.isArray(option.yAxis) && option.yAxis.length > 0) {
+    option.yAxis[0].max = props.max
+  }
+  // 数据
+  if (props.data) {
+    const newSeries: barSeriesOption[] = []
+    // 遍历data， 拆分柱状图名称，数据和颜色
+    for (let itemIndex = 0; itemIndex < props.data.length; itemIndex++) {
+      const item = props.data[itemIndex]
+      const series: barSeriesOption = {
+        name: item.name,
+        type: 'bar',
+        colorBy: props.colorBy,
+        label: {
+          normal: {
+            show: props.showLabel,
+            color: props.labelColor,
+            position: props.labelPosition,
+            fontSize: 15,
+            formatter: props.labelFormatter,
+            align: 'center',
+            verticalAlign: 'middle',
+          },
+        },
+        showBackground: !!props.backgroundColor,
+        backgroundStyle: {
+          color: props.backgroundColor,
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        itemStyle: {
+          borderRadius: Array.isArray(props.barConer) ? props.barConer as number[] : props.barConer,
+        },
+        data: item.data,
+      }
+      // 如果规定了柱宽度
+      if (props.barWidth) {
+        series.barWidth = props.barWidth
+      }
+      // 如果要固定显示在图标右边
+      if (props.labelPosition == 'fixedEnd' && chartRef.value?.clientWidth) {
+        let chartWidth = chartRef.value?.clientWidth - props.grid.left || 0 - props.grid.right || 0
+        if (props.axisLabelWidth && typeof props.axisLabelWidth === 'number') {
+          chartWidth = chartWidth - props.axisLabelWidth
+        }
+        else {
+          chartWidth = chartWidth - 80
+        }
+        series.label.normal!.position = [chartWidth, '50%']
+      }
+      // 如果开启渐变
+      if (props.gradient && props.colors.length > 0) {
+        if (props.colorBy == 'series') { // 如果一系列是一个颜色
+          if (props.colors.length > 0 && Array.isArray(props.colors[0])) {
+            const colorCount = props.colors[0].length
+            const colorList = []
+            for (let i = 0; i < colorCount; i++) {
+              colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[0][i] })
+            }
+            series.itemStyle!.color = new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+          }
+        }
+        else if (props.colorBy === 'data') { // 每个数据是一个颜色
+          series.itemStyle!.color = (params: { dataIndex: number }) => {
+            if (Array.isArray(props.colors) && props.colors.length > 0 && Array.isArray(props.colors[0])) {
+              var index = params.dataIndex
+              const colorIndex = index % props.colors.length
+              console.log('colorIndex', colorIndex)
+              const colorCount = props.colors[0].length // 渐变颜色数，最多为3
+              const colorList = []
+              for (let i = 0; i < colorCount; i++) {
+                colorList.push({ offset: 0 + i * (1.0 / (colorCount - 1)), color: props.colors[colorIndex][i] })
+              }
+              console.log(colorList)
+              return new echarts.graphic.LinearGradient(0, 0, 0, 1, colorList)
+            }
+          }
+        }
+      }
+      newSeries.push(series)
+    }
+    console.log(newSeries)
+    option.series = newSeries
+  }
+  return option
+}
+// 初始化图表
+function initChart() {
+  chart = init(chartRef.value as HTMLElement, tdTheme)
+  chart.setOption({})
+}
+
+// 刷新图表
+function refreshChart() {
+  if (chart) {
+    const option = buildOption()
+    chart.setOption(option as unknown as ECBasicOption, true)
+  }
+}
+
+window.addEventListener('resize', () => {
+  chart.resize()
+})
+
+onMounted(() => {
+  initChart()
+})
+</script>
+
+<template>
+  <div :id="id" ref="chartRef" v-loading="loading" class="chart" :style="{ height, width }" />
+</template>
+
+<style lang="scss" scoped>
+.chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/components/Echart/LineChart.vue b/src/components/Echart/LineChart.vue
index 3fec782..ce5d797 100644
--- a/src/components/Echart/LineChart.vue
+++ b/src/components/Echart/LineChart.vue
@@ -48,7 +48,7 @@
         icon: 'circle',
         orient: 'vertile', // 图例方向
         align: 'left', // 图例标记和文本的对齐，默认自动
-        top: 0,
+        top: 5,
         right: 20,
         itemWidth: 12,
         itemHeight: 12,
diff --git a/src/components/Echart/PieChart.vue b/src/components/Echart/PieChart.vue
index 032ee81..4b1aa79 100644
--- a/src/components/Echart/PieChart.vue
+++ b/src/components/Echart/PieChart.vue
@@ -1,13 +1,10 @@
 <script lang="ts" setup name="PieChart">
-import * as echarts from 'echarts/core'
 import type { ECharts } from 'echarts'
 import { init } from 'echarts'
 import type { Ref } from 'vue'
 import type { ECBasicOption } from 'echarts/types/dist/shared'
-import { Grid } from '@element-plus/icons-vue'
-import type { lineSeriesOption, pieDataI, pieOption, pieSeriesOption } from './echart-interface'
+import type { pieDataI, pieOption, pieSeriesOption } from './echart-interface'
 import tdTheme from './theme.json' // 引入默认主题
-import { formatColor, getAlphaColor } from './utils'
 const props = defineProps({
   /**
    * id
diff --git a/src/components/Echart/echart-interface.ts b/src/components/Echart/echart-interface.ts
index e677f65..2308961 100644
--- a/src/components/Echart/echart-interface.ts
+++ b/src/components/Echart/echart-interface.ts
@@ -81,6 +81,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -90,12 +92,14 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show: boolean
@@ -118,6 +122,8 @@
   name?: string
   boundaryGap?: boolean | string[]
   data?: Array<string | Object> // 类目数据，在类目轴(type=category)中有效
+  min?: number | string | Function
+  max?: number | string | Function
   axisLine?: { // 坐标轴线
     show?: boolean
     lineStyle?: {
@@ -127,17 +133,19 @@
   }
   nameTextStyle?: { // 坐标轴名称的文字样式。
     color?: string
-    fontSize?: number // 默认12
+    fontSize?: number | string // 默认12
     verticalAlign: 'auto' | 'top' | 'middle' | 'bottom' // 文字垂直对齐方式
   }
   axisLabel?: { // 坐标轴刻度标签
+    show?: boolean
     color?: string // X轴名称颜色
-    fontSize?: number //
+    fontSize?: number | string // 文字大小
+    width?: number | string // 文本显示宽度
   }
   splitLine: { // 坐标轴在 grid 区域中的分隔线
     show?: boolean
     interval?: string | number | ((index: number, value: string) => boolean) // 坐标轴分隔线的显示间隔
-    lineStyle: {
+    lineStyle?: {
       color?: string | Array<string>
       type?: string // 'dashed' | 'solid' | 'dotted'
       shadowBlur?: number // 图形阴影的模糊大小
@@ -206,6 +214,43 @@
   }
   data: pieDataI[]
 }
+// 柱状图series配置项
+export interface barSeriesOption {
+  name?: string // 系列名称
+  type: 'bar'
+  barCategoryGap?: string // 同一系列柱间距离,默认20%
+  baryGap?: string // 不同系列的柱间距离，默认30%
+  barWidth?: string | number // 柱条宽度，不设自适应
+  colorBy: string // 调色盘取色策略： series按照系列，data按照数据项
+  itemStyle?: { // 柱子样式
+    color?: string | LinearGradientObject | Function // 图形的颜色
+    borderColor?: string // 图形的描边颜色
+    borderWidth?: number // 描边线宽。默认0，无描边。
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+    shadowBlur?: number // 图形阴影的模糊大小
+    shadowColor?: string // 阴影颜色
+    shadowOffsetX?: number // 阴影水平方向的偏移距离
+    shadowOffsetY?: number // 阴影垂直方向的偏移距离
+    opacity?: number // 图形透明度
+  }
+  showBackground?: boolean
+  backgroundStyle: { // 柱条背景样式
+    color?: string // 背景颜色
+    borderRadius?: number | number[] // 柱条圆角半径 统一设置四个角圆角大小，或依次设置（顺时针左上，右上，右下，左下）
+  }
+  label: { // 图形上的文本标签
+    normal: {
+      show?: boolean // 是否显示标签
+      color?: string // 标签文字颜色
+      position?: string | [number | string, number | string] // 标签文字位置：top / left / right / bottom / inside / insideLeft / insideRight / insideTop / insideBottom / insideTopLeft / insideBottomLeft / insideTopRight / insideBottomRight
+      fontSize?: string | number // 标签文字大小
+      align?: string // 文字水平对齐方式
+      verticalAlign?: string // 文字垂直对齐方向
+      formatter: string | Function // 标签内容格式器
+    }
+  }
+  data: number[] | string[]
+}
 // 折线图配置项
 export interface lineOption extends titleOption, gridOption, legendOption, tooltipOption {
   xAxis: xAxisOption | xAxisOption[]
@@ -217,4 +262,10 @@
   color?: string[]
   series: pieSeriesOption[]
 }
+// 柱状图配置项
+export interface barOption extends titleOption, gridOption, legendOption, tooltipOption {
+  xAxis: xAxisOption | xAxisOption[]
+  yAxis: yAxisOption | yAxisOption[]
+  series: barSeriesOption[]
+}
 
diff --git a/src/views/device/standingBook/components/addRow.vue b/src/views/device/standingBook/components/addRow.vue
new file mode 100644
index 0000000..1678cdb
--- /dev/null
+++ b/src/views/device/standingBook/components/addRow.vue
@@ -0,0 +1,207 @@
+<!-- 添加记录弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import { ElMessage, ElMessageBox } from 'element-plus'
+import { getDictByCode } from '@/api/system/dict'
+const emits = defineEmits(['add'])
+const dialogFormVisible = ref(false)
+const formLabelWidth = '140px'
+const form = ref({})
+const formTable = ref([
+  {
+    name: '周检记录',
+    form: {
+
+    },
+  },
+  {
+    name: '状态变更记录',
+    form: {
+
+    },
+  },
+  {
+    name: '使用记录',
+    form: {
+
+    },
+  },
+  {
+    name: '检定证书',
+    form: {
+
+    },
+  },
+])
+const title = ref('')
+const name = ref('')
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+const managerStateList = ref([]) // 管理状态
+// 重置
+const resetData = () => {
+}
+const initDialog = (row: any) => {
+  title.value = row.title
+  name.value = row.name
+  form.value = formTable.value.filter(item => item.name === row.name)[0].form
+  // if (row.title === '编辑') {
+
+  // }
+  dialogFormVisible.value = true
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  console.log(form.value, 'form')
+  const flagArr = []
+  for (const key in form.value) {
+    if (form.value[key]) {
+      flagArr.push(1)
+    }
+    else {
+      flagArr.push(0)
+    }
+  }
+  if (flagArr.every(item => item == 1)) {
+    if (title.value === '编辑') {
+      emits('add', form.value, 'update')
+    }
+    else {
+      emits('add', form.value, '')
+    }
+    dialogFormVisible.value = false
+  }
+  else {
+    ElMessage.warning('请先完整填写信息')
+  }
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogFormVisible.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogFormVisible" :title="`${name}-${title}`">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <div v-if="name === '周检记录'">
+        <el-form-item label="记录表编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录表编号" />
+        </el-form-item>
+        <el-form-item label="记录人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="记录人" />
+        </el-form-item>
+        <el-form-item label="检定日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="检定日期"
+          />
+        </el-form-item>
+        <el-form-item label="有效日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="有效日期"
+          />
+        </el-form-item>
+        <el-form-item label="送检人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="送检人" />
+        </el-form-item>
+        <el-form-item label="计量确认结论" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="计量确认结论" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '状态变更记录'">
+        <el-form-item label="状态类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="状态类型" clearable>
+            <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="结束日期"
+          />
+        </el-form-item>
+        <el-form-item label="申请人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="申请人" />
+        </el-form-item>
+      </div>
+      <div v-if="name === '使用记录'">
+        <el-form-item label="使用人" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用人" />
+        </el-form-item>
+        <el-form-item label="使用部门" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="使用部门" />
+        </el-form-item>
+        <el-form-item label="使用类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="使用类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="使用开始日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用开始日期"
+          />
+        </el-form-item>
+        <el-form-item label="使用结束日期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="使用结束日期"
+          />
+        </el-form-item>
+      </div>
+      <div v-if="name === '检定证书'">
+        <el-form-item label="证书编号" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书编号" />
+        </el-form-item>
+        <el-form-item label="证书名称" :label-width="formLabelWidth" prop="certificateNo">
+          <el-input v-model="form.certificateNo" placeholder="证书名称" />
+        </el-form-item>
+        <el-form-item label="证书类型" :label-width="formLabelWidth" prop="certificateNo">
+          <el-select v-model="form.certificateNo" placeholder="证书类型" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="证书出具日期" :label-width="formLabelWidth" prop="certificateNo">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书出具日期"
+          />
+        </el-form-item>
+        <el-form-item label="证书有效期" :label-width="formLabelWidth" prop="validDate">
+          <el-date-picker
+            v-model="form.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="证书有效期"
+          />
+        </el-form-item>
+      </div>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/standingBook/components/baseInfo.vue b/src/views/device/standingBook/components/baseInfo.vue
index 05d9034..c2682fc 100644
--- a/src/views/device/standingBook/components/baseInfo.vue
+++ b/src/views/device/standingBook/components/baseInfo.vue
@@ -1,23 +1,34 @@
 <!-- 基本信息 -->
-<script lang="ts" setup>
+<script lang="ts" setup name="baseInfo">
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { FormInstance, FormRules } from 'element-plus'
 import type { deptType, selectType } from '../standingBook-interface'
-import useUserStore from '@/store/modules/user'
 import showPhoto from '@/views/system/tool/showPhoto.vue'
 import { UploadFile } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { getUserList } from '@/api/system/user'
 import { getDeptTreeList } from '@/api/system/dept'
-import type { userType } from '@/views/system/user/user-interface'
-import { assetsAddApi, assetsDetailApi, assetsUpdateApi } from '@/api/device/standingBook'
 import comTreeSelect from '@/views/system/user/selecTree.vue'
 import { toTreeList } from '@/utils/structure'
-const emits = defineEmits(['resetData'])
+import type { userType } from '@/views/system/user/user-interface'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const ruleFormRef = ref() // from组件
-const userInfo = useUserStore() // 当前用户信息
 const dialogVisible = ref<boolean>(true)
-const title = ref('')
+const title = ref(props.title)
+const row = ref(props.row)
 const ruleForm = ref({
   assetNo: '', // 资产编号
   assetType: '', // 资产类型
@@ -72,7 +83,17 @@
   id: '',
 }) // 表单
 const rules = ref<FormRules>({
-  // fileName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
 }) // 表单验证规则
 const assetTypeList = ref<selectType[]>([]) // 资产类型
 const ABCList = ref<selectType[]>([]) // ABC
@@ -84,23 +105,57 @@
 const managerLevelList = ref<selectType[]>([]) // 管理级别
 const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
 const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
 const usePersonList = ref<userType[]>([]) // 使用人列表
 const useDeptList = ref<deptType[]>([]) // 使用部门列表
 const isWhether = ref<selectType[]>([
   {
     name: '是',
     id: 'shi',
-    value: '0',
+    value: '1',
   },
   {
     name: '否',
     id: 'fou',
-    value: '1',
+    value: '0',
   },
 ])
 const deptProps = reactive({
   parent: 'pid', value: 'id', label: 'name', children: 'children',
 })
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
 // 获取下拉框数
 const fetchData = () => {
 // 获取资产类型
@@ -143,6 +198,10 @@
   getDictByCode('managerState').then((response) => {
     managerStateList.value = response.data
   })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
   // 获取用户列表
   getUserList({ offset: 1, limit: 99999 }).then((res) => {
     usePersonList.value = res.data.rows
@@ -209,59 +268,17 @@
     id: '',
   }
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  fetchData()
-  ruleFormRef.value?.resetFields()
-  title.value = row.title
-  // dialogVisible.value = true
-  if (row.title !== '新建') {
-    assetsDetailApi({ id: row.id }).then((res) => {
-      ruleForm.value = res.data
-    })
-  }
-}
-defineExpose({ initDialog })
-// 关闭弹窗
-const close = () => {
-  resetDATA()
-  dialogVisible.value = false
-}
 // 提交
-const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
-  if (!formEl) { return }
-  await formEl.validate((valid, fields) => {
-    if (valid) {
-      ElMessageBox.confirm(
-    `确认${flag}吗？`,
-    '提示',
-    {
-      confirmButtonText: '确认',
-      cancelButtonText: '取消',
-      type: 'warning',
-    },
-      ).then((res) => {
-        // 提交
-        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
-          if (res.code == 200) {
-            formEl?.resetFields()
-            dialogVisible.value = false
-            close()
-            emits('resetData')
-          }
-        })
-        // dialogVisible.value = false
-      })
-    }
-  })
+const submitForm = () => {
+  return ruleFormRef.value
 }
-// 取消
-const resetForm = (formEl: FormInstance | undefined) => {
-  formEl?.resetFields()
-  dialogVisible.value = false
-  close()
-  emits('resetData')
-}
+defineExpose({ submitForm })
+watch(() => ruleForm.value, (newVal) => {
+// 变化后存储
+  sessionStorage.setItem('deviceBaseInfo', JSON.stringify(newVal))
+},
+{ deep: true, immediate: true })
+
 const fileRef = ref() // 文件上传input
 const onFileChange = (event: any) => {
   // 原生上传
@@ -279,7 +296,7 @@
           assetId: '',
           fileName: res.data[0],
           minioFileName: res.data[0],
-          id: '',
+          // id: '',
         })
         ruleFormRef.value?.clearValidate('minioFileName')
         ElMessage.success('文件上传成功')
@@ -301,24 +318,27 @@
     isShowCalibration.value = true
   }
 })
+onMounted(() => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  // row数据后续详情编辑需要
+
+  // dialogVisible.value = true
+  // if (title.value !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+})
 </script>
 
 <template>
-  <!-- <app-container style="overflow: hidden;"> -->
   <div class="body-container">
-    <!-- <div class="header">
-        <div class="title">
-          固定资产-{{ title }}
-        </div>
-        <span class="btns">
-          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
-            保存
-          </el-button>
-          <el-button type="info" @click="resetForm(ruleFormRef)">
-            关闭
-          </el-button>
-        </span>
-      </div> -->
     <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -328,7 +348,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="资产类型" prop="assetType">
-            <el-select v-model="ruleForm.assetType" placeholder="资产类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.assetType" :placeholder="title === '详情' ? '' : '资产类型'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in assetTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -340,33 +360,33 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备名称" prop="equipmentName">
-            <el-input v-model.trim="ruleForm.equipmentName" placeholder="设备名称" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="生产厂家" prop="manufacturer">
-            <el-input v-model.trim="ruleForm.manufacturer" placeholder="生产厂家" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="厂家国别" prop="manufacturerCountry">
-            <el-select v-model="ruleForm.manufacturerCountry" placeholder="厂家国别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.manufacturerCountry" :placeholder="title === '详情' ? '' : '厂家国别'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="出厂编号" prop="manufacturingNo">
-            <el-input v-model.trim="ruleForm.manufacturingNo" placeholder="出厂编号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
-          <el-form-item label="出厂年月" prop="manufacturingNo">
+          <el-form-item label="出厂年月" prop="manufacturingDate">
             <el-date-picker
               v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="出厂年月"
+              :placeholder="title === '详情' ? '' : '出厂年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -375,26 +395,26 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="型号" prop="modelNo">
-            <el-input v-model.trim="ruleForm.modelNo" placeholder="型号" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理状态" prop="managerState">
-            <el-select v-model="ruleForm.managerState" placeholder="管理状态" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerState" :placeholder="title === '详情' ? '' : '管理状态'" :disabled="title === '详情'" clearable>
               <el-option v-for="item in managerStateList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="ABC" prop="abc">
-            <el-select v-model="ruleForm.abc" placeholder="ABC" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.abc" :placeholder="title === '详情' ? '' : 'ABC'" :disabled="title === '详情'">
               <el-option v-for="item in ABCList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="标签绑定" prop="labelBind">
-            <el-input v-model.trim="ruleForm.labelBind" placeholder="标签" :disabled="title === '详情'" clearable>
+            <el-input v-model.trim="ruleForm.labelBind" :placeholder="title === '详情' ? '' : '标签'" :disabled="title === '详情'" clearable>
               <template #append>
                 <el-button type="primary" size="small">
                   扫描
@@ -409,7 +429,7 @@
           <el-form-item label="立卡年月" prop="cardEstablishmentDate">
             <el-date-picker
               v-model="ruleForm.cardEstablishmentDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="立卡年月"
+              :placeholder="title === '详情' ? '' : '立卡年月'"
               class="normal-date"
             />
           </el-form-item>
@@ -418,22 +438,22 @@
           <el-form-item label="启用日期" prop="enableDate">
             <el-date-picker
               v-model="ruleForm.enableDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="启用日期"
+              :placeholder="title === '详情' ? '' : '启用日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定方式" prop="mesureType">
-            <el-select v-model="ruleForm.mesureType" placeholder="检定方式" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureType" :placeholder="title === '详情' ? '' : '检定方式'" :disabled="title === '详情'">
               <el-option v-for="item in mesureTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定周期" prop="mesureCycle">
-            <el-select v-model="ruleForm.mesureCycle" placeholder="检定周期" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <el-select v-model="ruleForm.mesureCycle" :placeholder="title === '详情' ? '' : '检定周期'" :disabled="title === '详情'" clearable>
+              <el-option v-for="item in mesureCycleList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -441,12 +461,12 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="12">
           <el-form-item label="测量范围" prop="mesureRange">
-            <el-input v-model.trim="ruleForm.mesureRange" placeholder="测量范围" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.mesureRange" :placeholder="title === '详情' ? '' : '测量范围'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="不确定度" prop="uncertainty">
-            <el-input v-model.trim="ruleForm.uncertainty" placeholder="不确定度" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.uncertainty" :placeholder="title === '详情' ? '' : '不确定度'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -458,21 +478,21 @@
               v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="使用部门"
               :tree-props="deptProps"
             />
-            <el-select v-else v-model="ruleForm.useDept" placeholder="使用部门" :disabled="title === '详情'">
+            <el-select v-else v-model="ruleForm.useDept" placeholder="''" :disabled="title === '详情'">
               <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="使用人" prop="usePerson">
-            <el-select v-model="ruleForm.usePerson" placeholder="使用人" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '使用人'" :disabled="title === '详情'">
               <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="专业分类" prop="majorCategory">
-            <el-select v-model="ruleForm.majorCategory" placeholder="专业分类" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.majorCategory" :placeholder="title === '详情' ? '' : '专业分类'" :disabled="title === '详情'">
               <el-option v-for="item in majorCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -481,8 +501,13 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="检定部门" prop="mesureDept">
-            <el-select v-model="ruleForm.mesureDept" placeholder="检定部门" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+            <com-tree-select
+              v-if="title !== '详情'"
+              v-model="ruleForm.mesureDept" :options="useDeptList as any" placeholder="使用部门"
+              :tree-props="deptProps"
+            />
+            <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+              <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
             </el-select>
           </el-form-item>
         </el-col>
@@ -490,7 +515,7 @@
           <el-form-item label="检定日期" prop="mesureDate">
             <el-date-picker
               v-model="ruleForm.mesureDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="检定日期"
+              :placeholder="title === '详情' ? '' : '检定日期'"
               class="normal-date"
             />
           </el-form-item>
@@ -499,14 +524,14 @@
           <el-form-item label="有效日期" prop="validDate">
             <el-date-picker
               v-model="ruleForm.validDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
-              placeholder="有效日期"
+              :placeholder="title === '详情' ? '' : '有效日期'"
               class="normal-date"
             />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="检定结果" prop="mesureResult">
-            <el-select v-model="ruleForm.mesureResult" placeholder="检定结果" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.mesureResult" :placeholder="title === '详情' ? '' : '检定结果'" :disabled="title === '详情'">
               <el-option v-for="item in mesureResultList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -515,21 +540,21 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="8">
           <el-form-item label="是否是技术指标需要校准/检定的设备" prop="isCalibrationTestEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isCalibrationTestEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isCalibrationTestEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否是测量工装台账" prop="isMeasureAccount" label-width="260px">
-            <el-select v-model="ruleForm.isMeasureAccount" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isMeasureAccount" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="是否标准配套设备" prop="isStandardSupportEquipment" label-width="260px">
-            <el-select v-model="ruleForm.isStandardSupportEquipment" placeholder="是/否" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.isStandardSupportEquipment" :placeholder="title === '详情' ? '' : '是/否'" :disabled="title === '详情'">
               <el-option v-for="item in isWhether" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -539,24 +564,24 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资产来源" prop="assetSource">
-            <el-input v-model.trim="ruleForm.assetSource" placeholder="资产来源" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.assetSource" :placeholder="title === '详情' ? '' : '资产来源'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备规格" prop="equipmentSpecifications">
-            <el-input v-model.trim="ruleForm.equipmentSpecifications" placeholder="设备规格" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类别" prop="equipmentCategory">
-            <el-select v-model="ruleForm.equipmentCategory" placeholder="设备类别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentCategory" :placeholder="title === '详情' ? '' : '设备类别'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentCategoryList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="设备类型" prop="equipmentType">
-            <el-select v-model="ruleForm.equipmentType" placeholder="设备类型" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.equipmentType" :placeholder="title === '详情' ? '' : '设备类型'" :disabled="title === '详情'">
               <el-option v-for="item in equipmentTypeList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -565,78 +590,77 @@
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="资本来源" prop="capitalSource">
-            <!-- <el-input v-model.trim="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'" /> -->
-            <el-select v-model="ruleForm.capitalSource" placeholder="资本来源" :disabled="title === '详情'">
-              <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.value" />
+            <el-select v-model="ruleForm.capitalSource" :placeholder="title === '详情' ? '' : '资本来源'" :disabled="title === '详情'">
+              <el-option v-for="item in capitalSourceList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="管理级别" prop="managerLevel">
-            <el-select v-model="ruleForm.managerLevel" placeholder="管理级别" :disabled="title === '详情'">
+            <el-select v-model="ruleForm.managerLevel" :placeholder="title === '详情' ? '' : '管理级别'" :disabled="title === '详情'">
               <el-option v-for="item in managerLevelList" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="用途" prop="purpose">
-            <el-input v-model.trim="ruleForm.purpose" placeholder="用途" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.purpose" :placeholder="title === '详情' ? '' : '用途'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="技术水平" prop="technicalLevel">
-            <el-input v-model.trim="ruleForm.technicalLevel" placeholder="技术水平" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.technicalLevel" :placeholder="title === '详情' ? '' : '技术水平'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="完好状态" prop="intactState">
-            <el-input v-model.trim="ruleForm.intactState" placeholder="完好状态" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.intactState" :placeholder="title === '详情' ? '' : '完好状态'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="外形尺寸" prop="overallDimension">
-            <el-input v-model.trim="ruleForm.overallDimension" placeholder="外形尺寸" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.overallDimension" :placeholder="title === '详情' ? '' : '外形尺寸'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="重量(吨)" prop="weight">
-            <el-input v-model.trim="ruleForm.weight" placeholder="重量" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.weight" :placeholder="title === '详情' ? '' : '重量'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="单价" prop="singlePrice">
-            <el-input v-model.trim="ruleForm.singlePrice" placeholder="单价" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.singlePrice" :placeholder="title === '详情' ? '' : '单价'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="安装及杂费" prop="installIncidentalExpenses">
-            <el-input v-model.trim="ruleForm.installIncidentalExpenses" placeholder="安装及杂费" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installIncidentalExpenses" :placeholder="title === '详情' ? '' : '安装及杂费'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="安装地点" prop="installPlace">
-            <el-input v-model.trim="ruleForm.installPlace" placeholder="安装地点" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.installPlace" :placeholder="title === '详情' ? '' : '安装地点'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
           <el-form-item label="原值" prop="originValue">
-            <el-input v-model.trim="ruleForm.originValue" placeholder="原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.originValue" :placeholder="title === '详情' ? '' : '原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="目前原值" prop="presentOriginValue">
-            <el-input v-model.trim="ruleForm.presentOriginValue" placeholder="目前原值" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.presentOriginValue" :placeholder="title === '详情' ? '' : '目前原值'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
           <el-form-item label="折旧年限" prop="depreciationPeriod">
-            <el-input v-model.trim="ruleForm.depreciationPeriod" placeholder="折旧年限" :disabled="title === '详情'" />
+            <el-input v-model.trim="ruleForm.depreciationPeriod" :placeholder="title === '详情' ? '' : '折旧年限'" :disabled="title === '详情'" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -646,19 +670,6 @@
             </el-select>
           </el-form-item>
         </el-col>
-        <!-- <el-col :span="6">
-            <el-form-item label="使用单位" prop="useDept">
-              <el-select v-model="ruleForm.useDept" placeholder="使用单位" :disabled="title === '详情'" multiple>
-                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
-              </el-select>
-            </el-form-item>
-          </el-col> -->
-
-        <!-- <el-col :span="6">
-            <el-form-item label="负责人" prop="createUser">
-              <el-input v-model.trim="ruleForm.createUser" placeholder="负责人" :disabled="title === '详情'" />
-            </el-form-item>
-          </el-col> -->
       </el-row>
       <el-row :gutter="24" class="marg">
         <el-col :span="6">
@@ -671,10 +682,11 @@
         <el-col :span="12">
           <el-form-item label="说明书" prop="minioFileName">
             <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
-            <input v-show="title === '123'" ref="fileRef" type="file" @change="onFileChange">
+            <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
             <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
               {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
             </el-button>
+            <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
           </el-form-item>
         </el-col>
       </el-row>
@@ -685,22 +697,8 @@
           </el-form-item>
         </el-col>
       </el-row>
-      <!-- <div v-if="isShowCalibration">
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg" />
-          <el-row :gutter="24" class="marg">
-            <el-col :span="6">
-              <el-form-item label="下次检定部门" prop="mesureDept">
-                <el-select v-model="ruleForm.mesureDept" placeholder="下次检定部门" :disabled="title === '详情'">
-                  <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-row>
-        </div> -->
     </el-form>
   </div>
-  <!-- </app-container> -->
 </template>
 
 <style lang="scss" scoped>
@@ -710,26 +708,6 @@
     background-color: #fff;
     padding-top: 20px;
   }
-
-  .header {
-    background-color: #fff;
-    height: 40px;
-    border-radius: 8px;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    display: flex;
-
-    .title {
-      font-weight: 700;
-    }
-
-    .btns {
-      position: absolute;
-      right: 40px;
-      top: 14px;
-    }
-  }
 }
 
 .marg {
diff --git a/src/views/device/standingBook/components/templateAdd.vue b/src/views/device/standingBook/components/templateAdd.vue
index a04dd5f..0abbdb1 100644
--- a/src/views/device/standingBook/components/templateAdd.vue
+++ b/src/views/device/standingBook/components/templateAdd.vue
@@ -5,9 +5,24 @@
 import type { menuType } from '../standingBook-interface'
 import baseInfo from './baseInfo.vue' // 基本信息
 import table from './templateTable.vue'
+const props = defineProps({
+  title: {
+    type: String,
+    require: true,
+  },
+  name: {
+    type: String,
+    require: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
+})
 const emits = defineEmits(['resetData'])
-const title = ref('')
-const name = ref('')
+const title = ref(props.title)
+const name = ref(props.name)
+const row = ref(props.row)
 const menu = shallowRef<menuType[]>([
   { name: '基本信息', comp: baseInfo },
   { name: '周检记录', comp: table },
@@ -35,22 +50,26 @@
       cancelButtonText: '取消',
       type: 'warning',
     },
-  ).then((res) => {
-    // 提交
-    emits('resetData')
+  ).then(async (res) => {
+    current.value = '基本信息'
+    setTimeout(() => {
+      currentCompRef.value.submitForm().validate().then(() => {
+        // 整理数据发送请求
+        console.log(JSON.parse(sessionStorage.getItem('deviceBaseInfo'))) // form表单信息数据
+        console.log(JSON.parse(sessionStorage.getItem('tableData'))) // table表格信息数据
+        // // emits('resetData')
+      })
+    })
   })
 }
-// 弹窗初始化
-const initDialog = (row: any) => {
-  title.value = row.title
-  name.value = row.name
-  // 初始化基本信息页面
-  // console.log(baseInfo, 'baseInfo')
-  currentCompRef.value.initDialog({
-    title: row.title,
-  })
-}
-defineExpose({ initDialog })
+watch(() => props, (newVal) => {
+  title.value = newVal.title
+  name.value = newVal.name
+  row.value = newVal.row
+}, {
+  deep: true,
+  immediate: true,
+})
 </script>
 
 <template>
@@ -78,7 +97,9 @@
         </el-radio-group>
       </div>
       <!-- 展示区域 -->
-      <component :is="currentComp" ref="currentCompRef" :name="current" />
+      <keep-alive>
+        <component :is="currentComp" ref="currentCompRef" :name="current" :title="title" :row="row" />
+      </keep-alive>
     </div>
   </app-container>
 </template>
diff --git a/src/views/device/standingBook/components/templatePage.vue b/src/views/device/standingBook/components/templatePage.vue
index 604026c..f9cdcd0 100644
--- a/src/views/device/standingBook/components/templatePage.vue
+++ b/src/views/device/standingBook/components/templatePage.vue
@@ -137,7 +137,7 @@
 }
 // 获取数据列表
 const getList = () => {
-  loadingTable.value = true
+  // loadingTable.value = true
   // listPageApi(searchQuery).then((res) => {
   //   if (res.code === 200) {
   //     list.value = res.data.rows
@@ -147,6 +147,19 @@
   // }).catch((_) => {
   //   loadingTable.value = false
   // })
+  setTimeout(() => {
+    list.value = [
+      {
+        equipmentNo: 123,
+        equipmentName: 'test',
+        modelNo: '001',
+        usePersonName: '张三',
+        validDate: '2022-12-12 00:00:00',
+        useDeptName: '顶级',
+      },
+    ]
+    total.value = 1
+  }, 1000)
 }
 // 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
 const changePage = (val: { size?: number; page?: number }) => {
@@ -158,21 +171,27 @@
   }
   getList()
 }
+const title = ref('')
+const row = ref()
 // 详情
 const detail = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '详情',
-    name: props.name,
-  })
+  title.value = '详情'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '详情',
+  //   name: props.name,
+  // })
 }
 // 编辑
 const update = (row) => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '编辑',
-    name: props.name,
-  })
+  title.value = '编辑'
+  row.value = row
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   name: props.name,
+  // })
 }
 // 删除
 const remove = (row) => {
@@ -213,10 +232,8 @@
 // 新增
 const add = () => {
   dialogVisible.value = true
-  addRef.value.initDialog({
-    title: '新建',
-    name: props.name,
-  })
+  title.value = '新建'
+  row.value = {}
 }
 // 标签识别
 const identify = () => {
@@ -277,7 +294,7 @@
 
 <template>
   <div>
-    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <add-dialog v-if="dialogVisible" ref="addRef" :title="title" :name="props.name" :row="row" @reset-data="refreshDta" />
     <!-- 布局 -->
     <app-container v-show="!dialogVisible">
       <!-- 筛选条件 -->
diff --git a/src/views/device/standingBook/components/templateTable.vue b/src/views/device/standingBook/components/templateTable.vue
index faf4da1..8a928f0 100644
--- a/src/views/device/standingBook/components/templateTable.vue
+++ b/src/views/device/standingBook/components/templateTable.vue
@@ -1,5 +1,7 @@
 <!-- 表格记录 -->
 <script lang="ts" setup>
+import { ElMessage, ElMessageBox } from 'element-plus'
+import addRow from './addRow.vue'
 interface columnsType {
   text: string
   value: string
@@ -11,6 +13,14 @@
     type: String,
     required: true,
   },
+  title: {
+    type: String,
+    required: true,
+  },
+  row: {
+    type: Object,
+    defaule: () => ({}),
+  },
 })
 const list = ref([])
 const total = ref(0)
@@ -156,53 +166,150 @@
     searchQuery.value.offset = val.page
   }
 }
-watch(() => props.name, (newVal) => {
+watch(() => props, (newVal) => {
   console.log(newVal, 'newVal')
   // 挑选需要展示的数据
-  list.value = tableData.value.filter(item => item.name === props.name)[0].list
-  columns.value = tableData.value.filter(item => item.name === props.name)[0].columns
+  list.value = tableData.value.filter(item => item.name === newVal.name)[0]?.list || []
+  columns.value = tableData.value.filter(item => item.name === newVal.name)[0]?.columns || []
+  // row数据后续详情编辑需要
 }, {
   deep: true,
   immediate: true,
 })
+// 保存数据
+watch(() => tableData, (newVal) => {
+  sessionStorage.setItem('tableData', JSON.stringify(newVal))
+},
+{ immediate: true, deep: true })
+const addRowRef = ref()
+const select = ref()
+// 添加行
+const addRowbtn = () => {
+  addRowRef.value.initDialog({ title: '添加', name: props.name })
+}
+// 编辑行
+const editRow = () => {
+  if (select.value >= 0) {
+    const row: object = list.value.filter((item, index) => index === select.value)[0]
+    addRowRef.value.initDialog({ ...row, title: '编辑', name: props.name })
+  }
+  else {
+    ElMessage.warning('请先选择需要编辑的数据')
+  }
+}
+// 行内添加数据
+const addRowData = (row: any, _: string) => {
+  if (_ === 'update') {
+    list.value = list.value.map((item, index) => {
+      if (index === select.value) {
+        return {
+          ...item,
+          ...row,
+        }
+      }
+      else {
+        return item
+      }
+    })
+  }
+  else {
+    list.value.push(row)
+  }
+}
+
+// 删除行
+const removeRow = () => {
+  console.log(select.value)
+  if (select.value >= 0) {
+    ElMessageBox.confirm(
+      '确认删除选中的数据吗？',
+      '提示',
+      {
+        confirmButtonText: '确认',
+        cancelButtonText: '取消',
+        type: 'warning',
+      },
+    ).then(() => {
+      list.value = list.value.filter((item, index) => index !== select.value)
+      select.value = -1
+      ElMessage.success('删除成功')
+    })
+  }
+  else {
+    ElMessage.warning('请先选择需要删除的数据')
+  }
+}
 </script>
 
 <template>
-  <!-- 表格区域 -->
-  <normal-table
-    id="print"
-    :data="list" :total="total" :columns="columns as any"
-    :is-showmulti-select="true"
-    :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
-    :list-loading="loadingTable"
-    style="padding-top: 20px;background-color: #fff;"
-    @change="changePage"
-  >
-    <template #preColumns>
-      <el-table-column label="序号" width="55" align="center">
-        <template #default="scope">
-          {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
-        </template>
-      </el-table-column>
-    </template>
-    <!-- <template #columns>
-      <el-table-column label="操作" align="center" width="200">
-        <template #default="{ row }">
-          <el-button size="small" type="primary" link @click="update(row)">
-            编辑
-          </el-button>
-          <el-button size="small" type="primary" link @click="detail(row)">
-            详情
-          </el-button>
-          <el-button size="small" type="danger" link @click="remove(row)">
-            删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </template> -->
-  </normal-table>
+  <div>
+    <!-- 添加证书信息组件 -->
+    <add-row ref="addRowRef" @add="addRowData" />
+    <div class="header">
+      <div class="title">
+        <!-- {{ $props.name }} -->
+      </div>
+      <span class="btns">
+        <el-button v-if="title !== '详情'" type="info" @click="removeRow">
+          删除行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="addRowbtn">
+          添加行
+        </el-button>
+        <el-button v-if="title !== '详情'" type="primary" @click="editRow">
+          编辑行
+        </el-button>
+      </span>
+    </div>
+    <!-- 表格区域 -->
+    <normal-table
+      id="print"
+      :data="list" :total="total" :columns="columns as any"
+      :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+      :list-loading="loadingTable"
+      style="padding-top: 20px;background-color: #fff;"
+      @change="changePage"
+    >
+      <template #preColumns>
+        <el-table-column label="" width="55" align="center">
+          <template #default="scope">
+            <el-radio v-model="select" :label="scope.$index" class="radio" />
+          </template>
+        </el-table-column>
+        <el-table-column label="序号" width="55" align="center">
+          <template #default="scope">
+            {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+      </template>
+    </normal-table>
+  </div>
 </template>
 
 <style lang="scss" scoped>
+.header {
+  background-color: #fff;
+  // height: 40px;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .title {
+    // font-weight: 700;
+  }
+
+  .btns {
+    position: absolute;
+    right: 40px;
+    top: -22px;
+  }
+}
+
+:deep(.el-radio__label) {
+  display: none;
+}
 // 样式
 </style>
diff --git a/src/views/device/stateManage/components/approvalActionDialog.vue b/src/views/device/stateManage/components/approvalActionDialog.vue
new file mode 100644
index 0000000..cdc9b25
--- /dev/null
+++ b/src/views/device/stateManage/components/approvalActionDialog.vue
@@ -0,0 +1,90 @@
+<!-- 审批操作弹窗 -->
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+const emits = defineEmits(['resetData'])
+const dialogVisibleApprove = ref(false)
+const form = reactive({
+  radio: '',
+})
+const ruleFormRef = ref<FormInstance>()
+const rules = reactive<FormRules>({
+})
+// 重置
+const resetData = () => {
+  form.certificateNo = ''
+  form.certificateName = ''
+  form.certificateCompany = ''
+  form.certificateDate = ''
+  form.validDate = ''
+}
+const initDialog = (row: any) => {
+  dialogVisibleApprove.value = true
+}
+defineExpose({ initDialog })
+
+// 点击保存
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      dialogVisibleApprove.value = false
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) { return }
+  formEl.resetFields()
+  dialogVisibleApprove.value = false
+}
+</script>
+
+<template>
+  <el-dialog v-model="dialogVisibleApprove" title="审批操作" width="30%">
+    <el-form
+      ref="ruleFormRef" :model="form"
+      :rules="rules"
+    >
+      <el-form-item label="审批意见">
+        <!-- <el-input v-model="form.certificateNo" placeholder="证书号" /> -->
+        <el-radio-group v-model="form.radio">
+          <el-radio :label="1">
+            同意
+          </el-radio>
+          <el-radio :label="2">
+            拒绝
+          </el-radio>
+          <el-radio :label="3">
+            驳回
+          </el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="审批结论">
+        <el-input
+          :rows="4"
+          type="textarea"
+        />
+      </el-form-item>
+      <el-row :gutter="24">
+        <el-col :span="10">
+          <el-form-item label="审批人">
+            <el-input disabled value="xxxx" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="14">
+          <el-form-item label="审批时间">
+            <el-input disabled value="2020-12-12 00:00:00" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button type="primary" @click="submitForm(ruleFormRef)">确认</el-button>
+        <el-button @click="resetForm(ruleFormRef)">
+          取消
+        </el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
diff --git a/src/views/device/stateManage/components/templateAdd.vue b/src/views/device/stateManage/components/templateAdd.vue
new file mode 100644
index 0000000..9c4da0f
--- /dev/null
+++ b/src/views/device/stateManage/components/templateAdd.vue
@@ -0,0 +1,540 @@
+<!-- 新增或详情弹窗 -->
+<script lang="ts" setup name="addNotice">
+import { ElMessage, ElMessageBox } from 'element-plus'
+import type { FormInstance, FormRules } from 'element-plus'
+import type { deptType, selectType } from '@/views/device/standingBook/standingBook-interface'
+import showPhoto from '@/views/system/tool/showPhoto.vue'
+import { UploadFile } from '@/api/measure/file'
+import { getDictByCode } from '@/api/system/dict'
+import { getUserList } from '@/api/system/user'
+import { getDeptTreeList } from '@/api/system/dept'
+import comTreeSelect from '@/views/system/user/selecTree.vue'
+import { toTreeList } from '@/utils/structure'
+import type { userType } from '@/views/system/user/user-interface'
+const emits = defineEmits(['resetData'])
+const ruleFormRef = ref() // from组件
+const dialogVisible = ref<boolean>(true)
+const title = ref('')
+const name = ref('')
+const ruleForm = ref({
+  assetNo: '', // 资产编号
+  assetType: '', // 资产类型
+  assetSource: '', // 资产来源
+  equipmentNo: '', // 设备编号
+  equipmentName: '', // 设备名称
+  labelBind: '', // 标签绑定
+  modelNo: '', // 型号
+  equipmentSpecifications: '', // 设备规格
+  equipmentType: '', // 设备类型
+  equipmentCategory: '', // 设备类别
+  capitalSource: '', // 资本来源
+  managerLevel: '', // 管理级别
+  purpose: '', // 用途
+  technicalLevel: '', // 技术水平
+  intactState: '', // 完好状态
+  manufacturerCountry: '', // 厂家国别
+  manufacturer: '', // 生产厂家
+  overallDimension: '', // 外形尺寸
+  manufacturingNo: '', // 出厂编号
+  manufacturingDate: '', // 出厂年月
+  cardEstablishmentDate: '', // 立卡年月
+  weight: '', // 重量
+  enableDate: '', // 启用年月
+  singlePrice: '', // 单价
+  installIncidentalExpenses: '', //	安装及杂费
+  originValue: '', //	原值
+  useDept: '', //	使用部门
+  installPlace: '', //	安装地点
+  createUser: '', //		创建人/负责人
+  depreciationPeriod: '', //	折旧年限
+  depreciationMethod: '', //	折旧方法
+  attribute: '', //	属性
+  majorCategory: '', //	专业分类
+  presentOriginValue: '', //	目前原值
+  managerState: '1', //	管理状态
+  fileList: [] as any[], //	说明书
+  remark: '', //	备注
+  mesureType: '', //	检定方式
+  mesureRange: '', //	测量范围
+  uncertainty: '', //	不确定度
+  usePerson: '', //	使用人
+  mesureDept: '', //	检定部门
+  mesureCycle: '', //	检定周期
+  mesureDate: '', //	检定日期
+  validDate: '', //	有效日期
+  mesureResult: '', //	检定结果
+  abc: '', //	ABC
+  isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+  isMeasureAccount: '', //	是否是测量工装台账
+  isStandardSupportEquipment: '', //		是否标准配套设备
+  id: '',
+}) // 表单
+const rules = ref<FormRules>({
+  assetType: [{ required: true, message: '资产类型不能为空', trigger: 'blur' }],
+  equipmentName: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
+  manufacturer: [{ required: true, message: '生产厂家不能为空', trigger: 'blur' }],
+  manufacturingNo: [{ required: true, message: '出厂编号不能为空', trigger: 'blur' }],
+  manufacturingDate: [{ required: true, message: '出厂日期不能为空', trigger: 'blur' }],
+  modelNo: [{ required: true, message: '型号不能为空', trigger: 'blur' }],
+  abc: [{ required: true, message: 'ABC不能为空', trigger: 'blur' }],
+  cardEstablishmentDate: [{ required: true, message: '立卡年月不能为空', trigger: 'blur' }],
+  enableDate: [{ required: true, message: '启用日期不能为空', trigger: 'blur' }],
+  mesureDate: [{ required: true, message: '检定日期不能为空', trigger: 'blur' }],
+  validDate: [{ required: true, message: '有效日期不能为空', trigger: 'blur' }],
+}) // 表单验证规则
+const assetTypeList = ref<selectType[]>([]) // 资产类型
+const ABCList = ref<selectType[]>([]) // ABC
+const mesureTypeList = ref<selectType[]>([]) // 检定方式
+const majorCategoryList = ref<selectType[]>([]) // 专业分类
+const equipmentCategoryList = ref<selectType[]>([]) // 设备类别
+const mesureResultList = ref<selectType[]>([]) //  检定结果
+const equipmentTypeList = ref<selectType[]>([]) // 设备类型
+const managerLevelList = ref<selectType[]>([]) // 管理级别
+const depreciationMethodList = ref<selectType[]>([]) // 折旧方法
+const managerStateList = ref<selectType[]>([]) // 管理状态
+const capitalSourceList = ref<selectType[]>([]) // 资本来源
+const usePersonList = ref<userType[]>([]) // 使用人列表
+const useDeptList = ref<deptType[]>([]) // 使用部门列表
+const isWhether = ref<selectType[]>([
+  {
+    name: '是',
+    id: 'shi',
+    value: '1',
+  },
+  {
+    name: '否',
+    id: 'fou',
+    value: '0',
+  },
+])
+const deptProps = reactive({
+  parent: 'pid', value: 'id', label: 'name', children: 'children',
+})
+// 检定周期
+const mesureCycleList = ref<selectType[]>([
+  {
+    name: '半年一检',
+    id: '1',
+    value: '6',
+  },
+  {
+    name: '一年一检',
+    id: '2',
+    value: '12',
+  },
+  {
+    name: '两年一检',
+    id: '3',
+    value: '24',
+  },
+  {
+    name: '三年一检',
+    id: '4',
+    value: '36',
+  },
+  {
+    name: '四年一检',
+    id: '5',
+    value: '48',
+  },
+  {
+    name: '五年一检',
+    id: '6',
+    value: '60',
+  },
+])
+// 获取下拉框数
+const fetchData = () => {
+// 获取资产类型
+  getDictByCode('assetType').then((response) => {
+    assetTypeList.value = response.data
+  })
+  // 获取ABC
+  getDictByCode('ABC').then((response) => {
+    ABCList.value = response.data
+  })
+  // 获取检定方式
+  getDictByCode('mesureType').then((response) => {
+    mesureTypeList.value = response.data
+  })
+  // 获取专业分类
+  getDictByCode('majorCategory').then((response) => {
+    majorCategoryList.value = response.data
+  })
+  // 获取检定结果
+  getDictByCode('mesureResult').then((response) => {
+    mesureResultList.value = response.data
+  })
+  // 获取设备类别
+  getDictByCode('equipmentCategory').then((response) => {
+    equipmentCategoryList.value = response.data
+  })
+  // 获取设备类型
+  getDictByCode('equipmentType').then((response) => {
+    equipmentTypeList.value = response.data
+  })
+  // 获取管理级别
+  getDictByCode('managerLevel').then((response) => {
+    managerLevelList.value = response.data
+  })
+  // 获取折旧方法
+  getDictByCode('depreciationMethod').then((response) => {
+    depreciationMethodList.value = response.data
+  })
+  // 获取管理状态
+  getDictByCode('managerState').then((response) => {
+    managerStateList.value = response.data
+  })
+  // 获取资本来源
+  getDictByCode('capitalSource').then((response) => {
+    capitalSourceList.value = response.data
+  })
+  // 获取用户列表
+  getUserList({ offset: 1, limit: 99999 }).then((res) => {
+    usePersonList.value = res.data.rows
+  })
+  // 获取部门列表
+  getDeptTreeList().then((res) => {
+    // 转成树结构
+    useDeptList.value = toTreeList(res.data, '0', true)
+  })
+}
+// 重置
+const resetDATA = () => {
+  ruleForm.value = {
+    assetNo: '', // 资产编号
+    assetType: '', // 资产类型
+    assetSource: '', // 资产来源
+    equipmentNo: '', // 设备编号
+    equipmentName: '', // 设备名称
+    labelBind: '', // 标签绑定
+    modelNo: '', // 型号
+    equipmentSpecifications: '', // 设备规格
+    equipmentType: '', // 设备类型
+    equipmentCategory: '', // 设备类别
+    capitalSource: '', // 资本来源
+    managerLevel: '', // 管理级别
+    purpose: '', // 用途
+    technicalLevel: '', // 技术水平
+    intactState: '', // 完好状态
+    manufacturerCountry: '', // 厂家国别
+    manufacturer: '', // 生产厂家
+    overallDimension: '', // 外形尺寸
+    manufacturingNo: '', // 出厂编号
+    manufacturingDate: '', // 出厂年月
+    cardEstablishmentDate: '', // 立卡年月
+    weight: '', // 重量
+    enableDate: '', // 启用年月
+    singlePrice: '', // 单价
+    installIncidentalExpenses: '', //	安装及杂费
+    originValue: '', //	原值
+    useDept: '', //	使用部门
+    installPlace: '', //	安装地点
+    createUser: '', //		创建人/负责人
+    depreciationPeriod: '', //	折旧年限
+    depreciationMethod: '', //	折旧方法
+    attribute: '', //	属性
+    majorCategory: '', //	专业分类
+    presentOriginValue: '', //	目前原值
+    managerState: '1', //	管理状态
+    fileList: [] as any[], //	说明书
+    remark: '', //	备注
+    mesureType: '', //	检定方式
+    mesureRange: '', //	测量范围
+    uncertainty: '', //	不确定度
+    usePerson: '', //	使用人
+    mesureDept: '', //	检定部门
+    mesureCycle: '', //	检定周期
+    mesureDate: '', //	检定日期
+    validDate: '', //	有效日期
+    mesureResult: '', //	检定结果
+    abc: '', //	ABC
+    isCalibrationTestEquipment: '', //	是否是技术指标需要校准检定的设备
+    isMeasureAccount: '', //	是否是测量工装台账
+    isStandardSupportEquipment: '', //		是否标准配套设备
+    id: '',
+  }
+}
+// 弹窗初始化
+const initDialog = (row: any) => {
+  fetchData()
+  ruleFormRef.value?.resetFields()
+  title.value = row.title
+  name.value = row.name
+  // dialogVisible.value = true
+  // if (row.title !== '新建') {
+  //   assetsDetailApi({ id: row.id }).then((res) => {
+  //     for (const key in res.data) {
+  //       if (typeof res.data[key] == 'number') {
+  //         res.data[key] = String(res.data[key])
+  //       }
+  //     }
+  //     ruleForm.value = res.data
+  //   })
+  // }
+}
+defineExpose({ initDialog })
+// 关闭弹窗
+const close = () => {
+  resetDATA()
+  dialogVisible.value = false
+}
+// 提交
+const submitForm = async (formEl: FormInstance | undefined, flag: string) => {
+  if (!formEl) { return }
+  await formEl.validate((valid, fields) => {
+    if (valid) {
+      ElMessageBox.confirm(
+    `确认${flag}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+      ).then((res) => {
+        // 提交
+        if (title.value === '编辑' && ruleForm.value.fileList.length) {
+          ruleForm.value.fileList[0].id = undefined
+        }
+        (title.value === '新建' ? assetsAddApi : assetsUpdateApi) (ruleForm.value).then((res) => {
+          if (res.code == 200) {
+            formEl?.resetFields()
+            ElMessage.success('操作成功')
+            dialogVisible.value = false
+            close()
+            emits('resetData')
+          }
+        })
+        // dialogVisible.value = false
+      })
+    }
+  })
+}
+// 取消
+const resetForm = (formEl: FormInstance | undefined) => {
+  formEl?.resetFields()
+  dialogVisible.value = false
+  close()
+  emits('resetData')
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    UploadFile(fd).then((res) => {
+      if (res.code === 200) {
+        console.log(res.data[0])
+        // 重置当前验证
+        ruleForm.value.fileList = []
+        ruleForm.value.fileList.push({
+          assetId: '',
+          fileName: res.data[0],
+          minioFileName: res.data[0],
+          // id: '',
+        })
+        ruleFormRef.value?.clearValidate('minioFileName')
+        ElMessage.success('文件上传成功')
+      }
+      else {
+        ElMessage.error(res.message)
+      }
+    })
+  }
+}
+const upload = () => {
+  fileRef.value.click()
+}
+// 展示鉴定内容
+const isShowCalibration = ref<boolean>(false)
+// 若固定资产为测量设备，还需填写检定内容
+watch(() => ruleForm.value.assetType, (newVal) => {
+  if (newVal === '1') {
+    isShowCalibration.value = true
+  }
+})
+</script>
+
+<template>
+  <app-container style="overflow: hidden;">
+    <div class="body-container">
+      <div class="header">
+        <div class="title">
+          {{ name }} - {{ title }}
+        </div>
+        <span class="btns">
+          <el-button v-if="title !== '详情'" type="primary" @click="submitForm(ruleFormRef, '提交')">
+            保存
+          </el-button>
+          <el-button type="info" @click="resetForm(ruleFormRef)">
+            关闭
+          </el-button>
+        </span>
+      </div>
+      <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="right" label-width="110px" class="form" :class="[title === '详情' ? 'isDetail' : '']">
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="申请单位" prop="useDept">
+              <com-tree-select
+                v-if="title !== '详情'"
+                v-model="ruleForm.useDept" :options="useDeptList as any" placeholder="申请单位"
+                :tree-props="deptProps"
+              />
+              <el-select v-else v-model="ruleForm.useDept" placeholder="" :disabled="title === '详情'">
+                <el-option v-for="item in useDeptList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="申请人" prop="usePerson">
+              <el-select v-model="ruleForm.usePerson" :placeholder="title === '详情' ? '' : '申请人'" :disabled="title === '详情'">
+                <el-option v-for="item in usePersonList" :key="item.id" :label="item.name" :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备编号" prop="equipmentNo">
+              <el-input v-model.trim="ruleForm.equipmentNo" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备名称" prop="equipmentName">
+              <el-input v-model.trim="ruleForm.equipmentName" :placeholder="title === '详情' ? '' : '设备名称'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="型号" prop="modelNo">
+              <el-input v-model.trim="ruleForm.modelNo" :placeholder="title === '详情' ? '' : '型号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="设备规格" prop="equipmentSpecifications">
+              <el-input v-model.trim="ruleForm.equipmentSpecifications" :placeholder="title === '详情' ? '' : '设备规格'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="出厂编号" prop="manufacturingNo">
+              <el-input v-model.trim="ruleForm.manufacturingNo" :placeholder="title === '详情' ? '' : '出厂编号'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="生产厂家" prop="manufacturer">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '生产厂家'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="闲置时间" prop="manufacturingDate">
+              <el-date-picker
+                v-model="ruleForm.manufacturingDate" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD HH:mm:ss" :disabled="title === '详情'"
+                :placeholder="title === '详情' ? '' : '闲置时间'"
+                class="normal-date"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="18">
+            <el-form-item label="申请理由" prop="managerState">
+              <el-input v-model.trim="ruleForm.manufacturer" :placeholder="title === '详情' ? '' : '申请理由'" :disabled="title === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="24" class="marg">
+          <el-col :span="12">
+            <el-form-item label="附件" prop="minioFileName">
+              <show-photo :minio-file-name="ruleForm.fileList[0]?.minioFileName || ''" />
+              <input v-show="title === ''" ref="fileRef" type="file" @change="onFileChange">
+              <el-button v-if="title !== '详情'" type="primary" :disabled="title === '详情'" :style="{ 'margin-left': ruleForm.fileList[0]?.minioFileName ? '20px' : '0px' }" @click="upload">
+                {{ ruleForm.fileList[0]?.minioFileName ? '更换' : '上传' }}
+              </el-button>
+              <span v-if="title === '详情' && !ruleForm.fileList[0]?.minioFileName">暂无</span>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div v-if="title !== '新建' ">
+        <div class="header" style="margin-top: 10px;">
+          <div class="title">
+            审批流程
+          </div>
+        </div>
+        <div class="timeline">
+          <el-timeline>
+            <el-timeline-item timestamp="2018/4/12" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/12 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/3" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/3 20:46</p>
+              </el-card>
+            </el-timeline-item>
+            <el-timeline-item timestamp="2018/4/2" placement="top">
+              <el-card>
+                <h4>Update Github template</h4>
+                <p>Tom committed 2018/4/2 20:46</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </div>
+      </div>
+    </div>
+  </app-container>
+</template>
+
+<style lang="scss" scoped>
+.body-container {
+  .form {
+    border-radius: 8px;
+    background-color: #fff;
+    margin-top: 10px;
+    padding-top: 10px;
+  }
+
+  .header {
+    background-color: #fff;
+    height: 40px;
+    border-radius: 8px;
+    align-items: center;
+    flex-direction: column;
+    justify-content: center;
+    display: flex;
+
+    .title {
+      font-weight: 700;
+    }
+
+    .btns {
+      position: absolute;
+      right: 40px;
+      top: 14px;
+    }
+  }
+}
+
+.marg {
+  margin-top: 5px;
+}
+
+.timeline {
+  background-color: #fff;
+}
+
+.isDetail {
+  ::v-deep {
+    .el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap > .el-form-item__label::before,
+    .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
+      display: none;
+    }
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/components/templateList.vue b/src/views/device/stateManage/components/templateList.vue
new file mode 100644
index 0000000..6ee2e8c
--- /dev/null
+++ b/src/views/device/stateManage/components/templateList.vue
@@ -0,0 +1,395 @@
+<!-- 状态管理公共列表组件 -->
+<script lang="ts" setup>
+import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
+import approve from './approvalActionDialog.vue'
+import addDialog from './templateAdd.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    default: '',
+  },
+})
+// import { exportFile } from '@/utils/exportUtils'
+// const { proxy } = getCurrentInstance() as any
+const searchQuery = reactive({
+  limit: 10,
+  offset: 1,
+}) // 查询参数
+const loadingTable = ref<boolean>(false) // 表格loading
+const total = ref<number>(0) // 数据总条数
+const columns = ref([
+  {
+    text: '申请编号',
+    value: 'no',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '申请类型',
+    value: 'type',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备编号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备名称',
+    value: 'name',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '型号',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '设备状态',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请单位',
+    value: '',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请人',
+    value: 'managerLevelName',
+    width: '150',
+    align: 'center',
+  },
+  {
+    text: '申请时间',
+    value: 'time',
+    width: '180',
+    align: 'center',
+  },
+  {
+    text: '审批状态',
+    value: 'status',
+    width: '180',
+    align: 'center',
+  },
+]) // 表格
+const printObj = ref({
+  id: 'print', // 需要打印元素的id
+  popTitle: props.name, // 打印配置页上方的标题
+  extraHead: '', // 最上方的头部文字，附加在head标签上的额外标签，使用逗号分割
+  preview: false, // 是否启动预览模式，默认是false
+  previewBeforeOpenCallback() { console.log('正在加载预览窗口！') }, // 预览窗口打开之前的callback
+  previewOpenCallback() { console.log('已经加载完预览窗口，预览打开了！') }, // 预览窗口打开时的callback
+  beforeOpenCallback() { console.log('开始打印之前！') }, // 开始打印之前的callback
+  openCallback() { console.log('执行打印了！') }, // 调用打印时的callback
+  closeCallback() { console.log('关闭了打印工具！') }, // 关闭打印的callback(无法区分确认or取消)
+  clickMounted() { console.log('点击v-print绑定的按钮了！') },
+  // url: 'http://localhost:8080/', // 打印指定的URL，确保同源策略相同
+  // asyncUrl (reslove) {
+  //   setTimeout(() => {
+  //     reslove('http://localhost:8080/')
+  //   }, 2000)
+  // },
+  standard: '',
+  extarCss: '',
+})
+const list = ref() // 表格数据
+const addRef = ref() // 添加/编辑/详情/组件
+const approveRef = ref()
+const dialogVisible = ref<boolean>(false) // 添加组件的显示与隐藏
+// 获取数据列表
+const getList = () => {
+  loadingTable.value = true
+  // listPageApi(searchQuery).then((res) => {
+  //   if (res.code === 200) {
+  //     list.value = res.data.rows
+  //     total.value = res.data.total
+  //   }
+  //   loadingTable.value = false
+  // }).catch((_) => {
+  //   loadingTable.value = false
+  // })
+  setTimeout(() => {
+    list.value = [{
+      name: 'test',
+      status: '通过',
+      no: 1234,
+      time: '2022-12-12 00:00:00',
+      type: '闲置申请',
+    }]
+    total.value = 1
+    loadingTable.value = false
+  }, 1000)
+}
+// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
+const changePage = (val: { size?: number; page?: number }) => {
+  if (val && val.size) {
+    searchQuery.limit = val.size
+  }
+  if (val && val.page) {
+    searchQuery.offset = val.page
+  }
+  getList()
+}
+// 详情
+const detail = (row) => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '详情',
+    name: props.name,
+  })
+}
+// 编辑
+const update = (row) => {
+  dialogVisible.value = true
+  // addRef.value.initDialog({
+  //   title: '编辑',
+  //   ...row,
+  // })
+}
+// 删除
+const remove = (row) => {
+  ElMessageBox.confirm(
+    `确认删除${row.equipmentName}吗？`,
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+  // .then(() => {
+  //   assetsDeleteApi({ id: row.id as string }).then((res) => {
+  //     if (res.code === 200) {
+  //       ElMessage({
+  //         type: 'success',
+  //         message: '删除成功',
+  //       })
+  //       getList()
+  //     }
+  //   })
+  // })
+}
+// 同意
+const agree = (row) => {
+  console.log(approveRef.value)
+  approveRef.value.initDialog()
+}
+// 驳回
+const reject = (row) => {
+  approveRef.value.initDialog()
+}
+// 拒绝
+const refuse = (row) => {
+  approveRef.value.initDialog()
+}
+// 取消
+const cancel = (row) => {
+  ElMessageBox.confirm(
+    '确认取消吗？',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      cancelButtonText: '取消',
+      type: 'warning',
+    },
+  )
+}
+// 搜索
+const search = () => {
+  getList()
+}
+// 重置
+const reset = () => {
+  // searchQuery.equipmentCategory = ''
+  getList()
+}
+// 模板下载
+const templateDownload = () => {
+
+}
+// 标签识别
+const identify = () => {
+
+}
+// 新增
+const add = () => {
+  dialogVisible.value = true
+  addRef.value.initDialog({
+    title: '新建',
+    name: props.name,
+  })
+}
+// 导出
+const exportExcelBtn = () => {
+  const loading = ElLoading.service({
+    lock: true,
+    text: 'Loading',
+    background: 'rgba(255, 255, 255, 0.8)',
+  })
+
+  // listExportApi({ ...searchQuery, limit: undefined, offset: undefined }).then((res) => {
+  //   exportFile(res.data, '固定资产列表')
+  //   loading.close()
+  // }).catch((_) => {
+  //   loading.close()
+  // })
+}
+const fileRef = ref() // 文件上传input
+const onFileChange = (event: any) => {
+  // 原生上传
+  // console.log(event.target.files)
+  // if (event.target.files[0].type === 'application/pdf') {
+  if (event.target.files?.length !== 0) {
+    // 创建formdata对象
+    const fd = new FormData()
+    fd.append('multipartFile', event.target.files[0])
+    // listImporttApi(fd).then((res) => {
+    //   if (res.code === 200) {
+    //     ElMessage.success('上传成功')
+    //   }
+    //   else {
+    //     ElMessage.error(res.message)
+    //   }
+    // })
+  }
+//   }
+//   else {
+//     ElMessage.error('请上传pdf格式')
+//   }
+}
+// 批量导入
+const batchImport = () => {
+  fileRef.value.click()
+}
+// 传给子组件的刷新事件
+const refreshDta = () => {
+  getList()
+  dialogVisible.value = false
+}
+onMounted(() => {
+  getList()
+})
+</script>
+
+<template>
+  <div>
+    <!-- 审批操作组件 -->
+    <approve ref="approveRef" @reset-data="refreshDta" />
+    <!-- 新建，编辑，详情组件 -->
+    <add-dialog v-show="dialogVisible" ref="addRef" @reset-data="refreshDta" />
+    <!-- 布局 -->
+    <app-container v-show="!dialogVisible">
+      <!-- 筛选条件 -->
+      <search-area :need-clear="true" @search="search" @clear="reset">
+        <search-item>
+          <el-input v-model="searchQuery.assetNo" placeholder="申请编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentName" placeholder="设备编号" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.modelNo" placeholder="设备名称" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-input v-model="searchQuery.equipmentSpecifications" placeholder="申请单位" clearable class="w-50 m-2" />
+        </search-item>
+        <search-item>
+          <el-select v-model="searchQuery.publisher" placeholder="申请状态" clearable>
+            <el-option v-for="item in []" :key="item.id" :label="item.name" :value="item.id" />
+          </el-select>
+        </search-item>
+      </search-area>
+      <table-container>
+        <!-- 表头区域 -->
+        <template #btns-right>
+          <input v-show="(searchQuery.limit === 0)" ref="fileRef" type="file" multiple @change="onFileChange">
+          <!-- <el-button type="primary" @click="batchImport">
+            批量导入
+          </el-button>
+          <el-button type="primary" @click="templateDownload">
+            模板下载
+          </el-button> -->
+          <el-button type="primary" @click="add">
+            新建
+          </el-button>
+          <el-button type="primary" @click="exportExcelBtn">
+            导出
+          </el-button>
+          <el-button v-print="printObj" type="primary">
+            打印
+          </el-button>
+        </template>
+        <!-- 表格区域 -->
+        <normal-table
+          id="print"
+          :data="list" :total="total" :columns="columns as any"
+          :is-showmulti-select="true"
+          :query="{ limit: searchQuery.limit, offset: searchQuery.offset }"
+          :list-loading="loadingTable"
+          @change="changePage"
+        >
+          <template #preColumns>
+            <el-table-column label="序号" width="55" align="center">
+              <template #default="scope">
+                {{ (searchQuery.offset - 1) * searchQuery.limit + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+          </template>
+          <template #columns>
+            <el-table-column label="操作" align="center" width="300" fixed="right">
+              <template #default="{ row }">
+                <!-- <el-button size="small" type="primary" link @click="update(row)">
+                  编辑
+                </el-button> -->
+                <el-button size="small" type="primary" link @click="detail(row)">
+                  查看
+                </el-button>
+                <el-button size="small" type="primary" link @click="agree(row)">
+                  同意
+                </el-button>
+                <el-button size="small" type="primary" link @click="reject(row)">
+                  驳回
+                </el-button>
+                <el-button size="small" type="primary" link @click="refuse(row)">
+                  拒绝
+                </el-button>
+                <el-button size="small" type="primary" link @click="cancel(row)">
+                  取消
+                </el-button>
+                <el-button size="small" type="danger" link @click="remove(row)">
+                  删除
+                </el-button>
+              </template>
+            </el-table-column>
+          </template>
+        </normal-table>
+      </table-container>
+    </app-container>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.normal-input {
+  width: 154px !important;
+}
+
+.normal-date {
+  width: 154px !important;
+}
+
+.normal-select {
+  width: 154px !important;
+}
+
+:deep(.el-table__header) {
+  background-color: #bbb;
+}
+</style>
+
diff --git a/src/views/device/stateManage/components/templatePage.vue b/src/views/device/stateManage/components/templatePage.vue
new file mode 100644
index 0000000..5fb0163
--- /dev/null
+++ b/src/views/device/stateManage/components/templatePage.vue
@@ -0,0 +1,60 @@
+<!-- 状态管理公共模板 -->
+<script lang="ts" setup name="stateMangeTemplate">
+import list from './templateList.vue'
+const props = defineProps({
+  name: {
+    type: String,
+    required: true,
+  },
+  authority: {
+    type: String,
+    required: true,
+  },
+})
+interface menuType {
+  name: string
+  comp: any
+}
+const menu = shallowRef<menuType[]>([
+  { name: '全部', comp: list },
+  { name: '草稿箱', comp: list },
+  { name: '待审批', comp: list },
+  { name: '审批中', comp: list },
+  { name: '已通过', comp: list },
+  { name: '未通过', comp: list },
+  { name: '已取消', comp: list },
+])
+const current = ref('全部')
+const currentComp = shallowRef(list)
+watch(current, (newValue) => {
+  currentComp.value = menu.value.filter(item => item.name === newValue)[0].comp
+})
+</script>
+
+<template>
+  <div class="container">
+    <div class="btns">
+      <!-- 三级菜单 -->
+      <el-radio-group v-model="current">
+        <el-radio-button v-for="item in menu" :key="item.name" :label="item.name">
+          {{ item.name }}
+        </el-radio-button>
+      </el-radio-group>
+    </div>
+    <!-- 展示区域 -->
+    <component :is="currentComp" :title="current" :name="props.name" />
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.container {
+  position: relative;
+
+  .btns {
+    position: fixed;
+    top: 67px;
+    right: 15px;
+    z-index: 999;
+  }
+}
+</style>
diff --git a/src/views/device/stateManage/unusedApply.vue b/src/views/device/stateManage/unusedApply.vue
index fb2cffa..4b02b09 100644
--- a/src/views/device/stateManage/unusedApply.vue
+++ b/src/views/device/stateManage/unusedApply.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup name="unusedApply">
-// 逻辑代码
+import page from './components/templatePage.vue'
 </script>
 
 <template>
   <app-container>
-    设备闲置申请
+    <page name="设备闲置申请" authority="unusedApply" />
   </app-container>
 </template>
 
diff --git a/src/views/measure/file/components/approve/passed.vue b/src/views/measure/file/components/approve/passed.vue
index 8e08302..50ea492 100644
--- a/src/views/measure/file/components/approve/passed.vue
+++ b/src/views/measure/file/components/approve/passed.vue
@@ -4,5 +4,5 @@
 </script>
 
 <template>
-  <template-pag name="已通过" />
+  <template-pag name="已通过" value="4" />
 </template>
diff --git a/src/views/measure/file/components/approve/templatePage.vue b/src/views/measure/file/components/approve/templatePage.vue
index c0e4c86..44e3e4d 100644
--- a/src/views/measure/file/components/approve/templatePage.vue
+++ b/src/views/measure/file/components/approve/templatePage.vue
@@ -4,7 +4,7 @@
 import { ElLoading, ElMessage, ElMessageBox } from 'element-plus'
 // import addDialog from './addDialog.vue'
 // import type { fileListType, fileResType, fileSearchType } from '@/views/measure/file/file-interface'
-import { deleteApi, listPageApi, updateApi } from '@/api/measure/file'
+import { approvallistPageApi, approvallistPageDetailApi } from '@/api/measure/file'
 import { getDictByCode } from '@/api/system/dict'
 import { exportExcel } from '@/utils/exportXlsx'
 // import { uploadApi } from '@/api/system/notice'
@@ -13,18 +13,23 @@
     type: String,
     default: '',
   },
+  value: {
+    type: String,
+    default: '',
+  },
 })
 const searchQuery = reactive({
   fileNo: '', // 编号
   fileName: '', // 名称
   publishTime: '', // 发布时间
   fileCode: '', // 文件号
-  effectiveTime: '', // 实施时间
-  effectiveStatus: '', // 实施状态
+  createUser: '', // 创建人
+  createTime: '', // 创建
+  approvalStatus: props.value, // 审批状态
   limit: 10,
   offset: 1,
   fileType: '', // 类型
-  create: '', // 创建人
+  formId: '',
 }) // 查询参数
 const loadingTable = ref<boolean>(false) // 表格loading
 const total = ref<number>(0) // 数据总条数
@@ -66,19 +71,19 @@
   fileTypeList.value = res.data
   searchQuery.fileType = res.data.filter(item => item.name === props.name)[0].value
 }
-// const effectiveStatusSelect = ref<fileResType[]>([])
-// 获取实施状态
-// const getStatus = () => {
-//   getDictByCode('effectiveStatus').then((res) => {
-//     if (res.code === 200) {
-//       effectiveStatusSelect.value = res.data
-//     }
-//   })
-// }
+const approvalStatus = ref([])
+// 获取审批状态
+const getStatus = () => {
+  getDictByCode('approvalStatus').then((res) => {
+    if (res.code === 200) {
+      approvalStatus.value = res.data
+    }
+  })
+}
 // 获取数据列表
 const getList = () => {
   loadingTable.value = true
-  listPageApi(searchQuery).then((res) => {
+  approvallistPageApi(searchQuery).then((res) => {
     if (res.code === 200) {
       list.value = res.data.rows
       total.value = res.data.total
@@ -255,10 +260,10 @@
 //   dialogVisible.value = false
 // }
 onMounted(() => {
-  // getStatus()
-  getType().then((_) => {
-    getList()
-  })
+  getStatus()
+  // getType().then((_) => {
+  getList()
+  // })
 })
 </script>
 
@@ -290,10 +295,10 @@
         </search-item>
         <search-item>
           <el-date-picker
-            v-model="searchQuery.publishTime" type="datetime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
+            v-model="searchQuery.createTime" type="datetime" format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
             placeholder="创建时间"
             class="normal-date"
-            style="width: 130px;"
+            style="width: 170px;"
           />
         </search-item>
         <search-item>
@@ -303,7 +308,7 @@
             class="normal-date"
             style="width: 130px;"
           /> -->
-          <el-input v-model="searchQuery.create" placeholder="创建人" clearable class="w-50 m-2 normal-input" />
+          <el-input v-model="searchQuery.createUser" placeholder="创建人" clearable class="w-50 m-2 normal-input" />
         </search-item>
         <search-item>
           <!-- <el-select v-model="searchQuery.effectiveStatus" class="m-2 normal-select" placeholder="实施状态">
@@ -383,15 +388,15 @@
 
 <style lang="scss" scoped>
 .normal-input {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 .normal-date {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 .normal-select {
-  width: 130px !important;
+  width: 170px !important;
 }
 
 :deep(.el-table__header) {
diff --git a/src/views/measure/measureDept/components/addDialog.vue b/src/views/measure/measureDept/components/addDialog.vue
index dded335..cf0dd4f 100644
--- a/src/views/measure/measureDept/components/addDialog.vue
+++ b/src/views/measure/measureDept/components/addDialog.vue
@@ -6,7 +6,7 @@
 import { getUserList } from '@/api/system/user'
 import { getDictByCode } from '@/api/system/dict'
 import type { userType } from '@/views/system/user/user-interface'
-import { listPageApi, updateApi } from '@/api/measure/measureDept'
+import { listPageApi, standardlistPageApi, updateApi } from '@/api/measure/measureDept'
 import { getStaffList } from '@/api/measure/person'
 const emits = defineEmits(['resetData'])
 const router = useRoute()
@@ -20,6 +20,8 @@
   administrationJob: '', // 行政职务
   technologyJob: '', // 技术职务
   remark: '', // 备注
+  pDeptId: '',
+  pDeptName: '',
 }) // 表单
 const title = ref('')
 const rules = ref<FormRules>({
@@ -218,27 +220,27 @@
     column: [
       {
         label: '标准装置编号',
-        data: '',
+        data: 'standardNo',
       },
       {
         label: '标准装置名称',
-        data: '',
+        data: 'standardName',
       },
       {
         label: '类别',
-        data: '',
+        data: 'categoryName',
       },
       {
         label: '标准等级',
-        data: '',
+        data: 'standardLevelName',
       },
       {
         label: '传递范围',
-        data: '',
+        data: 'transmitRangeName',
       },
       {
         label: '使用人',
-        data: '',
+        data: 'standardOwnerName',
       },
     ],
   },
@@ -308,27 +310,27 @@
     column: [
       {
         label: '标准装置编号',
-        data: '',
+        data: 'standardNo',
       },
       {
         label: '标准装置名称',
-        data: '',
+        data: 'standardName',
       },
       {
         label: '类别',
-        data: '',
+        data: 'categoryName',
       },
       {
         label: '标准等级',
-        data: '',
+        data: 'standardLevelName',
       },
       {
         label: '传递范围',
-        data: '',
+        data: 'transmitRangeName',
       },
       {
         label: '使用人',
-        data: '',
+        data: 'standardOwnerName',
       },
     ],
   },
@@ -401,11 +403,12 @@
 }
 // 获取标准装置信息
 const getDeviceInfo = () => {
-  // 接口暂未写好 根据实际情况赋值
-  // getDictByCode('pDeptId').then((response) => {
-  //   changeList_ks.value[2].data = response.data
-  //   changeList_gcz.value[2].data = response.data
-  // })
+  standardlistPageApi({ standardLaboratory: ruleForm.value.deptId, limit: 99999, offset: 1 }).then((res) => {
+    if (res.code == 200) {
+      changeList_ks.value[2].data = res.data.rows
+      changeList_gcz.value[2].data = res.data.rows
+    }
+  })
 }
 // const handleSizeChange = (val: number) => {
 //   searchQuery.value.limit = val
@@ -437,6 +440,7 @@
     getDeviceInfo()
   }
   ruleForm.value = row
+  console.log(row, 'row')
   // 不同组织来判断展示的列表
   if (title.value.split('-')[1] === '部门') {
     changeList.value = changeList_bm.value
@@ -479,28 +483,50 @@
           </el-col>
           <el-col :span="6">
             <el-form-item :label="`${title.split('-')[1]}名称`" prop="organizeName">
-              <el-input v-model.trim="ruleForm.organizeName" :placeholder="`${title.split('-')[1]}名称`" :disabled="title.split('-')[2] === '详情'" />
+              <el-input v-model.trim="ruleForm.organizeName" :placeholder="title.split('-')[2] === '详情' ? '' : `${title.split('-')[1]}名称`" :disabled="title.split('-')[2] === '详情'" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row v-if="title.split('-')[1] === '工程组'" :gutter="24" class="marg">
+          <el-col :span="6">
+            <el-form-item label="科室编号">
+              <el-input v-model.trim="ruleForm.pDeptId" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="科室名称">
+              <el-input v-model.trim="ruleForm.pDeptName" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="所属部门编号">
+              <el-input v-model.trim="ruleForm.pDeptId" disabled />
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="所属部门名称">
+              <el-input v-model.trim="ruleForm.pDeptName" disabled />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="24" class="marg">
           <el-col :span="6">
             <el-form-item label="负责人" prop="director">
-              <el-select v-model="ruleForm.director" placeholder="负责人" :disabled="title.split('-')[2] === '详情'">
+              <el-select v-model="ruleForm.director" :placeholder="title.split('-')[2] === '详情' ? '' : '负责人'" :disabled="title.split('-')[2] === '详情'">
                 <el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.name" />
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="6">
             <el-form-item label="技术职务" prop="technologyJob">
-              <el-select v-model="ruleForm.technologyJob" placeholder="技术职务" :disabled="title.split('-')[2] === '详情'">
+              <el-select v-model="ruleForm.technologyJob" :placeholder="title.split('-')[2] === '详情' ? '' : '技术职务'" :disabled="title.split('-')[2] === '详情'">
                 <el-option v-for="item in technologyJobList" :key="item.id" :label="item.name" :value="item.value" />
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="6">
             <el-form-item label="行政职务" prop="administrationJob">
-              <el-select v-model="ruleForm.administrationJob" placeholder="行政职务" :disabled="title.split('-')[2] === '详情'">
+              <el-select v-model="ruleForm.administrationJob" :placeholder="title.split('-')[2] === '详情' ? '' : '行政职务'" :disabled="title.split('-')[2] === '详情'">
                 <el-option v-for="item in administrationJobList" :key="item.id" :label="item.name" :value="item.value" />
               </el-select>
             </el-form-item>
@@ -509,7 +535,7 @@
         <el-row :gutter="24" class="marg">
           <el-col :span="12">
             <el-form-item label="备注" prop="remark">
-              <el-input v-model.trim="ruleForm.remark" placeholder="备注" :disabled="title.split('-')[2] === '详情'" />
+              <el-input v-model.trim="ruleForm.remark" :placeholder="title.split('-')[2] === '详情' ? '' : '备注'" :disabled="title.split('-')[2] === '详情'" />
             </el-form-item>
           </el-col>
         </el-row>