1. 完成U控制图数据维护页面

2. 完成U控制图Excel数据文件上传、模版下载
3. 完成U控制图页面与接口调试
4. 完成I-MR控制图数据维护页面
5. 完成I-MR控制图Excel数据文件上传、模版下载
6. 完成I-MR控制图页面与接口调试
7. 完成EWMA控制图数据维护页面
8. 完成EWMA控制图Excel数据文件上传、模版下载
9. 完成EWMA控制图页面与接口调试
10. 优化SPC控制图页面
11. 预警功能开发
12. XbarR、XbarS数据模版下载
13. XbarR、XbarS控制图优化

src/api/analysis/index.js

@@ -1,6 +1,13 @@
 import request from "@/utils/request";
 import axios from "axios";
 
+export function cpkCompute(params) {
+  return request({
+    url: "/api/v1/spc/cpkCompute",
+    method: "post",
+    params: params,
+  });
+}
 export function deleteQualityFile(data) {
   return request({
     url: "/api/v1/quality/file/del",
@@ -22,6 +29,13 @@ export function EWMACompute(data) {
     data,
   });
 }
+export function EWMACompute2(params) {
+  return request({
+    url: "/api/v1/spc/EWMACompute2",
+    method: "get",
+    params: params,
+  });
+}
 export function IMRCompute(data) {
   return request({
     url: "/api/v1/spc/IMRCompute",
@@ -29,6 +43,13 @@ export function IMRCompute(data) {
     data,
   });
 }
+export function IMRCompute2(params) {
+  return request({
+    url: "/api/v1/spc/IMRCompute2",
+    method: "get",
+    params: params,
+  });
+}
 export function UCompute(data) {
   return request({
     url: "/api/v1/spc/UCompute",
@@ -104,7 +125,7 @@ export function XBarRCompute(data) {
 
 export function getData(data) {
   return request({
-    url: "/api/v1/spc/page1",
+    url: "/api/v1/spc/page",
     method: "post",
     data,
   });

src/router/modules/analysis.ts

@@ -57,23 +57,14 @@ export default {
         },
       ],
     },
-    {
-      path: "sales",
-      component: () => import("@/views/sales/index.vue"),
-      name: "Sales",
-      meta: {
-        title: "销售反馈",
-        icon: "Guide",
-      },
-    },
-    {
-      path: "charts",
-      component: () => import("@/views/charts/index.vue"),
-      name: "Charts",
-      meta: {
-        title: "图表分析",
-        icon: "Guide",
-      },
-    },
+    // {
+    //   path: "charts",
+    //   component: () => import("@/views/charts/index.vue"),
+    //   name: "Charts",
+    //   meta: {
+    //     title: "图表分析",
+    //     icon: "Guide",
+    //   },
+    // },
   ],
 };

src/router/modules/statistic.ts

@@ -28,5 +28,14 @@ export default {
         icon: "CreditCard",
       },
     },
+    {
+      path: "sales",
+      component: () => import("@/views/sales/index.vue"),
+      name: "Sales",
+      meta: {
+        title: "销售反馈",
+        icon: "Guide",
+      },
+    },
   ],
 };

src/views/analysis/process/C.vue

@@ -52,6 +52,9 @@ const getTableData = async (data) => {
     return parseFloat(num.y.toFixed(4));
   });
   chartData.value = data;
+
+  chartsOption1.value.title[0].text = `C控制图`;
+  setChart1();
 };
 
 const { dicts } = useDictionaryStore();
@@ -127,8 +130,6 @@ const changeSelect = () => {
     //     break;
     // }
     // await getTableData();
-    chartsOption1.value.title[0].text = `C控制图`;
-    setChart1();
     // setChart2();
   }, 0);
 };
@@ -249,21 +250,18 @@ const setView = () => {
 onMounted(() => {
   // init();
 });
-const init = (data) => {
-  if (data) {
-    tableData.value = data;
+const init = async (data) => {
+  tableData.value = data;
 
-    setHeight();
+  setHeight();
 
-    nextTick(async () => {
-      await getTableData(data);
-      await changeSelect();
-      charts1.value = echarts.init(document.getElementById("charts"));
-      charts1.value.setOption(chartsOption1.value, true);
-      window.addEventListener("resize", setView);
-    });
+  if (data) {
+    charts1.value = echarts.init(document.getElementById("charts"));
+    window.addEventListener("resize", setView);
+    await getTableData(data);
+    // changeSelect();
+    charts1.value.setOption(chartsOption1.value, true);
   }
-
 };
 onBeforeUnmount(() => {
   window.removeEventListener("resize", setView);

src/views/analysis/process/EWMA.vue

@@ -45,9 +45,7 @@ const param = {
   ProcessA: [50.1, 50.3, 49.8],
 };
 
-const getTableData = async () => {
-  var resultData = await EWMACompute(param);
-
+const getTableData = (resultData) => {
   // 转换函数
   const transformData = (data) => {
     const result = [];
@@ -72,10 +70,9 @@ const getTableData = async () => {
   };
 
   // 转换后的数据
-  const formattedData = ref(transformData(resultData.data));
+  const formattedData = ref(transformData(resultData));
 
   chartData.value = formattedData.value;
-
 };
 
 const chartRef = ref(null);
@@ -192,55 +189,57 @@ onMounted(() => {
   window.addEventListener("resize", resizeChart);
 });
 
-watch(chartData, () => {
-  if (chartInstance.value) {
-    const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
-      prepareData();
-    const option = {
-      title: [
-        {
-          text: `EWMA控制图`,
-          left: "40%",
-        },
-      ],
-      xAxis: {
-        data: sampleIds,
-      },
-      series: [
-        {
-          data: values.map((value, index) => ({
-            value,
-            itemStyle: {
-              color:
-                value > uclValues[index] || value < lclValues[index]
-                  ? "red"
-                  : "blue",
-            },
-          })),
-        },
-        {
-          data: ewmaValues,
-        },
-        {
-          data: uclValues,
-        },
-        {
-          data: lclValues,
-        },
-        {
-          data: Array(sampleIds.length).fill(meanValue),
-        },
-      ],
-    };
-    chartInstance.value.setOption(option);
-  }
-});
+// watch(chartData, () => {
+//   if (chartInstance.value) {
+//     const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
+//       prepareData();
+//     const option = {
+//       title: [
+//         {
+//           text: `EWMA控制图`,
+//           left: "40%",
+//         },
+//       ],
+//       xAxis: {
+//         data: sampleIds,
+//       },
+//       series: [
+//         {
+//           data: values.map((value, index) => ({
+//             value,
+//             itemStyle: {
+//               color:
+//                 value > uclValues[index] || value < lclValues[index]
+//                   ? "red"
+//                   : "blue",
+//             },
+//           })),
+//         },
+//         {
+//           data: ewmaValues,
+//         },
+//         {
+//           data: uclValues,
+//         },
+//         {
+//           data: lclValues,
+//         },
+//         {
+//           data: Array(sampleIds.length).fill(meanValue),
+//         },
+//       ],
+//     };
+//     chartInstance.value.setOption(option);
+//   }
+// });
 
-const init = () => {
-  nextTick(async () => {
-    await getTableData();
-    await initChart(chartRef.value);
-  });
+const init = (data) => {
+  if (data) {
+    nextTick(async () => {
+      await getTableData(data);
+      await initChart(chartRef.value);
+    });
+  }
 };
 
 // 暴露 init 方法

src/views/analysis/process/XbarList.vue

@@ -4,10 +4,10 @@
       <el-scrollbar :style="{ height: Height + 'px' }">
         <div class="box">
           <div class="title">
-            <div style="display: flex; align-items: center">
-              <div class="bg"></div>
-              样本数据录入
-            </div>
+            <!--            <div style="display: flex; align-items: center">-->
+            <!--              <div class="bg"></div>-->
+            <!--              样本数据录入-->
+            <!--            </div>-->
             <div class="header" v-show="!addStatus && !editStatus">
               <Search
                 :searchOptions="searchForm"
@@ -18,7 +18,6 @@
             </div>
             <div class="btns">
               <el-upload
-                v-if="!addStatus && !editStatus"
                 style="float: left"
                 :action="uploadUrl"
                 :on-success="handleSuccess"
@@ -28,33 +27,20 @@
                 :show-file-list="false"
                 ref="uploadRef"
               >
-                <el-button size="small" type="primary">Excel导入</el-button>
+                <el-button size="small" type="primary">文件上传</el-button>
               </el-upload>
               <el-button
                 style="margin-left: 15px"
-                v-if="!addStatus && !editStatus"
                 type="primary"
                 size="small"
                 class="btn"
-                @click="changeaddstatus"
-                >新增</el-button
-              >
-
-              <el-button
-                v-if="editStatus || addStatus"
-                type="success"
-                size="small"
-                class="btn"
-                @click="submit"
-                >确定</el-button
-              >
-              <el-button
-                v-if="editStatus || addStatus"
-                type="info"
-                size="small"
-                class="btn"
-                @click="canceleOp"
-                >取消</el-button
+                @click="
+                  exportData(
+                    '/api/v1/spc/downloadTemplate',
+                    '/spc/template/EWMA控制图数据导入模版.xlsx'
+                  )
+                "
+                >模版下载</el-button
               >
             </div>
           </div>
@@ -70,101 +56,21 @@
             >
               <el-table-column
                 align="center"
-                width="100"
-                prop="dateStr"
+                prop="created"
                 sortable
                 label="日期"
               >
                 <template #default="{ row }"
-                  ><span>{{ row.dateStr }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column
-                align="center"
-                width="100"
-                prop="model"
-                label="产品型号"
-              >
-                <template #default="{ row }"
-                  ><span>{{ row.model }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column
-                align="center"
-                width="100"
-                prop="batchNo"
-                label="生产批号"
-              >
-                <template #default="{ row }"
-                  ><span>{{ row.batchNo }}</span>
+                  ><span>{{ formatDate(row.created) }}</span>
                 </template>
               </el-table-column>
-              <el-table-column
-                width="100"
-                align="center"
-                prop="accuracys"
-                label="数据"
-                :show-overflow-tooltip="false"
-              >
-                <template #default="{ row }">
-                  <el-tooltip placement="top">
-                    <template #content>
-                      <div v-for="(item, index) in row.accuracys" :key="index">
-                        <span>数值{{ index + 1 }}: {{ item }}</span>
-                      </div>
-                    </template>
-                    <div class="ellipsis-text">
-                      {{ row.accuracys.join(", ") }}
-                    </div>
-                  </el-tooltip>
-                </template>
-              </el-table-column>
-              <el-table-column
-                align="center"
-                prop="avg"
-                label="平均值"
-                width="60"
-              /><el-table-column
-                align="center"
-                prop="range"
-                label="极差"
-                width="60"
-              /><el-table-column
-                align="center"
-                width="80"
-                prop="checkUser"
-                label="检测人"
-              >
+              <el-table-column align="center" prop="fileName" label="文件名称">
                 <template #default="{ row }"
-                  ><span>{{ row.checkUser }}</span>
-                </template> </el-table-column
-              ><el-table-column
-                align="center"
-                prop="checkDeviceNo"
-                label="检查设备编号"
-              >
-                <template #default="{ row }"
-                  ><span>{{ row.checkDeviceNo }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column
-                align="center"
-                prop="abnormal"
-                width="60"
-                label="是否异常"
-              >
-                <template #default="{ row }"
-                  ><span>{{ row.abnormal }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column align="center" prop="analyseUser" label="分析人">
-                <template #default="{ row }"
-                  ><span>{{ row.analyseUser }}</span>
-                </template>
-              </el-table-column>
-              <el-table-column align="center" prop="measure" label="处置措施">
-                <template #default="{ row }"
-                  ><span>{{ row.measure }}</span>
+                  ><a
+                    class="blue-underline"
+                    :href="downloadUrl + row.filePath"
+                    >{{ row.fileName }}</a
+                  >
                 </template>
               </el-table-column>
               <el-table-column align="center" width="160" prop="" label="操作">
@@ -173,9 +79,9 @@
                     type="primary"
                     size="small"
                     class="btn"
-                    @click="updataItem(row)"
+                    @click="compute(row.filePath)"
                     style="height: 25px"
-                    >修改</el-button
+                    >计算</el-button
                   >
                   <el-button
                     type="info"
@@ -197,89 +103,6 @@
               @pagination="getTableData"
             />
           </div>
-          <div class="info" v-else>
-            <el-form
-              ref="ruleFormRef"
-              :model="addData"
-              :rules="rules"
-              label-width="auto"
-              class="formStyle"
-            >
-              <el-form-item label="日期" prop="dateStr">
-                <el-date-picker
-                  v-model="addData.dateStr"
-                  type="date"
-                  aria-label="Pick a date"
-                  placeholder="Pick a date"
-                  style="width: 100%"
-                  format="YYYY-MM-DD"
-                  value-format="YYYY-MM-DD"
-                />
-              </el-form-item>
-              <el-form-item label="任务编号" prop="qualityTaskId">
-                <el-select
-                  v-model="addData.qualityTaskId"
-                  @change="
-                    (value) => {
-                      taskChange(value);
-                    }
-                  "
-                >
-                  <el-option
-                    v-for="(item, index) in taskOption"
-                    :key="index"
-                    :label="item.taskCode"
-                    :value="item.id"
-                  />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="产品型号" prop="model">
-                <el-input :disabled="true" v-model="addData.model" />
-              </el-form-item>
-              <el-form-item label="生产批号" prop="batchNo">
-                <el-input v-model="addData.batchNo" />
-              </el-form-item>
-              <el-form-item
-                v-for="(item, index) in addData.accuracys"
-                :label="'数值' + (index + 1)"
-                :key="index"
-                :rules="[
-                  {
-                    required: true,
-                    trigger: 'change',
-                  },
-                ]"
-              >
-                <el-input-number
-                  :precision="2"
-                  :step="0.01"
-                  style="width: 100%"
-                  v-model="addData.accuracys[index]"
-                />
-              </el-form-item>
-              <!-- <el-form-item label="平均值" prop="avg">
-                <el-input v-model="addData.avg" />
-              </el-form-item>
-              <el-form-item label="极差" prop="range">
-                <el-input v-model="addData.range" />
-              </el-form-item> -->
-              <el-form-item label="检测人" prop="checkUser">
-                <el-input v-model="addData.checkUser" />
-              </el-form-item>
-              <el-form-item label="检查设备编号" prop="checkDeviceNo">
-                <el-input v-model="addData.checkDeviceNo" />
-              </el-form-item>
-              <!-- <el-form-item label="是否异常" prop="abnormal">
-                <el-input v-model="addData.abnormal" />
-              </el-form-item> -->
-              <el-form-item label="分析人" prop="analyseUser">
-                <el-input v-model="addData.analyseUser" />
-              </el-form-item>
-              <el-form-item label="处置措施" prop="measure">
-                <el-input v-model="addData.measure" />
-              </el-form-item>
-            </el-form>
-          </div>
         </div>
       </el-scrollbar>
     </div>
@@ -291,71 +114,38 @@ import { ref } from "vue";
 import * as echarts from "echarts";
 import { useDictionaryStore } from "@/store";
 import {
+  getQualityFileList,
   getData,
   addDatas,
-  deleteData,
+  deleteQualityFile,
   updateData,
   getTaskCode,
+  EWMACompute2,
 } from "@/api/analysis";
 import Search from "@/components/Search/index.vue";
+import { uploadFileApi } from "@/api/file";
+import { useCrud } from "@/hooks/userCrud";
 
-const xbarRRef = ref("xbarRRef");
-const xbarRRefMethod = async () => {
-  await nextTick();
-  if (xbarRRef.value) {
-    xbarRRef.value.init(tableData.value);
-  }
-};
+const { Utils } = useCrud({
+  src: "/api/v1/spc/pDownloadTemplate",
+});
+const { exportData } = Utils;
 
-const xbarSRef = ref("xbarSRef");
-const xbarSRefMethod = async () => {
-  await nextTick();
-  if (xbarSRef.value) {
-    xbarSRef.value.init(tableData.value);
-  }
-};
-const pRef = ref("pRef");
-const pRefMethod = async () => {
-  await nextTick();
-  if (pRef.value) {
-    pRef.value.init();
-  }
-};
-const npRef = ref("npRef");
-const npRefMethod = async () => {
-  await nextTick();
-  if (npRef.value) {
-    npRef.value.init();
-  }
-};
-const cRef = ref("cRef");
-const cRefMethod = async () => {
-  await nextTick();
-  if (cRef.value) {
-    cRef.value.init();
-  }
-};
-const uRef = ref("uRef");
-const uRefMethod = async () => {
-  await nextTick();
-  if (uRef.value) {
-    uRef.value.init();
-  }
-};
-const iMRRef = ref("iMRRef");
-const imrRefMethod = async () => {
-  await nextTick();
-  if (iMRRef.value) {
-    iMRRef.value.init();
-  }
-};
-const eWMARef = ref("EWMA");
-const eWMARefMethod = async () => {
-  await nextTick();
-  if (eWMARef.value) {
-    eWMARef.value.init();
-  }
+// 定义 props
+const props = defineProps({
+  chart: {
+    type: String, // 类型为字符串
+    required: true, // 必传
+  },
+});
+const formatDate = (dateString) => {
+  const date = new Date(dateString);
+  const year = date.getFullYear();
+  const month = String(date.getMonth() + 1).padStart(2, "0"); // 月份从0开始，所以需要+1
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
 };
+
 const year = ref("0");
 const currentOption = reactive({
   total: 0,
@@ -371,18 +161,17 @@ const getTaskOption = async () => {
   });
   taskOption.value = data;
 };
-const emit = defineEmits(["tableData"]);
 const getTableData = async () => {
-  const { data, code, msg } = await getData({
+  const { data, code, msg } = await getQualityFileList({
     ...searchRef.value.searchForm,
     pageNo: currentOption.page,
     pageSize: currentOption.limit,
     // yearStr: year.value,
-    operation: lableValue.value,
+    chart: props.chart,
   });
   if (code == "200") {
     tableData.value = data.records;
-    showData.value = { ...data, list: null };
+    showData.value = { ...data.records, list: null };
     // if (tableData.value.length > 0) {
     //   setChart1();
     //   setChart2();
@@ -390,8 +179,6 @@ const getTableData = async () => {
     currentOption.total = data.totalCount;
     currentOption.page = data.pageNo;
     oldDataJSON.value = JSON.stringify(data.records);
-
-    emit("tableData", tableData.value);
   }
   disabled.value = false;
 };
@@ -402,15 +189,10 @@ const searchForm = [
     type: "daterange",
   },
   {
-    label: "产品型号",
+    label: "文件名称",
     prop: "model",
     type: "input",
   },
-  {
-    label: "生产批号",
-    prop: "batchNo",
-    type: "input",
-  },
 ];
 //编辑状态
 const editStatus = ref(false);
@@ -733,30 +515,9 @@ const changeSelect = () => {
     //   item.range = 0;
     // });
     // setChart1();
-    changeSelect2();
+    // changeSelect2();
   }, 0);
 };
-const changeSelect2 = () => {
-  // if (value2.value === "Xbar-R") {
-  //   console.log("Xbar-R");
-  //   xbarRRefMethod();
-  // } else if (value2.value === "Xbar-S") {
-  //   console.log("Xbar-S");
-  //   xbarSRefMethod();
-  // } else if (value2.value === "P") {
-  //   pRefMethod();
-  // } else if (value2.value === "NP") {
-  //   npRefMethod();
-  // } else if (value2.value === "C") {
-  //   cRefMethod();
-  // } else if (value2.value === "U") {
-  //   uRefMethod();
-  // } else if (value2.value === "I-MR") {
-  //   imrRefMethod();
-  // } else if (value2.value === "EWMA") {
-  //   eWMARefMethod();
-  // }
-};
 
 // const searchData = computed(() =>
 //   tableData.value.filter((item) => item.data.includes(searchValue.value))
@@ -1088,7 +849,7 @@ const addSubmit = async () => {
   });
 };
 const deleteSubmit = async (id) => {
-  const { data, code } = await deleteData({
+  const { data, code } = await deleteQualityFile({
     id,
   });
   if (code == "200") {
@@ -1096,6 +857,14 @@ const deleteSubmit = async (id) => {
     getTableData();
   }
 };
+const emit = defineEmits(["tableData"]);
+const compute = async (filePath) => {
+  const { data, code } = await EWMACompute2({ filePath: filePath });
+
+  if (code === "200") {
+    emit("tableData", data);
+  }
+};
 const updateSubmit = async () => {
   const { data, code } = await updateData({
     ...addData.value,
@@ -1128,6 +897,8 @@ const setView = () => {
   charts2.value.setOption(chartsOption2.value, true);
 };
 
+const downloadUrl =
+  import.meta.env.VITE_APP_BASE_API + "/api/v1/spc/pDownloadExcel?filePath=";
 const uploadUrl = ref("");
 const beforeUpload = (file) => {
   const isExcel =
@@ -1149,7 +920,6 @@ const handleSuccess = (response) => {
     ElMessage.error("Excel导入失败！");
   }
 };
-
 onMounted(async () => {
   getTaskOption();
   setHeight();
@@ -1161,10 +931,11 @@ onMounted(async () => {
   });
 
   await getTableData();
+
   uploadUrl.value =
     import.meta.env.VITE_APP_BASE_API +
-    "/api/v1/spc/xBarRUpload?operation=" +
-    lableValue.value;
+    "/api/v1/spc/pUploadExcel?chart=" +
+    props.chart;
   // value2.value = "Xbar-R";
   // xbarRRefMethod();
 
@@ -1187,6 +958,15 @@ onBeforeUnmount(() => {
     margin-left: -18%;
   }
 }
+.blue-underline {
+  text-decoration: none;
+  color: black;
+}
+
+.blue-underline:hover {
+  text-decoration: underline;
+  color: blue;
+}
 .ellipsis-text {
   white-space: nowrap; /* 禁止换行 */
   overflow: hidden; /* 隐藏超出部分 */

src/views/analysis/process/I-MR.vue

@@ -58,8 +58,7 @@ const param = ref({
   dataList: [7, 10.02, 9, 8.04, 11, 9.23, 10.1, 10.07],
   subgroupSize: 2,
 });
-const getTableData = async () => {
-  const { data } = await IMRCompute(param.value);
+const getTableData = async (data) => {
   data.MR_CHART.LCL = data.MR_CHART.LCL.toFixed(4);
   data.MR_CHART.UCL = data.MR_CHART.UCL.toFixed(4);
   data.MR_CHART.CL = data.MR_CHART.CL.toFixed(4);
@@ -73,6 +72,10 @@ const getTableData = async () => {
     parseFloat(num.y.toFixed(4))
   );
   chartData.value = data;
+
+  chartsOption1.value.title[0].text = `I-MR控制图`;
+  setChart1();
+  setChart2();
 };
 
 const { dicts } = useDictionaryStore();
@@ -179,9 +182,7 @@ const changeSelect = () => {
     //     break;
     // }
     // await getTableData();
-    chartsOption1.value.title[0].text = `I-MR控制图`;
-    setChart1();
-    setChart2();
+
   }, 0);
 };
 
@@ -462,22 +463,22 @@ const setView = () => {
   charts2.value.setOption(chartsOption2.value, true);
 };
 onMounted(() => {
-  init();
+  // init();
 });
-const init = (data) => {
+const init = async (data) => {
   tableData.value = data;
 
   setHeight();
 
-  nextTick(async () => {
-    await getTableData();
-    await changeSelect();
+  if (data) {
     charts1.value = echarts.init(document.getElementById("charts"));
     charts2.value = echarts.init(document.getElementById("charts1"));
+    window.addEventListener("resize", setView);
+    await getTableData(data);
+    // changeSelect();
     charts1.value.setOption(chartsOption1.value, true);
     charts2.value.setOption(chartsOption2.value, true);
-  });
-  window.addEventListener("resize", setView);
+  }
 };
 onBeforeUnmount(() => {
   window.removeEventListener("resize", setView);

src/views/analysis/process/NP.vue

@@ -46,7 +46,6 @@ const param = ref({
   scale: 4,
 });
 const getTableData = async (data) => {
-  console.log(data, "data")
   data.cl = data.cl.toFixed(4);
   data.lcl = data.lcl.toFixed(4);
   data.ucl = data.ucl.toFixed(4);
@@ -54,6 +53,9 @@ const getTableData = async (data) => {
     return parseFloat(num.y.toFixed(4));
   });
   chartData.value = data;
+
+  chartsOption1.value.title[0].text = `NP控制图`;
+  setChart1();
 };
 
 const { dicts } = useDictionaryStore();
@@ -129,8 +131,6 @@ const changeSelect = () => {
     //     break;
     // }
     // await getTableData();
-    chartsOption1.value.title[0].text = `NP控制图`;
-    setChart1();
     // setChart2();
   }, 0);
 };
@@ -251,18 +251,18 @@ const setView = () => {
 onMounted(() => {
   // init();
 });
-const init = (data) => {
+const init = async (data) => {
   tableData.value = data;
 
   setHeight();
 
-  nextTick(async () => {
-    await getTableData(data);
-    await changeSelect();
+  if (data) {
     charts1.value = echarts.init(document.getElementById("charts"));
+    window.addEventListener("resize", setView);
+    await getTableData(data);
+    // changeSelect();
     charts1.value.setOption(chartsOption1.value, true);
-  });
-  window.addEventListener("resize", setView);
+  }
 };
 onBeforeUnmount(() => {
   window.removeEventListener("resize", setView);

src/views/analysis/process/P.vue

@@ -201,49 +201,49 @@ onMounted(() => {
   window.addEventListener("resize", resizeChart);
 });
 
-watch(chartData, () => {
-  if (chartInstance.value) {
-    const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
-      prepareData();
-    const option = {
-      title: [
-        {
-          text: `P控制图`,
-          left: "40%",
-        },
-      ],
-      xAxis: {
-        data: sampleIds,
-      },
-      series: [
-        {
-          data: values.map((value, index) => ({
-            value,
-            itemStyle: {
-              color:
-                value > uclValues[index] || value < lclValues[index]
-                  ? "red"
-                  : "blue",
-            },
-          })),
-        },
-        {
-          data: ewmaValues,
-        },
-        {
-          data: uclValues,
-        },
-        {
-          data: lclValues,
-        },
-        {
-          data: Array(sampleIds.length).fill(meanValue),
-        },
-      ],
-    };
-    chartInstance.value.setOption(option);
-  }
-});
+// watch(chartData, () => {
+//   if (chartInstance.value) {
+//     const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
+//       prepareData();
+//     const option = {
+//       title: [
+//         {
+//           text: `P控制图`,
+//           left: "40%",
+//         },
+//       ],
+//       xAxis: {
+//         data: sampleIds,
+//       },
+//       series: [
+//         {
+//           data: values.map((value, index) => ({
+//             value,
+//             itemStyle: {
+//               color:
+//                 value > uclValues[index] || value < lclValues[index]
+//                   ? "red"
+//                   : "blue",
+//             },
+//           })),
+//         },
+//         {
+//           data: ewmaValues,
+//         },
+//         {
+//           data: uclValues,
+//         },
+//         {
+//           data: lclValues,
+//         },
+//         {
+//           data: Array(sampleIds.length).fill(meanValue),
+//         },
+//       ],
+//     };
+//     chartInstance.value.setOption(option);
+//   }
+// });
 
 const init = (data) => {
   if (data) {

src/views/analysis/process/U.vue

@@ -52,10 +52,7 @@ const param = {
   },
 };
 
-const getTableData = async () => {
-  var resultData = await UCompute(param);
-  console.log(JSON.stringify(resultData), "resultDataList");
-
+const getTableData = async (resultData) => {
   // 转换函数
   const transformData = (data) => {
     const result = [];
@@ -80,12 +77,9 @@ const getTableData = async () => {
   };
 
   // 转换后的数据
-  const formattedData = ref(transformData(resultData.data));
+  const formattedData = ref(transformData(resultData));
 
-  console.log(JSON.stringify(formattedData), "formattedData");
   chartData.value = formattedData.value;
-
-  console.log(JSON.stringify(chartData.value), "chartData.value");
 };
 
 const chartRef = ref(null);
@@ -160,16 +154,6 @@ const initChart = (chartDom) => {
           color: "green",
         },
       },
-      // {
-      //   name: "均值",
-      //   type: "line",
-      //   data: Array(sampleIds.length).fill(meanValue),
-      //   showSymbol: false,
-      //   lineStyle: {
-      //     color: "green",
-      //     type: "solid",
-      //   },
-      // },
       {
         name: "UCL",
         type: "line",
@@ -208,55 +192,57 @@ onMounted(() => {
   window.addEventListener("resize", resizeChart);
 });
 
-watch(chartData, () => {
-  if (chartInstance.value) {
-    const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
-      prepareData();
-    const option = {
-      title: [
-        {
-          text: `U控制图`,
-          left: "40%",
-        },
-      ],
-      xAxis: {
-        data: sampleIds,
-      },
-      series: [
-        {
-          data: values.map((value, index) => ({
-            value,
-            itemStyle: {
-              color:
-                value > uclValues[index] || value < lclValues[index]
-                  ? "red"
-                  : "blue",
-            },
-          })),
-        },
-        {
-          data: ewmaValues,
-        },
-        {
-          data: uclValues,
-        },
-        {
-          data: lclValues,
-        },
-        {
-          data: Array(sampleIds.length).fill(meanValue),
-        },
-      ],
-    };
-    chartInstance.value.setOption(option);
-  }
-});
+// watch(chartData, () => {
+//   if (chartInstance.value) {
+//     const { sampleIds, values, ewmaValues, uclValues, lclValues, meanValue } =
+//       prepareData();
+//     const option = {
+//       title: [
+//         {
+//           text: `U控制图`,
+//           left: "40%",
+//         },
+//       ],
+//       xAxis: {
+//         data: sampleIds,
+//       },
+//       series: [
+//         {
+//           data: values.map((value, index) => ({
+//             value,
+//             itemStyle: {
+//               color:
+//                 value > uclValues[index] || value < lclValues[index]
+//                   ? "red"
+//                   : "blue",
+//             },
+//           })),
+//         },
+//         {
+//           data: ewmaValues,
+//         },
+//         {
+//           data: uclValues,
+//         },
+//         {
+//           data: lclValues,
+//         },
+//         {
+//           data: Array(sampleIds.length).fill(meanValue),
+//         },
+//       ],
+//     };
+//     chartInstance.value.setOption(option);
+//   }
+// });
 
-const init = () => {
-  nextTick(async () => {
-    await getTableData();
-    await initChart(chartRef.value);
-  });
+const init = (data) => {
+  if (data) {
+    nextTick(async () => {
+      await getTableData(data);
+      await initChart(chartRef.value);
+    });
+  }
 };
 
 // 暴露 init 方法

src/views/analysis/process/Xbar-R-2.vue

@@ -37,23 +37,10 @@
 <script setup>
 import * as echarts from "echarts";
 import { useDictionaryStore } from "@/store";
-import { XBarRCompute } from "@/api/analysis";
 
 const tableData = ref([]);
 const chartData = ref([]);
-const getTableData = async () => {
-  // 存储提取的 accuracys 数据
-  const accuracysList = ref([]);
-
-  // 提取 accuracys 数据
-  tableData.value.forEach((v) => {
-    accuracysList.value.push(v.accuracys);
-  });
-
-  const { data } = await XBarRCompute({
-    dataList: accuracysList.value,
-    scale: 4,
-  });
+const getTableData = async (data) => {
   data.lclX = data.lclX.toFixed(4);
   data.uclR = data.uclR.toFixed(4);
   data.rBar = data.rBar.toFixed(4);
@@ -67,6 +54,10 @@ const getTableData = async () => {
     parseFloat(num.toFixed(4))
   );
   chartData.value = data;
+
+  chartsOption1.value.title[0].text = `${title.value}的Xbar-R控制图`;
+  setChart1();
+  setChart2();
 };
 
 const { dicts } = useDictionaryStore();
@@ -144,7 +135,7 @@ const setChart2 = () => {
 const title = ref("调阻精度");
 const showLable = ref("调阻");
 const changeSelect = () => {
-  setTimeout(async () => {
+  setTimeout(() => {
     // showLable.value = selectRef.value.currentPlaceholder;
     // opOptions.value.forEach((item) => {
     //   if (item.dictLabel == showLable.value) {
@@ -439,26 +430,35 @@ const setView = () => {
   charts2.value.setOption(chartsOption2.value, true);
 };
 onMounted(() => {
-  // init();
+  init();
 });
-const init = (data) => {
+const init = async (data) => {
   tableData.value = data;
 
   setHeight();
 
-  nextTick(async () => {
-    if (tableData.value != undefined && tableData.value.length > 0) {
-      // return;
-      await getTableData();
-      await changeSelect();
-    }
-
+  if (data) {
     charts1.value = echarts.init(document.getElementById("charts"));
     charts2.value = echarts.init(document.getElementById("charts1"));
+    window.addEventListener("resize", setView);
+    await getTableData(data);
+    // changeSelect();
     charts1.value.setOption(chartsOption1.value, true);
     charts2.value.setOption(chartsOption2.value, true);
-  });
-  window.addEventListener("resize", setView);
+  }
+
+  // nextTick(() => {
+  //   if (tableData.value != undefined && tableData.value.length > 0) {
+  //     getTableData();
+  //     // changeSelect();
+  //   }
+  //
+  //   charts1.value = echarts.init(document.getElementById("charts"));
+  //   charts2.value = echarts.init(document.getElementById("charts1"));
+  //   charts1.value.setOption(chartsOption1.value, true);
+  //   charts2.value.setOption(chartsOption2.value, true);
+  // });
+  // window.addEventListener("resize", setView);
 };
 onBeforeUnmount(() => {
   window.removeEventListener("resize", setView);

src/views/analysis/process/Xbar-RList.vue

@@ -0,0 +1,781 @@
+<template>
+  <div class="container1">
+    <div class="databox">
+      <el-scrollbar :style="{ height: Height + 'px' }">
+        <div class="box">
+          <div class="title">
+            <div style="display: flex; align-items: center">
+              <div class="bg"></div>
+              样本数据录入
+            </div>
+            <div class="header" v-show="!addStatus && !editStatus">
+              <Search
+                :searchOptions="searchForm"
+                ref="searchRef"
+                @data-list="getTableData"
+                @reset-list="reset"
+              />
+            </div>
+            <div class="btns">
+              <el-upload
+                v-if="!addStatus && !editStatus"
+                style="float: left"
+                :action="uploadUrl"
+                :on-success="handleSuccess"
+                :before-upload="beforeUpload"
+                :limit="1"
+                accept=".xlsx, .xls"
+                :show-file-list="false"
+                ref="uploadRef"
+              >
+                <el-button size="small" type="primary">Excel导入</el-button>
+              </el-upload>
+              <el-button
+                v-if="!addStatus && !editStatus"
+                style="margin-left: 15px"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="
+                  exportData(
+                    '/api/v1/spc/downloadTemplate',
+                    '/spc/template/XBarR控制图数据导入模版.xlsx'
+                  )
+                "
+                >模版下载</el-button
+              >
+              <el-button
+                style="margin-left: 15px"
+                v-if="!addStatus && !editStatus"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="changeaddstatus"
+                >新增</el-button
+              >
+              <el-button
+                style="margin-left: 15px"
+                v-if="!addStatus && !editStatus"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="compute"
+                >计算</el-button
+              >
+
+              <el-button
+                v-if="editStatus || addStatus"
+                type="success"
+                size="small"
+                class="btn"
+                @click="submit"
+                >确定</el-button
+              >
+              <el-button
+                v-if="editStatus || addStatus"
+                type="info"
+                size="small"
+                class="btn"
+                @click="canceleOp"
+                >取消</el-button
+              >
+            </div>
+          </div>
+          <div class="info" v-if="!addStatus">
+            <el-table
+              :data="tableData"
+              border
+              :style="{
+                height: maxHeight - 150 + 'px',
+                width: maxWidth + 'px',
+              }"
+              :show-overflow-tooltip="true"
+              :row-class-name="tableRowClassName"
+            >
+              <el-table-column
+                align="center"
+                prop="dateStr"
+                sortable
+                label="日期"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.dateStr }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" prop="model" label="产品型号">
+                <template #default="{ row }"
+                  ><span>{{ row.model }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" prop="batchNo" label="生产批号">
+                <template #default="{ row }"
+                  ><span>{{ row.batchNo }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column
+                align="center"
+                prop="accuracys"
+                label="数据"
+                :show-overflow-tooltip="false"
+              >
+                <template #default="{ row }">
+                  <el-tooltip placement="top">
+                    <template #content>
+                      <div v-for="(item, index) in row.accuracys" :key="index">
+                        <span>数值{{ index + 1 }}: {{ item }}</span>
+                      </div>
+                    </template>
+                    <div class="ellipsis-text">
+                      {{ row.accuracys.join(", ") }}
+                    </div>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+              <!--              <el-table-column
+                align="center"
+                prop="avg"
+                label="平均值"
+                width="60"
+              /><el-table-column
+                align="center"
+                prop="range"
+                label="极差"
+                width="60"
+              />--><!--<el-table-column
+                align="center"
+                prop="checkUser"
+                label="检测人"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.checkUser }}</span>
+                </template> </el-table-column
+              ><el-table-column
+                align="center"
+                prop="checkDeviceNo"
+                label="检查设备编号"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.checkDeviceNo }}</span>
+                </template>
+              </el-table-column>-->
+              <el-table-column align="center" prop="abnormal" label="是否异常">
+                <template #default="{ row }"
+                  ><span>{{ row.abnormal }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column
+                align="center"
+                prop="abnormal1"
+                label="异常原因"
+                :show-overflow-tooltip="false"
+              >
+                <template #default="{ row }">
+                  <el-tooltip placement="top">
+                    <template #content>
+                      <div
+                        v-for="(item, index) in row.abnormal1.split('，')"
+                        :key="index"
+                      >
+                        <span>{{ item }}</span>
+                      </div>
+                    </template>
+                    <div class="ellipsis-text">
+                      {{ row.abnormal1 }}
+                    </div>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+              <!--              <el-table-column align="center" prop="analyseUser" label="分析人">
+                <template #default="{ row }"
+                  ><span>{{ row.analyseUser }}</span>
+                </template>
+              </el-table-column>-->
+              <el-table-column align="center" prop="measure" label="处置措施">
+                <template #default="{ row }"
+                  ><span>{{ row.measure }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" width="160" prop="" label="操作">
+                <template #default="{ row }">
+                  <el-button
+                    type="primary"
+                    size="small"
+                    class="btn"
+                    @click="updataItem(row)"
+                    style="height: 25px"
+                    >修改</el-button
+                  >
+                  <el-button
+                    type="info"
+                    size="small"
+                    class="btn"
+                    style="height: 25px"
+                    @click="deleteSubmit(row.id)"
+                    >删除</el-button
+                  >
+                </template>
+              </el-table-column>
+            </el-table>
+            <Pagination
+              :total="currentOption.total"
+              :page="currentOption.page"
+              :limit="currentOption.limit"
+              :pageSizes="currentOption.pageSizes"
+              v-model:page="currentOption.page"
+              @pagination="getTableData"
+            />
+          </div>
+          <div class="info" v-else>
+            <el-form
+              ref="ruleFormRef"
+              :model="addData"
+              :rules="rules"
+              label-width="auto"
+              class="formStyle"
+            >
+              <el-form-item label="日期" prop="dateStr">
+                <el-date-picker
+                  v-model="addData.dateStr"
+                  type="date"
+                  aria-label="Pick a date"
+                  placeholder="Pick a date"
+                  style="width: 100%"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
+                />
+              </el-form-item>
+              <el-form-item label="任务编号" prop="qualityTaskId">
+                <el-select
+                  v-model="addData.qualityTaskId"
+                  @change="
+                    (value) => {
+                      taskChange(value);
+                    }
+                  "
+                >
+                  <el-option
+                    v-for="(item, index) in taskOption"
+                    :key="index"
+                    :label="item.taskCode"
+                    :value="item.id"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="产品型号" prop="model">
+                <el-input :disabled="true" v-model="addData.model" />
+              </el-form-item>
+              <el-form-item label="生产批号" prop="batchNo">
+                <el-input v-model="addData.batchNo" />
+              </el-form-item>
+              <el-form-item
+                v-for="(item, index) in addData.accuracys"
+                :label="'数值' + (index + 1)"
+                :key="index"
+                :rules="[
+                  {
+                    required: true,
+                    trigger: 'change',
+                  },
+                ]"
+              >
+                <el-input-number
+                  :precision="2"
+                  :step="0.01"
+                  style="width: 100%"
+                  v-model="addData.accuracys[index]"
+                />
+              </el-form-item>
+              <!-- <el-form-item label="平均值" prop="avg">
+                <el-input v-model="addData.avg" />
+              </el-form-item>
+              <el-form-item label="极差" prop="range">
+                <el-input v-model="addData.range" />
+              </el-form-item> -->
+              <!--              <el-form-item label="检测人" prop="checkUser">
+                <el-input v-model="addData.checkUser" />
+              </el-form-item>
+              <el-form-item label="检查设备编号" prop="checkDeviceNo">
+                <el-input v-model="addData.checkDeviceNo" />
+              </el-form-item>-->
+              <!-- <el-form-item label="是否异常" prop="abnormal">
+                <el-input v-model="addData.abnormal" />
+              </el-form-item> -->
+              <!--              <el-form-item label="分析人" prop="analyseUser">
+                <el-input v-model="addData.analyseUser" />
+              </el-form-item>-->
+              <el-form-item label="处置措施" prop="measure">
+                <el-input v-model="addData.measure" />
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+      </el-scrollbar>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import * as echarts from "echarts";
+import { useDictionaryStore } from "@/store";
+import {
+  getData,
+  addDatas,
+  deleteData,
+  updateData,
+  getTaskCode,
+} from "@/api/analysis";
+import Search from "@/components/Search/index.vue";
+import { XBarRCompute } from "@/api/analysis";
+import { useCrud } from "@/hooks/userCrud";
+
+const { Utils } = useCrud({
+  src: "/api/v1/spc/pDownloadTemplate",
+});
+const { exportData } = Utils;
+
+const emit = defineEmits(["tableData"]);
+const compute = async () => {
+  // 存储提取的 accuracys 数据
+  const accuracysList = ref([]);
+
+  // 提取 accuracys 数据
+  tableData.value.forEach((v) => {
+    accuracysList.value.push(v.accuracys);
+  });
+
+  const { data } = await XBarRCompute({
+    dataList: accuracysList.value,
+    scale: 4,
+  });
+  emit("tableData", data);
+};
+
+const tableRowClassName = ({ row }) => {
+  if (row.abnormal === "是") {
+    return "warning-row";
+  }
+  return "";
+};
+
+const { dicts } = useDictionaryStore();
+
+const year = ref("0");
+const currentOption = reactive({
+  total: 0,
+  page: 1,
+  limit: 12,
+  pageSizes: [12],
+});
+const lableValue = ref("");
+const searchRef = ref(null);
+const getTaskOption = async () => {
+  const { data } = await getTaskCode({
+    operationCode: lableValue.value,
+  });
+  taskOption.value = data;
+};
+const getTableData = async () => {
+  const { data, code, msg } = await getData({
+    ...searchRef.value.searchForm,
+    pageNo: currentOption.page,
+    pageSize: currentOption.limit,
+    // yearStr: year.value,
+    operation: lableValue.value,
+  });
+  if (code == "200") {
+    tableData.value = data.records;
+    showData.value = { ...data, list: null };
+    currentOption.total = data.totalCount;
+    currentOption.page = data.pageNo;
+    oldDataJSON.value = JSON.stringify(data.records);
+  }
+  disabled.value = false;
+};
+const searchForm = [
+  {
+    label: "日期",
+    prop: "createds",
+    type: "daterange",
+  },
+  {
+    label: "产品型号",
+    prop: "model",
+    type: "input",
+  },
+  {
+    label: "生产批号",
+    prop: "batchNo",
+    type: "input",
+  },
+];
+//编辑状态
+const editStatus = ref(false);
+const addStatus = ref(false);
+const changeEditstatus = () => {
+  editStatus.value = !changeEditstatus.value;
+  addStatus.value = false;
+};
+const changeaddstatus = () => {
+  addStatus.value = !addStatus.value;
+  editStatus.value = false;
+};
+const canceleOp = () => {
+  addStatus.value = false;
+  editStatus.value = false;
+  reset();
+};
+
+const disabled = ref(false);
+const tableData = ref([]);
+//Form
+const ruleFormRef = ref(null);
+const rules = {
+  qualityTaskId: [
+    {
+      required: true,
+      trigger: "change",
+    },
+  ],
+  dateStr: [
+    {
+      required: true,
+      trigger: "change",
+    },
+  ],
+  model: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  batchNo: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy1: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy2: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy3: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy4: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy5: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  checkUser: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  checkDeviceNo: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  // abnormal: [
+  //   {
+  //     required: true,
+
+  //     trigger: "change",
+  //   },
+  // ],
+  analyseUser: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  measure: [
+    {
+      required: false,
+
+      trigger: "change",
+    },
+  ],
+};
+const resItem = {
+  // abnormal: "",
+  analyseUser: "",
+  batchNo: "",
+  checkDeviceNo: "",
+  checkUser: "",
+  dateStr: "",
+  measure: "",
+  model: "",
+};
+const addData = ref({
+  // abnormal: "",
+  analyseUser: "",
+  batchNo: "",
+  checkDeviceNo: "",
+  checkUser: "",
+  dateStr: "",
+  measure: "",
+  model: "",
+});
+const accuracysSum = ref(0);
+const taskChange = (value) => {
+  taskOption.value.forEach((item) => {
+    if (item.id == value) {
+      addData.value.model = item.prodtModel;
+      accuracysSum.value = Number(item.processCount);
+      addData.value.accuracys = [];
+      let array = [];
+      for (let i = 0; i < accuracysSum.value; i++) {
+        array.push(0);
+      }
+      addData.value.accuracys = array;
+    }
+  });
+};
+const oldDataJSON = ref("");
+const showData = ref({});
+const opOptions = ref([...dicts.spc_operation]);
+
+//修改
+const updataItem = (row) => {
+  editStatus.value = true;
+  addData.value = row;
+  addStatus.value = true;
+};
+const taskOption = ref([]);
+const value = ref(opOptions.value[0].remark);
+const showLable = ref("调阻");
+const maxHeight = ref(null);
+const maxWidth = ref(null);
+const Height = ref(0);
+const setHeight = () => {
+  Height.value = document.querySelector(".databox").clientHeight;
+  maxHeight.value = document.querySelector(".info").clientHeight;
+  maxWidth.value = document.querySelector(".info").clientWidth;
+};
+
+//当新增或者编辑的确定操作
+const submit = () => {
+  if (editStatus.value == true) {
+    updateSubmit();
+  } else {
+    addSubmit();
+  }
+};
+const addSubmit = async () => {
+  await ruleFormRef.value.validate(async (valid, fields) => {
+    if (valid) {
+      const { data, code } = await addDatas({
+        ...addData.value,
+        yearStr: year.value,
+        operation: lableValue.value,
+      });
+      if (code == "200") {
+        ElMessage.success("添加成功！");
+        reset();
+        getTableData();
+      }
+    } else {
+      ElMessage.error("请检查表单信息");
+    }
+  });
+};
+const deleteSubmit = async (id) => {
+  const { data, code } = await deleteData({
+    id,
+  });
+  if (code == "200") {
+    ElMessage.success("删除成功！");
+    getTableData();
+  }
+};
+const updateSubmit = async () => {
+  const { data, code } = await updateData({
+    ...addData.value,
+  });
+  if (code == "200") {
+    ElMessage.success("更新成功！");
+    reset();
+    getTableData();
+  }
+};
+const reset = () => {
+  addStatus.value = false;
+  editStatus.value = false;
+  addData.value = { ...resItem };
+  searchRef.value.searchForm = {};
+  currentOption.value = {
+    total: 0,
+    page: 0,
+    limit: 12,
+    pageSizes: [12],
+    operation: value.value,
+  };
+  getTableData();
+};
+
+const uploadUrl = ref("");
+const beforeUpload = (file) => {
+  const isExcel =
+    file.type === "application/vnd.ms-excel" ||
+    file.type ===
+      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+  if (!isExcel) {
+    ElMessage.error("只能上传Excel文件!");
+  }
+  return isExcel;
+};
+const uploadRef = ref("uploadRef");
+const handleSuccess = (response) => {
+  if (response.code === "200") {
+    ElMessage.success("Excel导入成功！");
+    uploadRef.value.clearFiles();
+    getTableData();
+  } else {
+    ElMessage.error("Excel导入失败！");
+  }
+};
+
+onMounted(async () => {
+  setHeight();
+  year.value = new Date().getFullYear() + "";
+  opOptions.value.forEach((item) => {
+    if (item.dictLabel == showLable.value) {
+      lableValue.value = item.dictValue;
+    }
+  });
+
+  await getTableData();
+  uploadUrl.value =
+    import.meta.env.VITE_APP_BASE_API +
+    "/api/v1/spc/xBarRUpload?operation=" +
+    lableValue.value;
+});
+onBeforeUnmount(() => {});
+
+const init = (data) => {
+  lableValue.value = data;
+  getTaskOption();
+  getTableData();
+};
+
+// 暴露 init 方法
+defineExpose({
+  init,
+});
+</script>
+
+<style lang="scss" scoped>
+@media print {
+  #print {
+    margin-left: -18%;
+  }
+}
+:deep(.el-table .warning-row) {
+  background-color: rgb(241, 142, 142) !important;
+}
+.ellipsis-text {
+  white-space: nowrap; /* 禁止换行 */
+  overflow: hidden; /* 隐藏超出部分 */
+  text-overflow: ellipsis; /* 显示省略号 */
+  width: 100%; /* 宽度占满单元格 */
+}
+.formStyle {
+  width: 400px;
+  margin: 20px auto;
+}
+.container1 {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  background-color: white;
+  .infobox {
+    width: 200px;
+    .header {
+      height: 120px;
+      border-bottom: 2px solid #00000010;
+      padding: 20px;
+    }
+    .body {
+      padding: 20px;
+    }
+  }
+  .databox {
+    flex: 1;
+    border-left: 2px solid #00000010;
+    .box {
+      height: 710px;
+      padding: 5px 20px;
+      display: flex;
+      flex-direction: column;
+      .illustrate {
+        padding: 20px 60px;
+      }
+      .tableTitle {
+        text-align: center;
+        margin: 10px 0;
+        padding-right: 40px;
+      }
+      .header {
+        margin-top: 20px;
+        //margin-left: 100px;
+        display: flex;
+        width: 100%;
+        height: auto;
+      }
+      //.title {
+      //  height: 50px;
+      //  display: flex;
+      //  align-items: center;
+      //  margin-bottom: 10px;
+      //  justify-content: space-between;
+      //  .btns {
+      //    display: flex;
+      //    align-items: center;
+      //    .btn {
+      //      height: 24px;
+      //      font-size: 14px;
+      //      margin: 0 5px;
+      //    }
+      //  }
+      //}
+      .info {
+        margin-top: 20px;
+        flex: 1;
+        height: 300px;
+      }
+    }
+  }
+}
+</style>

src/views/analysis/process/Xbar-S-2.vue

@@ -41,19 +41,7 @@ import { XBarSCompute } from "@/api/analysis";
 
 const tableData = ref([]);
 const chartData = ref([]);
-const getTableData = async () => {
-  // 存储提取的 accuracys 数据
-  const accuracysList = ref([]);
-
-  // 提取 accuracys 数据
-  tableData.value.forEach((v) => {
-    accuracysList.value.push(v.accuracys);
-  });
-
-  const { data } = await XBarSCompute({
-    dataList: accuracysList.value,
-    scale: 4,
-  });
+const getTableData = async (data) => {
   data.lclX = data.lclX.toFixed(4);
   data.uclS = data.uclS.toFixed(4);
   data.sBar = data.sBar.toFixed(4);
@@ -67,6 +55,10 @@ const getTableData = async () => {
     parseFloat(num.toFixed(4))
   );
   chartData.value = data;
+
+  chartsOption1.value.title[0].text = `${title.value}的Xbar-S控制图`;
+  setChart1();
+  setChart2();
 };
 
 const { dicts } = useDictionaryStore();
@@ -446,20 +438,33 @@ const setView = () => {
 onMounted(() => {
   init();
 });
-const init = (data, str) => {
+const init = async (data) => {
   tableData.value = data;
 
   setHeight();
 
-  nextTick(async () => {
-    await getTableData();
-    await changeSelect();
+  if (data) {
     charts1.value = echarts.init(document.getElementById("charts"));
     charts2.value = echarts.init(document.getElementById("charts1"));
+    window.addEventListener("resize", setView);
+    await getTableData(data);
+    // changeSelect();
     charts1.value.setOption(chartsOption1.value, true);
     charts2.value.setOption(chartsOption2.value, true);
-  });
-  window.addEventListener("resize", setView);
+  }
+
+  // nextTick(() => {
+  //   if (tableData.value != undefined && tableData.value.length > 0) {
+  //     getTableData();
+  //     // changeSelect();
+  //   }
+  //
+  //   charts1.value = echarts.init(document.getElementById("charts"));
+  //   charts2.value = echarts.init(document.getElementById("charts1"));
+  //   charts1.value.setOption(chartsOption1.value, true);
+  //   charts2.value.setOption(chartsOption2.value, true);
+  // });
+  // window.addEventListener("resize", setView);
 };
 onBeforeUnmount(() => {
   window.removeEventListener("resize", setView);

src/views/analysis/process/Xbar-SList.vue

@@ -0,0 +1,779 @@
+<template>
+  <div class="container1">
+    <div class="databox">
+      <el-scrollbar :style="{ height: Height + 'px' }">
+        <div class="box">
+          <div class="title">
+            <div style="display: flex; align-items: center">
+              <div class="bg"></div>
+              样本数据录入
+            </div>
+            <div class="header" v-show="!addStatus && !editStatus">
+              <Search
+                :searchOptions="searchForm"
+                ref="searchRef"
+                @data-list="getTableData"
+                @reset-list="reset"
+              />
+            </div>
+            <div class="btns">
+              <el-upload
+                v-if="!addStatus && !editStatus"
+                style="float: left"
+                :action="uploadUrl"
+                :on-success="handleSuccess"
+                :before-upload="beforeUpload"
+                :limit="1"
+                accept=".xlsx, .xls"
+                :show-file-list="false"
+                ref="uploadRef"
+              >
+                <el-button size="small" type="primary">Excel导入</el-button>
+              </el-upload>
+              <el-button
+                v-if="!addStatus && !editStatus"
+                style="margin-left: 15px"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="
+                  exportData(
+                    '/api/v1/spc/downloadTemplate',
+                    '/spc/template/XBarS控制图数据导入模版.xlsx'
+                  )
+                "
+                >模版下载</el-button
+              >
+              <el-button
+                style="margin-left: 15px"
+                v-if="!addStatus && !editStatus"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="changeaddstatus"
+                >新增</el-button
+              >
+              <el-button
+                style="margin-left: 15px"
+                v-if="!addStatus && !editStatus"
+                type="primary"
+                size="small"
+                class="btn"
+                @click="compute"
+                >计算</el-button
+              >
+              <el-button
+                v-if="editStatus || addStatus"
+                type="success"
+                size="small"
+                class="btn"
+                @click="submit"
+                >确定</el-button
+              >
+              <el-button
+                v-if="editStatus || addStatus"
+                type="info"
+                size="small"
+                class="btn"
+                @click="canceleOp"
+                >取消</el-button
+              >
+            </div>
+          </div>
+          <div class="info" v-if="!addStatus">
+            <el-table
+              :data="tableData"
+              border
+              :style="{
+                height: maxHeight - 150 + 'px',
+                width: maxWidth + 'px',
+              }"
+              :show-overflow-tooltip="true"
+              :row-class-name="tableRowClassName"
+            >
+              <el-table-column
+                align="center"
+                prop="dateStr"
+                sortable
+                label="日期"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.dateStr }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" prop="model" label="产品型号">
+                <template #default="{ row }"
+                  ><span>{{ row.model }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" prop="batchNo" label="生产批号">
+                <template #default="{ row }"
+                  ><span>{{ row.batchNo }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column
+                align="center"
+                prop="accuracys"
+                label="数据"
+                :show-overflow-tooltip="false"
+              >
+                <template #default="{ row }">
+                  <el-tooltip placement="top">
+                    <template #content>
+                      <div v-for="(item, index) in row.accuracys" :key="index">
+                        <span>数值{{ index + 1 }}: {{ item }}</span>
+                      </div>
+                    </template>
+                    <div class="ellipsis-text">
+                      {{ row.accuracys.join(", ") }}
+                    </div>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+              <!--              <el-table-column
+                align="center"
+                prop="avg"
+                label="平均值"
+                width="60"
+              /><el-table-column
+                align="center"
+                prop="range"
+                label="极差"
+                width="60"
+              />--><!--<el-table-column
+                align="center"
+                prop="checkUser"
+                label="检测人"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.checkUser }}</span>
+                </template> </el-table-column
+              ><el-table-column
+                align="center"
+                prop="checkDeviceNo"
+                label="检查设备编号"
+              >
+                <template #default="{ row }"
+                  ><span>{{ row.checkDeviceNo }}</span>
+                </template>
+              </el-table-column>-->
+              <el-table-column align="center" prop="abnormal" label="是否异常">
+                <template #default="{ row }"
+                  ><span>{{ row.abnormal }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column
+                align="center"
+                prop="abnormal1"
+                label="异常原因"
+                :show-overflow-tooltip="false"
+              >
+                <template #default="{ row }">
+                  <el-tooltip placement="top">
+                    <template #content>
+                      <div
+                        v-for="(item, index) in row.abnormal1.split('，')"
+                        :key="index"
+                      >
+                        <span>{{ item }}</span>
+                      </div>
+                    </template>
+                    <div class="ellipsis-text">
+                      {{ row.abnormal1 }}
+                    </div>
+                  </el-tooltip>
+                </template>
+              </el-table-column>
+              <!--              <el-table-column align="center" prop="analyseUser" label="分析人">
+                <template #default="{ row }"
+                  ><span>{{ row.analyseUser }}</span>
+                </template>
+              </el-table-column>-->
+              <el-table-column align="center" prop="measure" label="处置措施">
+                <template #default="{ row }"
+                  ><span>{{ row.measure }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" width="160" prop="" label="操作">
+                <template #default="{ row }">
+                  <el-button
+                    type="primary"
+                    size="small"
+                    class="btn"
+                    @click="updataItem(row)"
+                    style="height: 25px"
+                    >修改</el-button
+                  >
+                  <el-button
+                    type="info"
+                    size="small"
+                    class="btn"
+                    style="height: 25px"
+                    @click="deleteSubmit(row.id)"
+                    >删除</el-button
+                  >
+                </template>
+              </el-table-column>
+            </el-table>
+            <Pagination
+              :total="currentOption.total"
+              :page="currentOption.page"
+              :limit="currentOption.limit"
+              :pageSizes="currentOption.pageSizes"
+              v-model:page="currentOption.page"
+              @pagination="getTableData"
+            />
+          </div>
+          <div class="info" v-else>
+            <el-form
+              ref="ruleFormRef"
+              :model="addData"
+              :rules="rules"
+              label-width="auto"
+              class="formStyle"
+            >
+              <el-form-item label="日期" prop="dateStr">
+                <el-date-picker
+                  v-model="addData.dateStr"
+                  type="date"
+                  aria-label="Pick a date"
+                  placeholder="Pick a date"
+                  style="width: 100%"
+                  format="YYYY-MM-DD"
+                  value-format="YYYY-MM-DD"
+                />
+              </el-form-item>
+              <el-form-item label="任务编号" prop="qualityTaskId">
+                <el-select
+                  v-model="addData.qualityTaskId"
+                  @change="
+                    (value) => {
+                      taskChange(value);
+                    }
+                  "
+                >
+                  <el-option
+                    v-for="(item, index) in taskOption"
+                    :key="index"
+                    :label="item.taskCode"
+                    :value="item.id"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item label="产品型号" prop="model">
+                <el-input :disabled="true" v-model="addData.model" />
+              </el-form-item>
+              <el-form-item label="生产批号" prop="batchNo">
+                <el-input v-model="addData.batchNo" />
+              </el-form-item>
+              <el-form-item
+                v-for="(item, index) in addData.accuracys"
+                :label="'数值' + (index + 1)"
+                :key="index"
+                :rules="[
+                  {
+                    required: true,
+                    trigger: 'change',
+                  },
+                ]"
+              >
+                <el-input-number
+                  :precision="2"
+                  :step="0.01"
+                  style="width: 100%"
+                  v-model="addData.accuracys[index]"
+                />
+              </el-form-item>
+              <!-- <el-form-item label="平均值" prop="avg">
+                <el-input v-model="addData.avg" />
+              </el-form-item>
+              <el-form-item label="极差" prop="range">
+                <el-input v-model="addData.range" />
+              </el-form-item> -->
+              <!--              <el-form-item label="检测人" prop="checkUser">
+                <el-input v-model="addData.checkUser" />
+              </el-form-item>
+              <el-form-item label="检查设备编号" prop="checkDeviceNo">
+                <el-input v-model="addData.checkDeviceNo" />
+              </el-form-item>-->
+              <!-- <el-form-item label="是否异常" prop="abnormal">
+                <el-input v-model="addData.abnormal" />
+              </el-form-item> -->
+              <!--              <el-form-item label="分析人" prop="analyseUser">-->
+              <!--                <el-input v-model="addData.analyseUser" />-->
+              <!--              </el-form-item>-->
+              <el-form-item label="处置措施" prop="measure">
+                <el-input v-model="addData.measure" />
+              </el-form-item>
+            </el-form>
+          </div>
+        </div>
+      </el-scrollbar>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { useDictionaryStore } from "@/store";
+import {
+  getData,
+  addDatas,
+  deleteData,
+  updateData,
+  getTaskCode,
+} from "@/api/analysis";
+import Search from "@/components/Search/index.vue";
+import { XBarSCompute } from "@/api/analysis";
+import { useCrud } from "@/hooks/userCrud";
+
+const { Utils } = useCrud({
+  src: "/api/v1/spc/pDownloadTemplate",
+});
+const { exportData } = Utils;
+
+const emit = defineEmits(["tableData"]);
+const compute = async () => {
+  // 存储提取的 accuracys 数据
+  const accuracysList = ref([]);
+
+  // 提取 accuracys 数据
+  tableData.value.forEach((v) => {
+    accuracysList.value.push(v.accuracys);
+  });
+
+  const { data } = await XBarSCompute({
+    dataList: accuracysList.value,
+    scale: 4,
+  });
+  emit("tableData", data);
+};
+
+const tableRowClassName = ({ row }) => {
+  if (row.abnormal === "是") {
+    return "warning-row";
+  }
+  return "";
+};
+
+const { dicts } = useDictionaryStore();
+
+const year = ref("0");
+const currentOption = reactive({
+  total: 0,
+  page: 1,
+  limit: 12,
+  pageSizes: [12],
+});
+const lableValue = ref("");
+const searchRef = ref(null);
+const getTaskOption = async () => {
+  const { data } = await getTaskCode({
+    operationCode: lableValue.value,
+  });
+  taskOption.value = data;
+};
+const getTableData = async () => {
+  const { data, code, msg } = await getData({
+    ...searchRef.value.searchForm,
+    pageNo: currentOption.page,
+    pageSize: currentOption.limit,
+    // yearStr: year.value,
+    operation: lableValue.value,
+  });
+  if (code == "200") {
+    tableData.value = data.records;
+    showData.value = { ...data, list: null };
+    currentOption.total = data.totalCount;
+    currentOption.page = data.pageNo;
+    oldDataJSON.value = JSON.stringify(data.records);
+  }
+  disabled.value = false;
+};
+const searchForm = [
+  {
+    label: "日期",
+    prop: "createds",
+    type: "daterange",
+  },
+  {
+    label: "产品型号",
+    prop: "model",
+    type: "input",
+  },
+  {
+    label: "生产批号",
+    prop: "batchNo",
+    type: "input",
+  },
+];
+//编辑状态
+const editStatus = ref(false);
+const addStatus = ref(false);
+const changeEditstatus = () => {
+  editStatus.value = !changeEditstatus.value;
+  addStatus.value = false;
+};
+const changeaddstatus = () => {
+  addStatus.value = !addStatus.value;
+  editStatus.value = false;
+};
+const canceleOp = () => {
+  addStatus.value = false;
+  editStatus.value = false;
+  reset();
+};
+const disabled = ref(false);
+const tableData = ref([]);
+//Form
+const ruleFormRef = ref(null);
+
+const rules = {
+  qualityTaskId: [
+    {
+      required: true,
+      trigger: "change",
+    },
+  ],
+  dateStr: [
+    {
+      required: true,
+      trigger: "change",
+    },
+  ],
+  model: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  batchNo: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy1: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy2: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy3: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy4: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  accuracy5: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  checkUser: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  checkDeviceNo: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  // abnormal: [
+  //   {
+  //     required: true,
+
+  //     trigger: "change",
+  //   },
+  // ],
+  analyseUser: [
+    {
+      required: true,
+
+      trigger: "change",
+    },
+  ],
+  measure: [
+    {
+      required: false,
+
+      trigger: "change",
+    },
+  ],
+};
+const resItem = {
+  // abnormal: "",
+  analyseUser: "",
+  batchNo: "",
+  checkDeviceNo: "",
+  checkUser: "",
+  dateStr: "",
+  measure: "",
+  model: "",
+};
+const addData = ref({
+  // abnormal: "",
+  analyseUser: "",
+  batchNo: "",
+  checkDeviceNo: "",
+  checkUser: "",
+  dateStr: "",
+  measure: "",
+  model: "",
+});
+const accuracysSum = ref(0);
+const taskChange = (value) => {
+  taskOption.value.forEach((item) => {
+    if (item.id == value) {
+      addData.value.model = item.prodtModel;
+      accuracysSum.value = Number(item.processCount);
+      addData.value.accuracys = [];
+      let array = [];
+      for (let i = 0; i < accuracysSum.value; i++) {
+        array.push(0);
+      }
+      addData.value.accuracys = array;
+    }
+  });
+};
+const oldDataJSON = ref("");
+const showData = ref({});
+const opOptions = ref([...dicts.spc_operation]);
+
+//修改
+const updataItem = (row) => {
+  editStatus.value = true;
+  addData.value = row;
+  addStatus.value = true;
+};
+const taskOption = ref([]);
+const value = ref(opOptions.value[0].remark);
+const showLable = ref("调阻");
+const maxHeight = ref(null);
+const maxWidth = ref(null);
+const Height = ref(0);
+const setHeight = () => {
+  Height.value = document.querySelector(".databox").clientHeight;
+  maxHeight.value = document.querySelector(".info").clientHeight;
+  maxWidth.value = document.querySelector(".info").clientWidth;
+};
+
+//当新增或者编辑的确定操作
+const submit = () => {
+  if (editStatus.value == true) {
+    updateSubmit();
+  } else {
+    addSubmit();
+  }
+};
+const addSubmit = async () => {
+  await ruleFormRef.value.validate(async (valid, fields) => {
+    if (valid) {
+      const { data, code } = await addDatas({
+        ...addData.value,
+        yearStr: year.value,
+        operation: lableValue.value,
+      });
+      if (code == "200") {
+        ElMessage.success("添加成功！");
+        reset();
+        getTableData();
+      }
+    } else {
+      ElMessage.error("请检查表单信息");
+    }
+  });
+};
+const deleteSubmit = async (id) => {
+  const { data, code } = await deleteData({
+    id,
+  });
+  if (code == "200") {
+    ElMessage.success("删除成功！");
+    getTableData();
+  }
+};
+const updateSubmit = async () => {
+  const { data, code } = await updateData({
+    ...addData.value,
+  });
+  if (code == "200") {
+    ElMessage.success("更新成功！");
+    reset();
+    getTableData();
+  }
+};
+const reset = () => {
+  addStatus.value = false;
+  editStatus.value = false;
+  addData.value = { ...resItem };
+  searchRef.value.searchForm = {};
+  currentOption.value = {
+    total: 0,
+    page: 0,
+    limit: 12,
+    pageSizes: [12],
+    operation: value.value,
+  };
+  getTableData();
+};
+
+const uploadUrl = ref("");
+const beforeUpload = (file) => {
+  const isExcel =
+    file.type === "application/vnd.ms-excel" ||
+    file.type ===
+      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+  if (!isExcel) {
+    ElMessage.error("只能上传Excel文件!");
+  }
+  return isExcel;
+};
+const uploadRef = ref("uploadRef");
+const handleSuccess = (response) => {
+  if (response.code === "200") {
+    ElMessage.success("Excel导入成功！");
+    uploadRef.value.clearFiles();
+    getTableData();
+  } else {
+    ElMessage.error("Excel导入失败！");
+  }
+};
+
+onMounted(async () => {
+  setHeight();
+  year.value = new Date().getFullYear() + "";
+  opOptions.value.forEach((item) => {
+    if (item.dictLabel == showLable.value) {
+      lableValue.value = item.dictValue;
+    }
+  });
+
+  await getTableData();
+  uploadUrl.value =
+    import.meta.env.VITE_APP_BASE_API +
+    "/api/v1/spc/xBarRUpload?operation=" +
+    lableValue.value;
+});
+onBeforeUnmount(() => {});
+
+const init = (data) => {
+  lableValue.value = data;
+  getTaskOption();
+  getTableData();
+};
+
+// 暴露 init 方法
+defineExpose({
+  init,
+});
+</script>
+
+<style lang="scss" scoped>
+@media print {
+  #print {
+    margin-left: -18%;
+  }
+}
+:deep(.el-table .warning-row) {
+  background-color: rgb(241, 142, 142) !important;
+}
+.ellipsis-text {
+  white-space: nowrap; /* 禁止换行 */
+  overflow: hidden; /* 隐藏超出部分 */
+  text-overflow: ellipsis; /* 显示省略号 */
+  width: 100%; /* 宽度占满单元格 */
+}
+.formStyle {
+  width: 400px;
+  margin: 20px auto;
+}
+.container1 {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  background-color: white;
+  .infobox {
+    width: 200px;
+    .header {
+      height: 120px;
+      border-bottom: 2px solid #00000010;
+      padding: 20px;
+    }
+    .body {
+      padding: 20px;
+    }
+  }
+  .databox {
+    flex: 1;
+    border-left: 2px solid #00000010;
+    .box {
+      height: 710px;
+      padding: 5px 20px;
+      display: flex;
+      flex-direction: column;
+      .illustrate {
+        padding: 20px 60px;
+      }
+      .tableTitle {
+        text-align: center;
+        margin: 10px 0;
+        padding-right: 40px;
+      }
+      .header {
+        margin-top: 20px;
+        //margin-left: 100px;
+        display: flex;
+        width: 100%;
+        height: auto;
+      }
+      //.title {
+      //  height: 50px;
+      //  display: flex;
+      //  align-items: center;
+      //  margin-bottom: 10px;
+      //  justify-content: space-between;
+      //  .btns {
+      //    display: flex;
+      //    align-items: center;
+      //    .btn {
+      //      height: 24px;
+      //      font-size: 14px;
+      //      margin: 0 5px;
+      //    }
+      //  }
+      //}
+      .info {
+        margin-top: 20px;
+        flex: 1;
+        height: 300px;
+      }
+    }
+  }
+}
+</style>

src/views/analysis/process/index.vue

@@ -2,22 +2,6 @@
   <div class="container1">
     <div class="infobox">
       <div class="header">
-        <div class="text">工序名称：</div>
-        <el-select
-          v-model="value"
-          placeholder="Select"
-          ref="selectRef"
-          @change="changeSelect"
-        >
-          <el-option
-            v-for="item in opOptions"
-            :key="item.value"
-            :label="item.dictLabel"
-            :value="item.remark"
-          />
-        </el-select>
-      </div>
-      <div class="body">
         <div>
           <div class="text">控制图：</div>
           <el-select
@@ -34,53 +18,104 @@
             />
           </el-select>
         </div>
-        <div class="text" style="margin-top: 20px">
-          Xbar-UCL：{{ value ? JSON.parse(value).avgMax : "-" }}
-        </div>
-        <div class="text">
-          Xbar-MED：{{ value ? JSON.parse(value).avgMid : "-" }}
-        </div>
-        <div class="text">
-          Xbar-LCL：{{ value ? JSON.parse(value).avgMin : "-" }}
-        </div>
-        <div class="text">
-          R-UCL：{{ value ? JSON.parse(value).rangeMax : "-" }}
-        </div>
-        <div class="text">
-          R-MED：{{ value ? JSON.parse(value).rangeMid : "-" }}
-        </div>
-        <div class="text">
-          R-LCL：{{ value ? JSON.parse(value).rangeMin : "-" }}
-        </div>
-        <div class="text">
+        <!--        <div class="text">
           计量单位：{{ value ? JSON.parse(value).unit : "-" }}
+        </div>-->
+      </div>
+      <div class="body" v-if="value2 === 'Xbar-R' || value2 === 'Xbar-S'">
+        <div>
+          <div class="text">工序名称：</div>
+          <el-select
+            v-model="value"
+            placeholder="Select"
+            ref="selectRef"
+            @change="changeSelect"
+          >
+            <el-option
+              v-for="item in opOptions"
+              :key="item.value"
+              :label="item.dictLabel"
+              :value="item.remark"
+            />
+          </el-select>
+          <div class="text" style="margin-top: 20px">
+            上限（3σ）：{{ value ? JSON.parse(value).ucl : "-" }}
+          </div>
+          <div class="text">
+            上限子界限（2σ）：{{ value ? JSON.parse(value).ucl_c : "-" }}
+          </div>
+          <div class="text">
+            上限子界限（σ）：{{ value ? JSON.parse(value).ucl_b : "-" }}
+          </div>
+          <div class="text">
+            中心线：{{ value ? JSON.parse(value).cl : "-" }}
+          </div>
+          <div class="text">
+            下限子界限（σ）：{{ value ? JSON.parse(value).lcl_c : "-" }}
+          </div>
+          <div class="text">
+            下限子界限（2σ）：{{ value ? JSON.parse(value).lcl_b : "-" }}
+          </div>
+          <div class="text">
+            下限（3σ）：{{ value ? JSON.parse(value).lcl : "-" }}
+          </div>
         </div>
       </div>
     </div>
     <div class="databox">
       <el-scrollbar :style="{ height: Height + 'px' }">
         <div class="box">
-          <div class="info" v-if="value2 === 'Xbar-R' || value2 === 'Xbar-S'">
-            <XbarList ref="xbarListRef" @tableData="handleDataFromChild" />
+          <div class="info" v-if="value2 === 'Xbar-R'">
+            <XbarRList
+              ref="xbarrListRef"
+              @table-data="handleDataFromChildXbarR"
+            />
+          </div>
+          <div class="info" v-if="value2 === 'Xbar-S'">
+            <XbarSList
+              ref="xbarsListRef"
+              @table-data="handleDataFromChildXbarS"
+            />
           </div>
           <div class="info" v-if="value2 === 'P'">
             <PList
               ref="pListRef"
-              @tableData="handleDataFromChildP"
+              @table-data="handleDataFromChildP"
               :chart="chart"
             />
           </div>
           <div class="info" v-if="value2 === 'NP'">
             <NPList
               ref="npListRef"
-              @tableData="handleDataFromChildNP"
+              @table-data="handleDataFromChildNP"
               :chart="chart"
             />
           </div>
           <div class="info" v-if="value2 === 'C'">
             <CList
               ref="cListRef"
-              @tableData="handleDataFromChildC"
+              @table-data="handleDataFromChildC"
+              :chart="chart"
+            />
+          </div>
+          <div class="info" v-if="value2 === 'U'">
+            <UList
+              ref="uListRef"
+              @table-data="handleDataFromChildU"
+              :chart="chart"
+            />
+          </div>
+          <div class="info" v-if="value2 === 'I-MR'">
+            <IMRList
+              ref="imrListRef"
+              @table-data="handleDataFromChildIMR"
+              :chart="chart"
+            />
+          </div>
+          <div class="info" v-if="value2 === 'EWMA'">
+            <EWMAList
+              ref="imrListRef"
+              @table-data="handleDataFromChildEWMA"
               :chart="chart"
             />
           </div>
@@ -118,20 +153,15 @@
 
 <script setup>
 import { ref } from "vue";
-import XbarList from "./XbarList.vue";
+import XbarRList from "./Xbar-RList.vue";
+import XbarSList from "./Xbar-SList.vue";
 import PList from "./PList.vue";
 import NPList from "./NPList.vue";
 import CList from "./CList.vue";
-import * as echarts from "echarts";
+import UList from "./UList.vue";
+import IMRList from "./I-MRList.vue";
+import EWMAList from "./EWMAList.vue";
 import { useDictionaryStore } from "@/store";
-import {
-  getData,
-  addDatas,
-  deleteData,
-  updateData,
-  getTaskCode,
-} from "@/api/analysis";
-import Search from "@/components/Search/index.vue";
 import XbarR from "@/views/analysis/process/Xbar-R-2.vue";
 import NP from "@/views/analysis/process/NP.vue";
 import C from "@/views/analysis/process/C.vue";
@@ -139,11 +169,27 @@ import XbarS from "@/views/analysis/process/Xbar-S-2.vue";
 import P from "@/views/analysis/process/P.vue";
 import EWMA from "@/views/analysis/process/EWMA.vue";
 import IMR from "@/views/analysis/process/I-MR.vue";
+import U from "@/views/analysis/process/U.vue";
 
-const handleDataFromChild = async (data) => {
+const handleDataFromChildXbarR = async (data) => {
+  await nextTick();
+  xbarRRefMethod(data);
+};
+const handleDataFromChildXbarS = async (data) => {
+  await nextTick();
+  xbarSRefMethod(data);
+};
+const handleDataFromChildEWMA = async (data) => {
   await nextTick();
-  tableData.value = data;
-  changeSelect2();
+  eWMARefMethod(data);
+};
+const handleDataFromChildIMR = async (data) => {
+  await nextTick();
+  imrRefMethod(data);
+};
+const handleDataFromChildU = async (data) => {
+  await nextTick();
+  uRefMethod(data);
 };
 const handleDataFromChildC = async (data) => {
   await nextTick();
@@ -159,19 +205,19 @@ const handleDataFromChildP = async (data) => {
 };
 
 const xbarRRef = ref("xbarRRef");
-const xbarRRefMethod = async () => {
+const xbarRRefMethod = async (data) => {
   await nextTick(() => {
     if (xbarRRef.value) {
-      xbarRRef.value.init(tableData.value);
+      xbarRRef.value.init(data);
     }
   });
 };
 
 const xbarSRef = ref("xbarSRef");
-const xbarSRefMethod = async () => {
+const xbarSRefMethod = async (data) => {
   await nextTick();
   if (xbarSRef.value) {
-    xbarSRef.value.init(tableData.value);
+    xbarSRef.value.init(data);
   }
 };
 const pRef = ref("pRef");
@@ -196,79 +242,29 @@ const cRefMethod = async (data) => {
   }
 };
 const uRef = ref("uRef");
-const uRefMethod = async () => {
+const uRefMethod = async (data) => {
   await nextTick();
   if (uRef.value) {
-    uRef.value.init();
+    uRef.value.init(data);
   }
 };
 const iMRRef = ref("iMRRef");
-const imrRefMethod = async () => {
+const imrRefMethod = async (data) => {
   await nextTick();
   if (iMRRef.value) {
-    iMRRef.value.init();
+    iMRRef.value.init(data);
   }
 };
 const eWMARef = ref("EWMA");
-const eWMARefMethod = async () => {
+const eWMARefMethod = async (data) => {
   await nextTick();
   if (eWMARef.value) {
-    eWMARef.value.init();
+    eWMARef.value.init(data);
   }
 };
 const year = ref("0");
-const currentOption = reactive({
-  total: 0,
-  page: 1,
-  limit: 12,
-  pageSizes: [12],
-});
 const lableValue = ref("");
-const searchRef = ref(null);
-const getTaskOption = async () => {
-  const { data } = await getTaskCode({
-    operationCode: JSON.parse(value.value).value,
-  });
-  taskOption.value = data;
-};
-const getTableData = async () => {
-  const { data, code, msg } = await getData({
-    ...searchRef.value.searchForm,
-    pageNo: currentOption.page,
-    pageSize: currentOption.limit,
-    // yearStr: year.value,
-    operation: lableValue.value,
-  });
-  if (code == "200") {
-    tableData.value = data.records;
-    showData.value = { ...data, list: null };
-    // if (tableData.value.length > 0) {
-    //   setChart1();
-    //   setChart2();
-    // }
-    currentOption.total = data.totalCount;
-    currentOption.page = data.pageNo;
-    oldDataJSON.value = JSON.stringify(data.records);
-  }
-  disabled.value = false;
-};
-const searchForm = [
-  {
-    label: "日期",
-    prop: "createds",
-    type: "daterange",
-  },
-  {
-    label: "产品型号",
-    prop: "model",
-    type: "input",
-  },
-  {
-    label: "生产批号",
-    prop: "batchNo",
-    type: "input",
-  },
-];
+
 const { dicts } = useDictionaryStore();
 const sccOptions = ref([...dicts.spc_control_chart]);
 const value2 = ref(sccOptions.value[0].dictValue);
@@ -280,285 +276,18 @@ const changeEditstatus = () => {
   editStatus.value = !changeEditstatus.value;
   addStatus.value = false;
 };
-const changeaddstatus = () => {
-  addStatus.value = !addStatus.value;
-  editStatus.value = false;
-};
-const canceleOp = () => {
-  addStatus.value = false;
-  editStatus.value = false;
-  reset();
-};
-const Y1value = ref([]);
-const X1array = ref([]);
-const setY1value = () => {
-  Y1value.value = [];
-  tableData.value.forEach((item) => {
-    Y1value.value.push(item.avg);
-  });
-  Y1value.value.unshift("");
-  Y1value.value.push("");
-
-  chartsOption1.value.series[0].data = Y1value.value;
-};
-const setX1array = async () => {
-  X1array.value = await [];
-  tableData.value.forEach((item, index) => {
-    X1array.value.push(index + 1);
-  });
-  X1array.value.unshift("");
-  X1array.value.push("");
-  chartsOption1.value.xAxis[0].data = X1array.value;
-};
 
-const importStatus = ref(false);
-const disabled = ref(false);
 const tableData = ref([]);
-//Form
-const ruleFormRef = ref(null);
-
-const addItem = {
-  // abnormal: "",
-  accuracy1: 0,
-  accuracy2: 0,
-  accuracy3: 0,
-  accuracy4: 0,
-  accuracy5: 0,
-  analyseUser: "",
-  avg: 0,
-  batchNo: "",
-  checkDeviceNo: "",
-  checkUser: "",
-  dateStr: "",
-  measure: "",
-  model: "",
-  range: 0,
-};
-const rules = {
-  qualityTaskId: [
-    {
-      required: true,
-      trigger: "change",
-    },
-  ],
-  dateStr: [
-    {
-      required: true,
-      trigger: "change",
-    },
-  ],
-  model: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  batchNo: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  accuracy1: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  accuracy2: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  accuracy3: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  accuracy4: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  accuracy5: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  checkUser: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  checkDeviceNo: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  // abnormal: [
-  //   {
-  //     required: true,
-
-  //     trigger: "change",
-  //   },
-  // ],
-  analyseUser: [
-    {
-      required: true,
-
-      trigger: "change",
-    },
-  ],
-  measure: [
-    {
-      required: false,
-
-      trigger: "change",
-    },
-  ],
-};
-const resItem = {
-  // abnormal: "",
-  analyseUser: "",
-  batchNo: "",
-  checkDeviceNo: "",
-  checkUser: "",
-  dateStr: "",
-  measure: "",
-  model: "",
-};
-const addData = ref({
-  // abnormal: "",
-  analyseUser: "",
-  batchNo: "",
-  checkDeviceNo: "",
-  checkUser: "",
-  dateStr: "",
-  measure: "",
-  model: "",
-});
-const accuracysSum = ref(0);
-const taskChange = (value) => {
-  taskOption.value.forEach((item) => {
-    if (item.id == value) {
-      addData.value.model = item.prodtModel;
-      accuracysSum.value = Number(item.processCount);
-      addData.value.accuracys = [];
-      let array = [];
-      for (let i = 0; i < accuracysSum.value; i++) {
-        array.push(0);
-      }
-      addData.value.accuracys = array;
-    }
-  });
-};
-const oldDataJSON = ref("");
-const showData = ref({});
-const url = ref(import.meta.env.VITE_APP_BASE_API + "/api/v1/spc/import");
-const headers = { Authorization: `${localStorage.getItem("token")}` };
 const opOptions = ref([...dicts.spc_operation]);
-const setChart1Info = () => {
-  // chartsOption1.value.title[0].text = `上限=${showData.value.avgMax ? showData.value.avgMax : "-"}`;
-  // chartsOption1.value.title[0].text = `x̄=${showData.value.avgAvg ? showData.value.avgAvg : "-"}`;
-  chartsOption1.value.series[0].markLine.data[0].yAxis = JSON.parse(
-    value.value
-  ).avgMax;
-  chartsOption1.value.series[0].markLine.data[0].label.formatter = `                          上限=${
-    JSON.parse(value.value).avgMax ? JSON.parse(value.value).avgMax : "0"
-  }`;
-  chartsOption1.value.series[0].markLine.data[1].yAxis = JSON.parse(value.value)
-    .avgMin
-    ? JSON.parse(value.value).avgMin
-    : 0;
-  chartsOption1.value.series[0].markLine.data[1].label.formatter = `           下限=${JSON.parse(value.value).avgMin ? JSON.parse(value.value).avgMin : "0"}`;
-  chartsOption1.value.series[0].markLine.data[2].yAxis = JSON.parse(
-    value.value
-  ).avgMid;
-  chartsOption1.value.series[0].markLine.data[2].label.formatter = `x̄=${
-    JSON.parse(value.value).avgMid
-  }`;
-  // chartsOption1.value.title[2].text = `下限=${showData.value.avgMin ? showData.value.avgMin : "0"}`;
-};
-const setChart2Info = () => {
-  // chartsOption2.value.title[0].text = `上限=${showData.value.rangeMax ? showData.value.rangeMax : "-"}`;
-  // chartsOption2.value.title[0].text = `R=${showData.value.rangeAvg ? showData.value.rangeAvg : "-"}`;
-  chartsOption2.value.series[0].markLine.data[0].yAxis = JSON.parse(
-    value.value
-  ).rangeMax;
-  chartsOption2.value.series[0].markLine.data[0].label.formatter = `                          上限=${
-    JSON.parse(value.value).rangeMax ? JSON.parse(value.value).rangeMax : "0"
-  }`;
-  chartsOption2.value.series[0].markLine.data[1].yAxis = JSON.parse(value.value)
-    .rangeMin
-    ? JSON.parse(value.value).rangeMin
-    : 0;
-  chartsOption2.value.series[0].markLine.data[1].label.formatter = `           下限=${
-    JSON.parse(value.value).rangeMin ? JSON.parse(value.value).rangeMin : "0"
-  }`;
-  chartsOption2.value.series[0].markLine.data[2].yAxis = JSON.parse(
-    value.value
-  ).rangeMid;
-  chartsOption2.value.series[0].markLine.data[2].label.formatter = `x̄=${
-    JSON.parse(value.value).rangeMid
-  }`;
-  // chartsOption2.value.title[2].text = `下限=${showData.value.rangeMin ? showData.value.rangeMin : "0"}`;
-};
-const setChart1 = () => {
-  setChart1Info();
-  setY1value();
-  setX1array();
-  charts1.value.setOption(chartsOption1.value, true);
-};
-const setChart2 = () => {
-  setChart2Info();
-  setY2value();
-  setX2array();
-  charts2.value.setOption(chartsOption2.value, true);
-};
-//修改
-const updataItem = (row) => {
-  editStatus.value = true;
-  addData.value = row;
-  addStatus.value = true;
-};
-//导入按钮
-const onSuccess = (res) => {
-  const { code, msg, data } = res;
-  if (code != "200") {
-    ElMessage.error(msg);
-  } else {
-    tableData.value = data.list;
-    showData.value = { ...data, list: null };
-    setChart1();
-    setChart2();
-    oldDataJSON.value = JSON.stringify(data.list);
-    importStatus.value = true;
-    ElMessage.success(msg);
-  }
-};
-const taskOption = ref([]);
+
 const value = ref(opOptions.value[0].remark);
 const title = ref("调阻精度");
+const xbarrListRef = ref("xbarrListRef");
+const xbarsListRef = ref("xbarsListRef");
 
 const showLable = ref("调阻");
 const changeSelect = () => {
-  setTimeout(async () => {
-    getTaskOption();
+  setTimeout(() => {
     showLable.value = selectRef.value.currentPlaceholder;
     opOptions.value.forEach((item) => {
       if (item.dictLabel == showLable.value) {
@@ -579,19 +308,15 @@ const changeSelect = () => {
         title.value = "调阻精度";
         break;
     }
-    // await getTableData();
     chartsOption1.value.title[0].text = `${title.value}的Xbar-R控制图`;
-    // tableData.value.forEach((item) => {
-    //   item.accuracy1 = 0;
-    //   item.accuracy2 = 0;
-    //   item.accuracy3 = 0;
-    //   item.accuracy4 = 0;
-    //   item.accuracy5 = 0;
-    //   item.avg = 0;
-    //   item.range = 0;
-    // });
-    // setChart1();
-    changeSelect2();
+
+    if (value2.value === "Xbar-R") {
+      xbarrListRef.value.init(lableValue.value);
+      xbarrListRef.value.init(lableValue.value);
+    } else if (value2.value === "Xbar-S") {
+      xbarsListRef.value.init(lableValue.value);
+      xbarsListRef.value.init(lableValue.value);
+    }
   }, 0);
 };
 const changeSelect2 = () => {
@@ -619,26 +344,6 @@ const changeSelect2 = () => {
 // );
 const selectRef = ref(null);
 //保存
-const changeEdit = async () => {
-  if (disabled.value == false) {
-    disabled.value = true;
-  } else {
-    const { data, code, msg } = await getHandleData([...tableData.value]);
-    if (code == "200") {
-      ElMessage.success(msg);
-      tableData.value = data.list;
-      showData.value = { ...data, list: null };
-      setChart1();
-      setChart2();
-      oldDataJSON.value = JSON.stringify(data.list);
-    }
-    disabled.value = false;
-  }
-};
-const cancelEdit = () => {
-  tableData.value = JSON.parse(oldDataJSON.value);
-  disabled.value = false;
-};
 const maxHeight = ref(null);
 const maxWidth = ref(null);
 const charts1 = shallowRef(null);
@@ -917,78 +622,11 @@ const setX2array = () => {
   X2array.value.push("");
   chartsOption2.value.xAxis[0].data = X2array.value;
 };
-//当新增或者编辑的确定操作
-const submit = () => {
-  if (editStatus.value == true) {
-    updateSubmit();
-  } else {
-    addSubmit();
-  }
-};
-const addSubmit = async () => {
-  await ruleFormRef.value.validate(async (valid, fields) => {
-    if (valid) {
-      const { data, code } = await addDatas({
-        ...addData.value,
-        yearStr: year.value,
-        operation: lableValue.value,
-      });
-      if (code == "200") {
-        ElMessage.success("添加成功！");
-        reset();
-        // getTableData();
-      }
-    } else {
-      ElMessage.error("请检查表单信息");
-    }
-  });
-};
-const deleteSubmit = async (id) => {
-  const { data, code } = await deleteData({
-    id,
-  });
-  if (code == "200") {
-    ElMessage.success("删除成功！");
-    // getTableData();
-  }
-};
-const updateSubmit = async () => {
-  const { data, code } = await updateData({
-    ...addData.value,
-  });
-  if (code == "200") {
-    ElMessage.success("更新成功！");
-    reset();
-    // getTableData();
-  }
-};
-const reset = () => {
-  addStatus.value = false;
-  editStatus.value = false;
-  addData.value = { ...resItem };
-  searchRef.value.searchForm = {};
-  currentOption.value = {
-    total: 0,
-    page: 0,
-    limit: 12,
-    pageSizes: [12],
-    operation: value.value,
-  };
-  // getTableData();
-};
-const setView = () => {
-  setHeight();
-  charts1.value = echarts.init(document.getElementById("charts"));
-  charts2.value = echarts.init(document.getElementById("charts1"));
-  charts1.value.setOption(chartsOption1.value, true);
-  charts2.value.setOption(chartsOption2.value, true);
-};
 
 // 父组件的数据
 const chart = ref(value2);
 
 onMounted(async () => {
-  getTaskOption();
   setHeight();
   year.value = new Date().getFullYear() + "";
   opOptions.value.forEach((item) => {
@@ -996,17 +634,8 @@ onMounted(async () => {
       lableValue.value = item.dictValue;
     }
   });
-
-  // await getTableData();
   value2.value = "Xbar-R";
-  // await changeSelect2();
-  // nextTick(() => {
-  //   charts1.value = echarts.init(document.getElementById("charts"));
-  //   charts2.value = echarts.init(document.getElementById("charts1"));
-  //   charts1.value.setOption(chartsOption1.value, true);
-  //   charts2.value.setOption(chartsOption2.value, true);
-  // });
-  // window.addEventListener("resize", setView);
+  xbarrListRef.value.init(lableValue.value);
 });
 onBeforeUnmount(() => {
   // window.removeEventListener("resize", setView);
@@ -1039,15 +668,16 @@ onBeforeUnmount(() => {
   background-color: white;
 
   .infobox {
-    width: 200px;
+    width: 230px;
 
     .header {
-      height: 120px;
-      border-bottom: 2px solid #00000010;
+      //height: 120px;
+      //border-bottom: 2px solid #00000010;
       padding: 20px;
     }
 
     .body {
+      border-top: 2px solid #00000010;
       padding: 20px;
     }
   }
@@ -1057,7 +687,7 @@ onBeforeUnmount(() => {
     border-left: 2px solid #00000010;
 
     .box {
-      height: 710px;
+      height: 810px;
       padding: 5px 20px;
       display: flex;
       flex-direction: column;

src/views/analysis/spc/index.vue

@@ -26,7 +26,7 @@
         <el-table-column prop="prodtModel" label="产品型号" />
         <el-table-column prop="operationName" label="工序名称" />
         <el-table-column prop="source" label="采集数据源" />
-        <el-table-column prop="param" label="控制参数" />
+<!--        <el-table-column prop="param" label="控制参数" />-->
         <el-table-column prop="chart" label="控制图" />
         <el-table-column prop="address" label="预警规则">
           <template #default="{ row }">
@@ -41,9 +41,9 @@
           </template>
         </el-table-column>
         <el-table-column prop="processCount" label="工序采集点数" />
-        <el-table-column prop="centralValue" label="中心值" />
-        <el-table-column prop="upperLimit" label="上限" />
-        <el-table-column prop="floor" label="下限" />
+<!--        <el-table-column prop="centralValue" label="中心值" />-->
+<!--        <el-table-column prop="upperLimit" label="上限" />-->
+<!--        <el-table-column prop="floor" label="下限" />-->
         <el-table-column prop="created" label="创建时间" />
         <el-table-column
           align="center"
@@ -123,9 +123,9 @@
               <el-option label="手动" value="手动" />
             </el-select>
           </el-form-item>
-          <el-form-item label="控制参数" prop="param">
-            <el-input v-model="formData.param" />
-          </el-form-item>
+<!--          <el-form-item label="控制参数" prop="param">-->
+<!--            <el-input v-model="formData.param" />-->
+<!--          </el-form-item>-->
           <el-form-item label="控制图" prop="chart">
             <el-input :disabled="true" v-model="formData.chart" />
           </el-form-item>
@@ -136,19 +136,19 @@
               :step="1"
             />
           </el-form-item>
-          <el-form-item label="上限" prop="upperLimit">
-            <el-input-number v-model="formData.upperLimit" />
-          </el-form-item>
-          <el-form-item label="下限" prop="floor">
-            <el-input-number v-model="formData.floor" />
-          </el-form-item>
-          <el-form-item label="中心值" prop="centralValue">
-            <el-input-number
-              :min="formData.floor"
-              :max="formData.upperLimit"
-              v-model="formData.centralValue"
-            />
-          </el-form-item>
+<!--          <el-form-item label="上限" prop="upperLimit">-->
+<!--            <el-input-number v-model="formData.upperLimit" />-->
+<!--          </el-form-item>-->
+<!--          <el-form-item label="下限" prop="floor">-->
+<!--            <el-input-number v-model="formData.floor" />-->
+<!--          </el-form-item>-->
+<!--          <el-form-item label="中心值" prop="centralValue">-->
+<!--            <el-input-number-->
+<!--              :min="formData.floor"-->
+<!--              :max="formData.upperLimit"-->
+<!--              v-model="formData.centralValue"-->
+<!--            />-->
+<!--          </el-form-item>-->
         </el-form>
         <div style="display: flex; justify-content: space-evenly">
           <el-button

src/views/analysis/target/index/index.vue

@@ -19,14 +19,14 @@
       </div>
       <div class="body">
         <div class="text">
-          规格上限：{{ value ? JSON.parse(value).up : "-" }}
+          上限：{{ value ? JSON.parse(value).up : "-" }}
         </div>
         <div class="text">
-          规格下限：{{ value ? JSON.parse(value).down : "-" }}
-        </div>
-        <div class="text">
-          计量单位：{{ value ? JSON.parse(value).unit : "-" }}
+          下限：{{ value ? JSON.parse(value).down : "-" }}
         </div>
+<!--        <div class="text">-->
+<!--          计量单位：{{ value ? JSON.parse(value).unit : "-" }}-->
+<!--        </div>-->
       </div>
     </div>
     <div class="databox">
@@ -53,23 +53,15 @@
                 @click="changeEditstatus"
                 >编辑</el-button
               > -->
-              <el-button
-                v-if="!addStatus && !editStatus"
-                type="primary"
-                class="btn"
-                @click="updataItem(row.Index)"
-                size="small"
-                >计算Cpk</el-button
-              >
-              <el-button
-                v-if="!addStatus && !editStatus"
-                type="primary"
-                class="btn"
-                v-print="'#print'"
-                @click="printFnc"
-                size="small"
-                >打印</el-button
-              >
+              <!--              <el-button-->
+              <!--                v-if="!addStatus && !editStatus"-->
+              <!--                type="primary"-->
+              <!--                class="btn"-->
+              <!--                v-print="'#print'"-->
+              <!--                @click="printFnc"-->
+              <!--                size="small"-->
+              <!--                >打印</el-button-->
+              <!--              >-->
               <el-button
                 v-if="!addStatus && !editStatus"
                 type="primary"
@@ -161,7 +153,6 @@
               >
                 <el-table-column
                   align="center"
-                  width="100"
                   prop="dateStr"
                   sortable
                   label="日期"
@@ -170,19 +161,13 @@
                     ><span>{{ row.dateStr }}</span>
                   </template>
                 </el-table-column>
-                <el-table-column
-                  align="center"
-                  width="110"
-                  prop="model"
-                  label="产品型号"
-                >
+                <el-table-column align="center" prop="model" label="产品型号">
                   <template #default="{ row }"
                     ><span>{{ row.model }}</span>
                   </template>
                 </el-table-column>
                 <el-table-column
                   align="center"
-                  width="100"
                   prop="batchNo"
                   label="生产批号"
                 >
@@ -191,7 +176,6 @@
                   </template>
                 </el-table-column>
                 <el-table-column
-                  width="100"
                   align="center"
                   prop="accuracys"
                   label="数据"
@@ -213,7 +197,7 @@
                     </el-tooltip>
                   </template>
                 </el-table-column>
-<!--                <el-table-column
+                <!--                <el-table-column
                   width="100"
                   align="center"
                   prop="accuracys"
@@ -225,7 +209,7 @@
                     </div>
                   </template>
                 </el-table-column>-->
-                <!--                <el-table-column
+                <!--                                <el-table-column
                   align="center"
                   prop="Cpk"
                   label="Cpk值"
@@ -235,12 +219,7 @@
                     ><span>{{ Number(row.cpk).toFixed(2) }}</span>
                   </template>
                 </el-table-column>-->
-                <el-table-column
-                  align="center"
-                  width="70"
-                  prop="checkUser"
-                  label="检测人"
-                >
+<!--                <el-table-column align="center" prop="checkUser" label="检测人">
                   <template #default="{ row }"
                     ><span>{{ row.checkUser }}</span>
                   </template> </el-table-column
@@ -252,8 +231,8 @@
                   <template #default="{ row }"
                     ><span>{{ row.checkDeviceNo }}</span>
                   </template>
-                </el-table-column>
-                <el-table-column
+                </el-table-column>-->
+<!--                <el-table-column
                   align="center"
                   prop="abnormal"
                   width="60"
@@ -276,7 +255,7 @@
                   <template #default="{ row }"
                     ><span>{{ row.measure }}</span>
                   </template>
-                </el-table-column>
+                </el-table-column>-->
                 <el-table-column align="center" prop="remark" label="备注">
                   <template #default="{ row }"
                     ><span>{{ row.remark }}</span>
@@ -293,6 +272,13 @@
                     <el-button
                       type="primary"
                       class="btn"
+                      @click="computeCPK(row.id)"
+                      style="height: 25px"
+                      >计算Cpk</el-button
+                    >
+                    <el-button
+                      type="primary"
+                      class="btn"
                       @click="updataItem(row.Index)"
                       style="height: 25px"
                       >修改</el-button
@@ -462,7 +448,7 @@
                     ><span>{{ Number(row.cpk).toFixed(2) }}</span>
                   </template>
                 </el-table-column>
-                <el-table-column
+<!--                <el-table-column
                   align="center"
                   width="60"
                   prop="checkUser"
@@ -480,7 +466,7 @@
                   <template #default="{ row }"
                     ><span>{{ row.checkDeviceNo }}</span>
                   </template>
-                </el-table-column>
+                </el-table-column>-->
                 <el-table-column
                   align="center"
                   prop="abnormal"
@@ -522,12 +508,12 @@
                   </template>
                 </el-table-column>
               </el-table>
-              <div class="illustrate">
-                <div>
-                  1）Cpx值为表征内引线键合强度一致性的参数，通过相应的软件计算得出，内引线键合强度一致性是否符合要求的判据：Cpk值≥1.33。
-                </div>
-                <div>2）“备注”栏填写被测内引线的材料和规格。</div>
-              </div>
+              <!--              <div class="illustrate">-->
+              <!--                <div>-->
+              <!--                  1）Cpk值为表征内引线键合强度一致性的参数，通过相应的软件计算得出，内引线键合强度一致性是否符合要求的判据：Cpk值≥1.33。-->
+              <!--                </div>-->
+              <!--                <div>2）“备注”栏填写被测内引线的材料和规格。</div>-->
+              <!--              </div>-->
             </div>
             <Pagination
               :total="currentOption.total"
@@ -856,13 +842,13 @@
               <el-form-item label="极差" prop="range">
                 <el-input v-model="addData.range" />
               </el-form-item> -->
-                <el-form-item label="检测人" prop="checkUser">
+<!--                <el-form-item label="检测人" prop="checkUser">
                   <el-input v-model="addData.checkUser" />
                 </el-form-item>
                 <el-form-item label="检查设备编号" prop="checkDeviceNo">
                   <el-input v-model="addData.checkDeviceNo" />
-                </el-form-item>
-                <el-form-item label="是否异常" prop="abnormal">
+                </el-form-item>-->
+<!--                <el-form-item label="是否异常" prop="abnormal">
                   <el-input v-model="addData.abnormal" />
                 </el-form-item>
                 <el-form-item label="分析人" prop="analyseUser">
@@ -870,7 +856,7 @@
                 </el-form-item>
                 <el-form-item label="处置措施" prop="measure">
                   <el-input v-model="addData.measure" />
-                </el-form-item>
+                </el-form-item>-->
                 <el-form-item label="备注" prop="remark">
                   <el-input
                     maxlength="40"
@@ -921,8 +907,60 @@ import {
   deleteData,
   updateData,
   getTaskCode,
+  cpkCompute,
 } from "@/api/analysis";
 import Search from "@/components/Search/index.vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+
+// 模拟后台接口
+const cpkApi = async (id) => {
+  const { data } = await cpkCompute({
+    spcRecordId: id,
+  });
+
+  return data;
+};
+
+const computeCPK = async (id) => {
+  try {
+    // 显示加载中的提示
+    ElMessageBox.alert("计算中...", "提示", {
+      confirmButtonText: "确定",
+      showClose: false,
+      closeOnClickModal: false,
+      closeOnPressEscape: false,
+    });
+
+    // 调用后台接口
+    const response = await cpkApi(id);
+
+    // 关闭加载中的提示
+    ElMessageBox.close();
+
+    const result = ref("");
+    if ("error" in response.data) {
+      result.value = response.data.error;
+    } else {
+      const { product, batch, process, cpk, status } = response.data;
+      result.value = `产品: ${product}<br>
+      批次: ${batch}<br>
+      工序: ${process}<br>
+      CPK: ${cpk}<br>
+      评级: ${status}`;
+    }
+
+    // 显示计算结果
+    ElMessageBox.alert(result.value, "计算结果", {
+      confirmButtonText: "确定",
+      dangerouslyUseHTMLString: true,
+    });
+  } catch (error) {
+    // 处理错误
+    ElMessageBox.close();
+    ElMessage.error("计算失败，请重试");
+  }
+};
+
 const tableData = ref([]);
 const printStatus = ref(false);
 const printLoading = ref(false);