数据采集页面准备

src/views/pro-steps/components/screwdriver.vue

@@ -14,14 +14,16 @@
           ></span
           >&nbsp; &nbsp;
           <span
-            @click.stop="aa"
+            @click.stop="
+              addItem(item.deviceNo, item.deviceName, item.deviceType, index)
+            "
             class="opear"
             style="font-size: 18px; color: rgb(10, 89, 247); font-weight: 600"
             >新增数据</span
           >
         </template>
         <el-table :data="tableData[index]" border>
-          <el-table-column prop="deviceNo" label="设备编号">
+          <!-- <el-table-column prop="deviceNo" label="设备编号">
             <template #default="scope" v-if="!item.updateStatus">
               {{ scope.row.deviceNo }}
             </template>
@@ -44,29 +46,43 @@
             <template #default v-else>
               <el-input v-model="tableData[index].created" />
             </template>
-          </el-table-column>
-          <!-- <template v-if="tableData[index][0].length > 0">
-            <template v-if="tableData[index][0].data != null">
-              <template
-                v-for="(value, key) in tableData[index][0].data"
-                :key="key"
-              >
-                <el-table-column :prop="key" :label="key">
-                  <template #default v-if="!item.updateStatus">
-                    {{ value }}
-                  </template>
-                  <template #default v-else>
-                    <el-input v-model="tableData[index].created" />
-                  </template>
-                </el-table-column>
-              </template>
+          </el-table-column> -->
+          <el-table-column
+            v-for="str in configeObj()"
+            :key="str"
+            :prop="str"
+            :label="showLable(str)"
+          >
+            <template #default="{ row }">
+              <div v-if="!row.updateStatus">
+                {{ row.data[str] }}
+              </div>
+              <div v-else>
+                <el-input v-model="tableData[index][row.index].data[str]" />
+              </div>
             </template>
-          </template> -->
+          </el-table-column>
+
           <el-table-column label="操作">
             <template #default="scope">
-              <!-- <span class="opear">完成</span> -->
-              <span class="opear">删除</span>
-              <!-- <span class="opear">取消</span> -->
+              <span
+                class="opear"
+                v-if="scope.row.updateStatus"
+                @click="toSuccess(index, scope.$index)"
+                >完成</span
+              >
+              <span class="opear" v-else @click="toDelete(index, scope.$index)"
+                >删除</span
+              >
+              <span
+                class="opear"
+                v-if="scope.row.updateStatus"
+                @click="toCancel(index, scope.$index)"
+                >取消</span
+              >
+              <span class="opear" v-else @click="toEdit(index, scope.$index)"
+                >编辑</span
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -93,7 +109,40 @@ const dictS = useDictionaryStore();
 const store = useProcessStore();
 const tableData = ref([]);
 const materialsData = ref([]);
+const showLable = (key) => {
+  switch (key) {
+    case "CH5Val":
+      return "CH5";
+    case "CH6Val":
+      return "CH6";
+    case "DataTimes":
+      return "采集时间";
+    default:
+      return key;
+  }
+};
+const toEdit = (index, rowIndex) => {
+  tableData.value[index][rowIndex].updateStatus = true;
+};
 
+const configeObj = () => {
+  return ["CH5Val", "CH6Val", "DataTimes"];
+};
+const addItem = (name, no, type, index) => {
+  let data = {};
+  switch (type) {
+    case "WXDJC":
+      data = { CH5Val: "", CH6Val: "", DataTimes: "" };
+      break;
+  }
+  tableData.value[index].push({
+    deviceNo: no,
+    deviceName: name,
+    deviceType: type,
+    data: data,
+    index: tableData.value[index].length,
+  });
+};
 const getData = async () => {
   const res = await getScrewdriverData();
   materialsData.value = res.data;
@@ -112,14 +161,13 @@ const getAcquisitionDatas = async (No, index) => {
     processId: store.scanInfo.id,
   });
   pageS.value[index].total = res.data.totalCount;
-  // res.data.records.forEach((item) => {
-  //   item.data = JSON.parse(item.data);
-  // });
+  res.data.records.forEach((item, index) => {
+    item.data = JSON.parse(item.data);
+    item.updateStatus = false;
+    item.index = index;
+  });
   tableData.value.push(res.data.records);
 };
-const aa = () => {
-  console.log("111");
-};
 const pageS = ref([]);
 const page = {
   pageSize: 10,
@@ -159,6 +207,7 @@ onMounted(async () => {
 .opear {
   font-size: 16px;
   margin-right: 5px;
+  cursor: pointer;
 }
 .round {
   width: 20px;