From 7c5103ebb4155016eaa9c28381fdc8bd03e59c38 Mon Sep 17 00:00:00 2001
From: sjl <1716605279@qq.com>
Date: Wed, 23 Oct 2024 19:30:11 +0800
Subject: [PATCH] =?UTF-8?q?=E6=97=A5=E5=BF=97=E7=AE=A1=E7=90=86=EF=BC=8C?=
 =?UTF-8?q?=E8=AF=AF=E5=B7=AE=E4=BD=93=E7=B3=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .vscode/settings.json                         |   1 +
 frontend/src/api/error/errorData.ts           |  36 +++
 frontend/src/api/error/interface/index.ts     |  17 +
 frontend/src/components/TimeControl/index.vue | 205 ++++++------
 .../resource/components/ResourceDialog.vue}   |   6 +-
 .../src/views/authority/resource/index.vue    |  43 ++-
 frontend/src/views/log/index.vue              |  13 +-
 .../components/Error standardDialog.vue       |  91 ++++++
 .../components/ErrorSystemDialog.vue          | 294 ++++++++++++++++++
 .../components/IndicatorTypeDialog.vue        |  91 ++++++
 .../src/views/machine/errorSystem/index.vue   | 104 +++++++
 11 files changed, 791 insertions(+), 110 deletions(-)
 create mode 100644 frontend/src/api/error/errorData.ts
 create mode 100644 frontend/src/api/error/interface/index.ts
 rename frontend/src/{components/ResourceDialog/index.vue => views/authority/resource/components/ResourceDialog.vue} (94%)
 create mode 100644 frontend/src/views/machine/errorSystem/components/Error standardDialog.vue
 create mode 100644 frontend/src/views/machine/errorSystem/components/ErrorSystemDialog.vue
 create mode 100644 frontend/src/views/machine/errorSystem/components/IndicatorTypeDialog.vue
 create mode 100644 frontend/src/views/machine/errorSystem/index.vue

diff --git a/.vscode/settings.json b/.vscode/settings.json
index 12d3367..9d8722b 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,6 +1,7 @@
 {
     "cSpell.words": [
         "daterange",
+        "errordata",
         "logdata",
         "resourcedata",
         "resourcename",
diff --git a/frontend/src/api/error/errorData.ts b/frontend/src/api/error/errorData.ts
new file mode 100644
index 0000000..ecfd166
--- /dev/null
+++ b/frontend/src/api/error/errorData.ts
@@ -0,0 +1,36 @@
+import type {ErrorSystem} from "./interface"
+
+const errordata = ref<ErrorSystem.ErrorSystemList[]>([
+      {
+        'id': '1',
+        'name': 'Q/GDW 1650.2- 2016',
+        'year':'2016',
+        'level':'A级',
+        'details': [
+          { measured: '详细1-1', deviceLevel: '详细1-2', condition: '详细1-3', maxErrorValue: '详细1-4' },
+          { measured: '详细1-5', deviceLevel: '详细1-6', condition: '详细1-7', maxErrorValue: '详细1-8' },
+        ],
+      },
+      {
+        'id': '2',
+        'name': 'Q/GDW 10650.2 - 2021',
+        'year':'2021',
+        'level':'A级',
+        'details': [
+          { measured: '详细1-1', deviceLevel: '详细1-2', condition: '详细1-3', maxErrorValue: '详细1-4' },
+          { measured: '详细1-5', deviceLevel: '详细1-6', condition: '详细1-7', maxErrorValue: '详细1-8' },
+        ],
+      },
+      {
+        'id': '3',
+        'name': 'GBT 19862 - 2016',
+        'year':'2016',
+        'level':'A级',
+        'details': [
+          { measured: '详细1-1', deviceLevel: '详细1-2', condition: '详细1-3', maxErrorValue: '详细1-4' },
+          { measured: '详细1-5', deviceLevel: '详细1-6', condition: '详细1-7', maxErrorValue: '详细1-8' },
+        ],
+      },
+    ])
+
+    export default errordata
\ No newline at end of file
diff --git a/frontend/src/api/error/interface/index.ts b/frontend/src/api/error/interface/index.ts
new file mode 100644
index 0000000..5f3c9d6
--- /dev/null
+++ b/frontend/src/api/error/interface/index.ts
@@ -0,0 +1,17 @@
+// 误差体系模块
+export namespace ErrorSystem  {
+    // 误差体系列表
+    export interface ErrorSystemList {
+      id: string;//误差体系表Id
+      name: string;//误差体系名称
+      year:string;//标准实施年份
+      level:string;//使用设备等级
+      details?: Array<{
+        measured: string;//被测量
+        deviceLevel: string;//检测装置级别
+        condition: string;//测量条件
+        maxErrorValue: string;//最大误差
+      }>; // 详细信息
+    }
+
+  }
\ No newline at end of file
diff --git a/frontend/src/components/TimeControl/index.vue b/frontend/src/components/TimeControl/index.vue
index 41b737e..6f0962f 100644
--- a/frontend/src/components/TimeControl/index.vue
+++ b/frontend/src/components/TimeControl/index.vue
@@ -6,14 +6,13 @@
       placeholder='选择时间单位'
       @change='handleChange'
     >
-      <!--采用 v-for 去动态渲染-->
-      <el-option label='按日' value='日'></el-option>
-      <el-option label='按周' value='周'></el-option>
-      <el-option label='按月' value='月'></el-option>
-      <el-option label='按季度' value='季度'></el-option>
-      <el-option label='按年' value='年'></el-option>
-      <el-option label='自定义' value='自定义'></el-option>
-
+      <!-- 采用 v-for 动态渲染 -->
+      <el-option
+        v-for="unit in timeUnits"
+        :key="unit.value"
+        :label="unit.label"
+        :value="unit.value"
+      ></el-option>
     </el-select>
 
     <!-- 禁用时间选择器 -->
@@ -23,6 +22,7 @@
         v-model='startDate'
         type='date'
         placeholder='起始时间'
+        :disabled-date="disableStartDate"
         :readonly="timeUnit != '自定义'"
       ></el-date-picker>
       <el-text>~</el-text>
@@ -31,6 +31,7 @@
         v-model='endDate'
         type='date'
         placeholder='结束时间'
+        :disabled-date="disableEndDate"
         :readonly="timeUnit !== '自定义'"
       ></el-date-picker>
     </div>
@@ -59,133 +60,159 @@
   </div>
 </template>
 
-<script>
-export default {
-  data() {
-    return {
-      timeUnit: '周', // 默认选择按周
-      startDate: null, // 起始日期
-      endDate: null, // 结束日期
-      isNextDisabled: false, // 控制下一周期按钮的禁用状态
-      today: new Date(), // 当前日期
-    }
-  },
-  created() {
-    // 组件创建时更新日期范围
-    this.updateDateRange()
-  },
-  methods: {
-    handleChange(value) {
+
+
+<script setup lang="ts">
+    import { watch,computed, ref,reactive ,onMounted, defineProps, defineEmits } from 'vue';
+
+    const timeUnit = ref<string>('日'); // 默认选择按周
+    const startDate = ref<Date>(new Date()); // 起始日期
+    const endDate = ref<Date>(new Date()); // 结束日期
+    const isNextDisabled = ref<boolean>(false); // 控制下一周期按钮的禁用状态
+    const today = ref<Date>(new Date()); // 当前日期
+    const timeUnits = [
+      { label: '日', value: '日' },
+      { label: '周', value: '周' },
+      { label: '月', value: '月' },
+      { label: '季度', value: '季度' },
+      { label: '年', value: '年' },
+      { label: '自定义', value: '自定义' },
+    ];
+
+    // 在组件挂载时更新日期范围
+    onMounted(() => {
+        updateDateRange();
+    });
+    const handleChange = (unit: string)=> {
       // 根据选择的时间单位处理日期变化
-      if (value !== '自定义') {
-        this.updateDateRange()
+      if (unit !== '自定义') {
+        updateDateRange()
       } else {
         // 自定义选项逻辑
-        this.startDate = new Date()
-        this.endDate = new Date()
+        startDate.value = new Date(new Date().setDate(new Date().getDate() - 1))
+        endDate.value = new Date()
       }
-      this.updateNextButtonStatus()
-    },
-    updateDateRange() {
-      const today = this.today
+      updateNextButtonStatus()
+    }
+    const updateDateRange = () =>  {
+      
       // 根据选择的时间单位计算起始和结束日期
-      if (this.timeUnit === '日') {
-        this.startDate = today
-        this.endDate = today
-      } else if (this.timeUnit === '周') {
-        this.startDate = this.getStartOfWeek(today)
-        this.endDate = this.getEndOfWeek(today)
-      } else if (this.timeUnit === '月') {
-        this.startDate = new Date(today.getFullYear(), today.getMonth(), 1)
-        this.endDate = new Date(today.getFullYear(), today.getMonth() + 1, 0)
-      } else if (this.timeUnit === '季度') {
-        const quarter = Math.floor(today.getMonth() / 3)
-        this.startDate = new Date(today.getFullYear(), quarter * 3, 1)
-        this.endDate = new Date(today.getFullYear(), quarter * 3 + 3, 0)
-      } else if (this.timeUnit === '年') {
-        this.startDate = new Date(today.getFullYear(), 0, 1)
-        this.endDate = new Date(today.getFullYear(), 11, 31)
+      if (timeUnit.value === '日') {
+        startDate.value = today.value
+        endDate.value = today.value
+      } else if (timeUnit.value === '周') {
+        startDate.value = getStartOfWeek(today.value)
+        endDate.value = getEndOfWeek(today.value)
+      } else if (timeUnit.value === '月') {
+        startDate.value = new Date(today.value.getFullYear(), today.value.getMonth(), 1)
+        endDate.value = new Date(today.value.getFullYear(), today.value.getMonth() + 1, 0)
+      } else if (timeUnit.value === '季度') {
+        const quarter = Math.floor(today.value.getMonth() / 3)
+        startDate.value = new Date(today.value.getFullYear(), quarter * 3, 1)
+        endDate.value = new Date(today.value.getFullYear(), quarter * 3 + 3, 0)
+      } else if (timeUnit.value === '年') {
+        startDate.value = new Date(today.value.getFullYear(), 0, 1)
+        endDate.value = new Date(today.value.getFullYear(), 11, 31)
       }
-      this.updateNextButtonStatus()
-    },
-    getStartOfWeek(date) {
+      updateNextButtonStatus()
+    }
+    const getStartOfWeek =(date:Date)=> {
       const startOfWeek = new Date(date)
       const day = startOfWeek.getDay()
       const diff = day === 0 ? -6 : 1 - day // 星期天的情况
       startOfWeek.setDate(startOfWeek.getDate() + diff)
       return startOfWeek
-    },
-    getEndOfWeek(date) {
+    }
+    const getEndOfWeek =(date:Date) =>{
       const endOfWeek = new Date(date)
       const day = endOfWeek.getDay()
       const diff = day === 0 ? 0 : 7 - day // 星期天的情况
       endOfWeek.setDate(endOfWeek.getDate() + diff)
       return endOfWeek
-    },
-    prevPeriod() {
-      const prevStartDate = new Date(this.startDate)
-      const prevEndDate = new Date(this.endDate)
+    }
+    const prevPeriod =()=> {
+      const prevStartDate = new Date(startDate.value)
+      const prevEndDate = new Date(endDate.value)
 
-      if (this.timeUnit === '日') {
+      if (timeUnit.value === '日') {
         prevStartDate.setDate(prevStartDate.getDate() - 1)
         prevEndDate.setDate(prevEndDate.getDate() - 1)
-      } else if (this.timeUnit === '周') {
+      } else if (timeUnit.value === '周') {
         prevStartDate.setDate(prevStartDate.getDate() - 7)
         prevEndDate.setDate(prevEndDate.getDate() - 7)
-      } else if (this.timeUnit === '月') {
+      } else if (timeUnit.value === '月') {
         prevStartDate.setMonth(prevStartDate.getMonth() - 1)
         prevEndDate.setMonth(prevEndDate.getMonth() - 1)
-      } else if (this.timeUnit === '季度') {
+      } else if (timeUnit.value === '季度') {
         prevStartDate.setMonth(prevStartDate.getMonth() - 3)
         prevEndDate.setMonth(prevEndDate.getMonth() - 3)
-      } else if (this.timeUnit === '年') {
+      } else if (timeUnit.value === '年') {
         prevStartDate.setFullYear(prevStartDate.getFullYear() - 1)
         prevEndDate.setFullYear(prevEndDate.getFullYear() - 1)
       }
 
-      this.startDate = prevStartDate
-      this.endDate = prevEndDate
-      this.updateNextButtonStatus()
-    },
-    goToCurrent() {
-      if (this.timeUnit !== '自定义') {
-        this.updateDateRange() // 更新为当前选择时间单位的时间范围
+      startDate.value = prevStartDate
+      endDate.value = prevEndDate
+      updateNextButtonStatus()
+    }
+    const goToCurrent =()=> {
+      if (timeUnit.value !== '自定义') {
+        updateDateRange() // 更新为当前选择时间单位的时间范围
       }
-    },
-    nextPeriod() {
-      const nextStartDate = new Date(this.startDate)
-      const nextEndDate = new Date(this.endDate)
+    }
+    const nextPeriod = ()=> {
+      const nextStartDate = new Date(startDate.value)
+      const nextEndDate = new Date(endDate.value)
 
-      if (this.timeUnit === '日') {
+      if (timeUnit.value === '日') {
         nextStartDate.setDate(nextStartDate.getDate() + 1)
         nextEndDate.setDate(nextEndDate.getDate() + 1)
-      } else if (this.timeUnit === '周') {
+      } else if (timeUnit.value === '周') {
         nextStartDate.setDate(nextStartDate.getDate() + 7)
         nextEndDate.setDate(nextEndDate.getDate() + 7)
-      } else if (this.timeUnit === '月') {
+      } else if (timeUnit.value === '月') {
         nextStartDate.setMonth(nextStartDate.getMonth() + 1)
         nextEndDate.setMonth(nextEndDate.getMonth() + 1)
-      } else if (this.timeUnit === '季度') {
+      } else if (timeUnit.value === '季度') {
         nextStartDate.setMonth(nextStartDate.getMonth() + 3)
         nextEndDate.setMonth(nextStartDate.getMonth() + 3)
-      } else if (this.timeUnit === '年') {
+      } else if (timeUnit.value === '年') {
         nextStartDate.setFullYear(nextStartDate.getFullYear() + 1)
         nextEndDate.setFullYear(nextEndDate.getFullYear() + 1)
       }
 
-      this.startDate = nextStartDate
-      this.endDate = nextEndDate
-      this.updateNextButtonStatus()
-    },
-    updateNextButtonStatus() {
+      startDate.value = nextStartDate
+      endDate.value = nextEndDate
+      updateNextButtonStatus()
+    }
+    const updateNextButtonStatus =()=> {
       // 更新下一个按钮的禁用状态
       const maxDate = new Date() // 假设最新日期为今天
-      this.isNextDisabled = this.endDate > maxDate
-    },
-  },
-}
+      // 将 maxDate 设置为当天的开始时间
+      maxDate.setHours(0, 0, 0, 0);
+      // 将 endDate 设置为当天的开始时间并进行比较
+      const endDateAdjusted = new Date(endDate.value);
+      endDateAdjusted.setHours(0, 0, 0, 0);
+      // 仅比较日期部分
+      isNextDisabled.value = endDateAdjusted >= maxDate;
+    }
+
+    // 限制开始日期不能选择超过当前日期
+    const disableStartDate = (date:Date)=> {
+      return date > today.value;
+    }
+    // 限制结束日期不能超过当前日期且必须大于开始日期
+    const disableEndDate = (date:Date)=> {
+      if (timeUnit.value !== '自定义') return false; // 如果不是自定义时间单位，则不限制
+      const start = new Date(startDate.value);
+      return date > today.value || (start && date <= start);
+    }
+    
+    defineExpose({
+      startDate,
+      endDate,
+    })
 
-// defineProps('include','exclude','default')
 </script>
 
 <style scoped lang='scss'>
diff --git a/frontend/src/components/ResourceDialog/index.vue b/frontend/src/views/authority/resource/components/ResourceDialog.vue
similarity index 94%
rename from frontend/src/components/ResourceDialog/index.vue
rename to frontend/src/views/authority/resource/components/ResourceDialog.vue
index 0cdeb38..fcacc02 100644
--- a/frontend/src/components/ResourceDialog/index.vue
+++ b/frontend/src/views/authority/resource/components/ResourceDialog.vue
@@ -1,5 +1,5 @@
 <template>
-    <el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" width="500">
+    <el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogSmall">
       <el-form :model="formData" :rules="rules">
         <el-form-item label="菜单名称" prop="name">
           <el-input v-model="formData.name" />
@@ -33,9 +33,9 @@
     </el-dialog>
   </template>
   
-  <script lang="ts" setup>
+  <script lang="ts" setup name="ResourceDialog">
   import { defineProps, defineEmits, reactive,watch } from 'vue';
-  import { type Resource } from '@/api/resource/interface'
+  import { dialogSmall } from '@/utils/elementBind'
   const props = defineProps<{
     visible: boolean;
     dialogTitle: string;
diff --git a/frontend/src/views/authority/resource/index.vue b/frontend/src/views/authority/resource/index.vue
index 68395fb..496fffb 100644
--- a/frontend/src/views/authority/resource/index.vue
+++ b/frontend/src/views/authority/resource/index.vue
@@ -39,13 +39,12 @@
   import { defineComponent,ref ,reactive} from 'vue'
   import { type Resource } from '@/api/resource/interface'
   import ProTable from '@/components/ProTable/index.vue'
-  import ResourceDialog from '@/components/ResourceDialog/index.vue'; // 导入子组件
-  import {Operation, CirclePlus, Delete, EditPen, Download, Upload, View, Refresh} from '@element-plus/icons-vue'
+  import ResourceDialog from "@/views/authority/resource/components/ResourceDialog.vue"; // 导入子组件
+  import {CirclePlus, Delete, EditPen} from '@element-plus/icons-vue'
   import resourceDataList from '@/api/resource/resourceData'
-  import { useDictStore } from '@/stores/modules/dict'
   import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
-import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
-    let multipleSelection = ref<string[]>([]);
+  import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
+  let multipleSelection = ref<string[]>([]);
   const resourceData = resourceDataList
   const dialogFormVisible = ref(false)
   const isEditMode = ref(false);
@@ -70,17 +69,18 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
     {
       prop: 'name',
       label: '名称',
-      width: 120,
+      width: 150,
       search: { el: 'input', tooltip: '我是搜索提示' },
     },
     {
       prop: 'path',
       label: '路径',
-      width: 180,
+      width: 300,
     },
     {
       prop: 'sort',
       label: '排序',
+      width: 100,
       search: {
       // 自定义 search 显示内容
       render: ({ searchParam }) => {
@@ -90,6 +90,7 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
             <span class='mr10 ml10'>-</span>
             <el-input vModel_trim={searchParam.maxAge} placeholder='最大排序' />
           </div>
+         
         )
       },
     },
@@ -97,13 +98,31 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
     {
       prop: 'type',
       label: '资源类型',
+      width: 150,
       // 字典数据（本地数据）
       //enum: dictStore.getDictData('type'),
-      search: { el: 'select', props: { filterable: true } },
+      //search: { el: 'select', props: { filterable: true } },
       //fieldNames: { label: 'label', value: 'resourceType' },
+      search: {
+      // 自定义 search 显示内容
+      render: ({ searchParam }) => {
+        return (
+          <div class='flx-center'>
+            <el-select >
+              <el-option ></el-option>
+              <el-option label="未检测"></el-option>
+              <el-option label="检测中"></el-option>
+              <el-option label="检测完成"></el-option>
+            </el-select>
+          </div>
+         
+        )
+      },
+    },
     },
     {
       prop: 'route_Name',
+      width: 200,
       label: '路由名称',
       search: { el: 'input' },
     },
@@ -121,11 +140,7 @@ import { ElMessage, ElMessageBox, inputEmits } from 'element-plus';
       prop: 'update_Time',
       label: '更新时间',
       width: 180,
-      search: {
-      el: 'date-picker',
-      span: 1,
-      props: { type: 'daterange', valueFormat: 'YYYY-MM-DD'},
-      defaultValue: ['2024-11-12', '2024-12-12'],}
+      
     },
     { prop: 'operation', label: '操作', fixed: 'right', width: 200 },
   ])
@@ -166,7 +181,7 @@ const submitForm = () => {
 const openEditDialog = (resource: Resource.ResResourceList) => {
   dialogForm.value = { ...resource }; // 复制资源数据以便编辑
   isEditMode.value = true; // 设置为编辑模式
-  dialogTitle.value = '编辑资源';
+  dialogTitle.value = '编辑菜单';
   dialogFormVisible.value = true; // 显示对话框
 };
  //选中
diff --git a/frontend/src/views/log/index.vue b/frontend/src/views/log/index.vue
index 5451de2..43a659c 100644
--- a/frontend/src/views/log/index.vue
+++ b/frontend/src/views/log/index.vue
@@ -9,6 +9,7 @@
     >
       <!-- 表格 header 按钮 -->
       <template #tableHeader>
+        <el-button type='primary' :icon='DataAnalysis'>分析</el-button>
         <el-button type='primary' :icon='Upload'>导出csv</el-button>
       </template>
     </ProTable>
@@ -20,13 +21,15 @@
 import TimeControl from '@/components/TimeControl/index.vue'
 import { type Log } from '@/api/log/interface'
 import ProTable from '@/components/ProTable/index.vue'
-import { Upload } from '@element-plus/icons-vue'
+import { Upload ,DataAnalysis} from '@element-plus/icons-vue'
 import logDataList from '@/api/log/logData'
 import type { ColumnProps, ProTableInstance } from '@/components/ProTable/interface'
-
+import { reactive,ref } from 'vue'
 let multipleSelection = ref<string[]>([])
 const logData = logDataList
-
+// 定义包含和排除的单位
+const includedUnits = ['日', '周', '月', '季度']; // 可以根据需要包含的单位
+const excludedUnits = ['年']; // 要排除的单位
 // ProTable 实例
 const proTable = ref<ProTableInstance>()
 // 表格配置项
@@ -67,7 +70,7 @@ const columns = reactive<ColumnProps<Log.LogList>[]>([
       render: ({ searchParam }) => {
         return (
           <div class='flx-flex-start'>
-            <TimeControl />
+            <TimeControl/>
           </div>
         )
       },
@@ -81,6 +84,8 @@ const handleSelectionChange = (selection: Log.LogList[]) => {
   multipleSelection.value = selection.map(row => row.id) // 更新选中的行
 
 }
+
+
 </script>
 
 <style scoped>
diff --git a/frontend/src/views/machine/errorSystem/components/Error standardDialog.vue b/frontend/src/views/machine/errorSystem/components/Error standardDialog.vue
new file mode 100644
index 0000000..f49b6aa
--- /dev/null
+++ b/frontend/src/views/machine/errorSystem/components/Error standardDialog.vue	
@@ -0,0 +1,91 @@
+<template >
+    <el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogSmall" >
+        <el-form-item label="指标类型" prop="type">
+            <el-select
+                class='select'
+                placeholder='选择时间单位'
+            >
+            <!-- 采用 v-for 动态渲染 -->
+            <el-option
+                v-for="unit in typeList"
+                :key="unit.value"
+                :label="unit.label"
+                :value="unit.value"
+            ></el-option>
+            </el-select>                         
+        </el-form-item>
+        <template #footer>
+            <div class="dialog-footer">
+                <el-button @click="handleCancel">取 消</el-button>
+                <el-button type="primary" @click="handleSubmit">新增</el-button>
+            </div>
+        </template>
+    </el-dialog>
+</template>
+  
+  <script lang="ts" setup name="IndicatorTypeDialog">
+  import { defineProps, defineEmits, reactive,watch } from 'vue';
+  import { dialogSmall} from '@/utils/elementBind'
+  const props = defineProps<{
+    visible: boolean;
+    dialogTitle: string;
+    
+    formData: {
+      
+      id:string;
+      name: string;
+      path: string;
+      sort: number;
+      type: string;
+      remark: string;
+      route_Name: string;
+    };
+  }>();
+  
+  const typeList = [
+      { label: '电压', value: '电压' },
+      { label: '频率', value: '频率' },
+      { label: '电压三相不平衡度', value: '电压三相不平衡度' },
+      { label: '电流三相不平衡度', value: '电流三相不平衡度' },
+      { label: '电压波动', value: '电压波动' },
+      { label: '短时闪变', value: '短时闪变' },
+      { label: '谐波电压', value: '谐波电压' },
+      { label: '谐波电流', value: '谐波电流' },
+      { label: '谐波相角', value: '谐波相角' },
+      { label: '谐波功率', value: '谐波功率' },
+      { label: '间谐波电压', value: '间谐波电压' },
+      { label: '间谐波电流', value: '间谐波电流' },
+      { label: '功率', value: '功率' },
+      { label: '电流', value: '电流' },
+      { label: '暂态电压幅值', value: '暂态电压幅值' },
+      { label: '暂态持续时间', value: '暂态持续时间' },
+    ];
+
+  const rules = {
+          name :[
+            {require:true,trigger:"blur",message:"请填写菜单名称"}
+          ]
+  }
+  const emit = defineEmits<{
+    (e: 'update:visible', value: boolean): void;
+    (e: 'submit', data: any): void;
+  }>();
+  
+  const handleCancel = () => {
+    emit('update:visible', false); // 关闭对话框
+  };
+  
+  const handleSubmit = () => {
+    emit('submit', props.formData); // 提交表单数据
+    emit('update:visible', false); // 提交后关闭对话框
+  };
+  
+  // 当 props.visible 改变时，更新 formData
+  watch(() => props.visible, (newVal) => {
+    if (!newVal) {
+      // 这里可以重置表单数据，如果需要的话
+     
+    }
+  });
+  </script>
+  
diff --git a/frontend/src/views/machine/errorSystem/components/ErrorSystemDialog.vue b/frontend/src/views/machine/errorSystem/components/ErrorSystemDialog.vue
new file mode 100644
index 0000000..ab38012
--- /dev/null
+++ b/frontend/src/views/machine/errorSystem/components/ErrorSystemDialog.vue
@@ -0,0 +1,294 @@
+<template>
+    <el-dialog  :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogBig">
+        <el-tabs type="border-card">
+            <el-tab-pane label="基础信息">
+                <div class="form-grid">
+                    <el-form :model="formData" >
+                        <el-row  :gutter="20" >
+                            <el-col :span="10">
+                                <el-form-item label="误差体系名称" prop="name">
+                                    <el-input placeholder="标准号+年份+设备等级"/>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="发布时间" prop="publishTime">
+                                    <el-input  />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="6">
+                                <el-form-item label="上传误差体系截图" prop="screenshot">
+                                    <el-button :icon="FolderOpened" type="primary"></el-button>
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                        <el-row  :gutter="20" >
+                            <el-col :span="10">
+                                <el-form-item label="适用设备等级" prop="type">
+                                    <el-select  placeholder="请选择设备等级">
+                                        <el-option label="A级" value="A级" />
+                                        <el-option label="S级" value="S级" />
+                                    </el-select>
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="8">
+                                <el-form-item label="实施时间" prop="publishTime">
+                                    <el-input  />
+                                </el-form-item>
+                            </el-col>
+                            <el-col :span="6">
+                                <el-form-item label="状态" prop="type">
+                                    <el-select  placeholder="请选择状态">
+                                        <el-option label="启用" value="启用" />
+                                        <el-option label="停用" value="停用" />
+                                    </el-select>
+                                </el-form-item>
+                            </el-col>
+                        </el-row>
+                    </el-form>
+                </div>
+            </el-tab-pane>
+        </el-tabs>
+        <div class="dialog-footer">
+                <el-button :icon='CirclePlus' type="primary" @click="openAddDialog">新增</el-button>
+                <el-button :icon='Delete' type="danger" >批量删除</el-button>
+        </div>
+
+        <el-table :data="tableData" style="width: 100%;text-align: center" >
+                <el-table-column type="selection" width="55" />
+                <el-table-column prop="id" label="序号" width="60" />
+                <el-table-column prop="type" label="电能质量检测指标类型" width="200"/>
+                <el-table-column label="起止范围">
+                    <el-table-column label="起始">
+                        <template #default="{ row }">
+                            <el-row type="flex" align="middle">
+                                <el-col :span="16">
+                                    <el-select v-model="row.startSelect" placeholder="选择起始值" style="width: 70px;">
+                                        <el-option
+                                        v-for="option in errorStartOptions"
+                                        :key="option.value"
+                                        :label="option.label"
+                                        :value="option.value"
+                                        />
+                                    </el-select>
+                                </el-col>
+                                <el-col :span="8">
+                                    <span>{{ row.startRange }}</span>
+                                </el-col>
+                            </el-row>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="结束">
+                        <template #default="{ row }">
+                            <el-row type="flex" align="middle">
+                                <el-col :span="16">
+                                    <el-select v-model="row.endSelect" placeholder="选择结束值" style="width: 70px;">
+                                        <el-option
+                                        v-for="option in errorEndOptions"
+                                        :key="option.value"
+                                        :label="option.label"
+                                        :value="option.value"
+                                        />
+                                    </el-select>
+                                </el-col>
+                                <el-col :span="8">
+                                    <span>{{ row.endRange }}</span>
+                                </el-col>
+                            </el-row>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="单位" width="120">
+                        <template #default="{ row }">
+                        <el-select v-model="row.unit" placeholder="选择单位">
+                            <el-option
+                            v-for="option in errorUnitOptions"
+                            :key="option.value"
+                            :label="option.label"
+                            :value="option.value"
+                            />
+                        </el-select>
+                        </template>
+                    </el-table-column>
+                </el-table-column>
+                <el-table-column  label="最大误差">
+                    <el-table-column prop="maxErrorValue" label="最大误差值" width="100"/>
+                    <el-table-column label="误差类型">
+                        <template #default="{ row }">
+                        <el-select v-model="row.errorType" placeholder="选择误差类型">
+                            <el-option
+                            v-for="option in errorTypeOptions"
+                            :key="option.value"
+                            :label="option.label"
+                            :value="option.value"
+                            />
+                        </el-select>
+                        </template>
+                    </el-table-column>
+                </el-table-column>
+                <el-table-column label="操作" width="150">
+                <template #default>
+                    <el-button type="primary" link :icon='CopyDocument'>复制</el-button>
+                    <el-button  type='primary' link :icon='Delete' >删除</el-button>
+                </template>
+                </el-table-column>
+        </el-table>
+        <template #footer>
+            <div class="dialog-footer">
+                <el-button @click="handleCancel">取 消</el-button>
+                <el-button type="primary" @click="handleSubmit">保存</el-button>
+            </div>
+        </template>
+    </el-dialog>
+
+     <!-- 新增/编辑资源对话框 -->
+     <IndicatorTypeDialog
+      :visible="dialogFormVisible"
+      :formData="dialogForm"
+       :dialogTitle="dialogTitle"
+      @update:visible="dialogFormVisible = $event"
+    />
+</template>
+  
+  <script lang="ts" setup name="ErrorSystemDialog">
+  import { defineProps, defineEmits, reactive,watch,ref } from 'vue';
+  import { dialogBig,dialogMiddle} from '@/utils/elementBind'
+  import IndicatorTypeDialog from "@/views/machine/errorSystem/components/IndicatorTypeDialog.vue"; // 导入子组件
+  import {CirclePlus, Delete, EditPen,FolderOpened,CopyDocument} from '@element-plus/icons-vue'
+  const props = defineProps<{
+    visible: boolean;
+    dialogTitle: string;
+    
+    formData: {
+      
+      id:string;
+      name: string;
+      path: string;
+      sort: number;
+      type: string;
+      remark: string;
+      route_Name: string;
+    };
+  }>();
+  const dialogFormVisible = ref(false)
+  const dialogTitle = ref('新增检测指标误差项')
+  const errorTypeOptions = [
+  { label: '绝对值-标称值', value: 'type1' },
+  { label: '相对值-I类', value: 'type2' },
+  { label: '相对值-II类', value: 'type3' },
+  { label: '绝对值-值类型', value: 'type4' },
+];
+
+const errorUnitOptions = [
+  { label: '标称值', value: 'type1' },
+  { label: '值', value: 'type2' },
+  { label: '无', value: 'type3' },
+];
+
+const errorStartOptions = [
+  { label: '>', value: 'type1' },
+  { label: '>=', value: 'type2' },
+  { label: '无', value: 'type3' },
+];
+
+const errorEndOptions = [
+  { label: '<', value: 'type1' },
+  { label: '<=', value: 'type2' },
+  { label: '无', value: 'type3' },
+];
+
+
+  const tableData = [
+  {
+    id: '1',
+    type: '电压',
+    startSelect: 'type1',
+    startRange: '0.1',
+    endSelect: 'type2',
+    endRange: '1.5',
+    unit:'type1',
+    maxErrorValue:'0.001',
+    errorType:'type1'
+  },
+  {
+    id: '2',
+    type: '电流',
+    startSelect: 'type2',
+    startRange: '0.01',
+    endSelect: 'type1',
+    endRange: '0.05',
+    unit:'type1',
+     maxErrorValue:'0.005',
+     errorType:'type1'
+  },
+  {
+    id: '3',
+    type: '频率',
+    startSelect: 'type2',
+    startRange: '42.5',
+    endSelect: 'type2',
+    endRange: '57.5',
+    unit:'type1',
+     maxErrorValue:'0.01',
+     errorType:'type4'
+  },
+
+  
+]
+
+  const rules = {
+          name :[
+            {require:true,trigger:"blur",message:"请填写菜单名称"}
+          ]
+  }
+  const emit = defineEmits<{
+    (e: 'update:visible', value: boolean): void;
+    (e: 'submit', data: any): void;
+  }>();
+  
+  const handleCancel = () => {
+    emit('update:visible', false); // 关闭对话框
+  };
+  
+  const handleSubmit = () => {
+    emit('submit', props.formData); // 提交表单数据
+    emit('update:visible', false); // 提交后关闭对话框
+  };
+  
+  // 当 props.visible 改变时，更新 formData
+  watch(() => props.visible, (newVal) => {
+    if (!newVal) {
+      // 这里可以重置表单数据，如果需要的话
+     
+    }
+  });
+
+  const openAddDialog = () => {
+  dialogFormVisible.value = true; // 打开对话框
+};
+  </script>
+  
+  <style scoped>
+.form-grid {
+    display: flex;
+    flex-direction: row; /* 横向排列 */
+    flex-wrap: wrap; /* 允许换行 */
+}
+.form-grid .el-form-item {
+    flex: 1 1 30%; /* 控件宽度 */
+    margin-right: 20px; /* 控件间距 */
+}
+.form-grid .el-form-item:last-child {
+    margin-right: 0; /* 最后一个控件不需要右边距 */
+}
+.dialog-footer {
+    display: flex;
+    justify-content: flex-end;
+    margin-bottom: 10px; /* 调整这里的值以增加或减少间距 */
+}
+.el-tabs {
+    margin-bottom: 20px; /* 添加底部边距 */
+}
+
+.el-table th, .el-table td {
+  text-align: center; /* 所有单元格文字居中 */
+}
+</style>
\ No newline at end of file
diff --git a/frontend/src/views/machine/errorSystem/components/IndicatorTypeDialog.vue b/frontend/src/views/machine/errorSystem/components/IndicatorTypeDialog.vue
new file mode 100644
index 0000000..f49b6aa
--- /dev/null
+++ b/frontend/src/views/machine/errorSystem/components/IndicatorTypeDialog.vue
@@ -0,0 +1,91 @@
+<template >
+    <el-dialog :title="dialogTitle" :model-value="visible" @close="handleCancel" v-bind="dialogSmall" >
+        <el-form-item label="指标类型" prop="type">
+            <el-select
+                class='select'
+                placeholder='选择时间单位'
+            >
+            <!-- 采用 v-for 动态渲染 -->
+            <el-option
+                v-for="unit in typeList"
+                :key="unit.value"
+                :label="unit.label"
+                :value="unit.value"
+            ></el-option>
+            </el-select>                         
+        </el-form-item>
+        <template #footer>
+            <div class="dialog-footer">
+                <el-button @click="handleCancel">取 消</el-button>
+                <el-button type="primary" @click="handleSubmit">新增</el-button>
+            </div>
+        </template>
+    </el-dialog>
+</template>
+  
+  <script lang="ts" setup name="IndicatorTypeDialog">
+  import { defineProps, defineEmits, reactive,watch } from 'vue';
+  import { dialogSmall} from '@/utils/elementBind'
+  const props = defineProps<{
+    visible: boolean;
+    dialogTitle: string;
+    
+    formData: {
+      
+      id:string;
+      name: string;
+      path: string;
+      sort: number;
+      type: string;
+      remark: string;
+      route_Name: string;
+    };
+  }>();
+  
+  const typeList = [
+      { label: '电压', value: '电压' },
+      { label: '频率', value: '频率' },
+      { label: '电压三相不平衡度', value: '电压三相不平衡度' },
+      { label: '电流三相不平衡度', value: '电流三相不平衡度' },
+      { label: '电压波动', value: '电压波动' },
+      { label: '短时闪变', value: '短时闪变' },
+      { label: '谐波电压', value: '谐波电压' },
+      { label: '谐波电流', value: '谐波电流' },
+      { label: '谐波相角', value: '谐波相角' },
+      { label: '谐波功率', value: '谐波功率' },
+      { label: '间谐波电压', value: '间谐波电压' },
+      { label: '间谐波电流', value: '间谐波电流' },
+      { label: '功率', value: '功率' },
+      { label: '电流', value: '电流' },
+      { label: '暂态电压幅值', value: '暂态电压幅值' },
+      { label: '暂态持续时间', value: '暂态持续时间' },
+    ];
+
+  const rules = {
+          name :[
+            {require:true,trigger:"blur",message:"请填写菜单名称"}
+          ]
+  }
+  const emit = defineEmits<{
+    (e: 'update:visible', value: boolean): void;
+    (e: 'submit', data: any): void;
+  }>();
+  
+  const handleCancel = () => {
+    emit('update:visible', false); // 关闭对话框
+  };
+  
+  const handleSubmit = () => {
+    emit('submit', props.formData); // 提交表单数据
+    emit('update:visible', false); // 提交后关闭对话框
+  };
+  
+  // 当 props.visible 改变时，更新 formData
+  watch(() => props.visible, (newVal) => {
+    if (!newVal) {
+      // 这里可以重置表单数据，如果需要的话
+     
+    }
+  });
+  </script>
+  
diff --git a/frontend/src/views/machine/errorSystem/index.vue b/frontend/src/views/machine/errorSystem/index.vue
new file mode 100644
index 0000000..f6f69ce
--- /dev/null
+++ b/frontend/src/views/machine/errorSystem/index.vue
@@ -0,0 +1,104 @@
+<template>
+   <div class='table-box'>
+    <ProTable
+      ref='proTable'
+      :columns='columns'
+      :data='errorData'
+      type='selection'
+    >
+      <!-- 表格 header 按钮 -->
+      <template #tableHeader>
+        <el-button type='primary' :icon='CirclePlus' @click="openAddDialog">新增误差体系</el-button>
+          <el-button type='danger' :icon='Delete' plain
+                     >
+            批量删除误差体系
+          </el-button>
+      </template>
+       <!-- 表格操作 -->
+       <template #operation='scope'>
+          <el-button type='primary' link :icon='View'  @row-click="handleRowClick">查看</el-button>
+          <el-button type='primary' link :icon='EditPen' @click="openEditDialog(scope.row)">编辑</el-button>
+          <el-button type='primary' link :icon='Delete' >删除</el-button>
+        </template>
+    </ProTable>
+
+            <!-- 新增/编辑资源对话框 -->
+            <ResourceDialog
+      :visible="dialogFormVisible"
+      :formData="dialogForm"
+       :dialogTitle="dialogTitle"
+      @update:visible="dialogFormVisible = $event"
+    />
+  </div>
+</template>
+
+<script setup lang="ts" name='useProTable'>
+import ProTable from '@/components/ProTable/index.vue'
+import type { ColumnProps } from '@/components/ProTable/interface'
+import { CirclePlus, Delete,EditPen,View} from '@element-plus/icons-vue'
+import errorDataList from '@/api/error/errorData'
+import { reactive,ref } from 'vue'
+import type { ErrorSystem } from '@/api/error/interface'
+import ResourceDialog from "@/views/machine/errorSystem/components/ErrorSystemDialog.vue"; // 导入子组件
+let multipleSelection = ref<string[]>([])
+const errorData = errorDataList
+const dialogFormVisible = ref(false)
+const dialogTitle = ref('新增误差体系')
+const dialogForm = ref<ErrorSystem.ErrorSystemList>({
+                              id: '',
+                              name: '',
+                              year:'',     
+                              level:'',          
+});
+
+// 表格配置项
+const columns = reactive<ColumnProps<ErrorSystem.ErrorSystemList>[]>([
+  { type: 'selection', fixed: 'left', width: 50 },
+  {
+    prop: 'id',
+    label: '序号',
+    width: 100,
+  },
+  {
+    prop: 'name',
+    label: '误差体系名称',
+    width: 300,
+  },
+  {
+    prop: 'year',
+    label: '标准实施年份',
+    search: { el: 'input' },
+  },
+
+  {
+    prop: 'level',
+    label: '适用设备等级',
+    search: { el: 'select', props: { filterable: true } },
+  },
+  { prop: 'operation', label: '操作', fixed: 'right' },
+])
+
+// 打开编辑对话框
+const openEditDialog = (resource: ErrorSystem.ErrorSystemList) => {
+ 
+};
+
+const openAddDialog = () => {
+  dialogForm.value = {
+    id: '',
+    name: '',
+    year: '',
+    level: '',
+  };
+  dialogFormVisible.value = true; // 打开对话框
+};
+
+
+const handleRowClick = (row: ErrorSystem.ErrorSystemList) =>{
+  
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file