提交

src/views/wisdom/outbound/index.vue

@@ -563,6 +563,20 @@
             </el-form-item>
           </el-col>
         </el-row>
+        <div class="addOutBoundBox">
+          <div style="display: flex;align-items: center;">
+            <div class="addOutBound" @click="addOutBoundData">
+              <el-icon style="margin-right: 10px;" size="20"><FolderAdd /></el-icon>
+              添加至出库
+            </div>
+            <div @click="viewOutBoundData" style="color: #000;text-decoration: underline;margin-left: 5px;">[已添加{{ outBoundData.length }}条库存]</div>
+            <div @click="viewOutBoundData" style="color: red;text-decoration: underline;font-weight: bold;">[凭证重复出库或项目已关闭，请点击查看！]</div>
+          </div>
+          <div v-show="outBoundData.length > 0 && planList.length === outBoundData.length" @click="deleteOutBoundData" style="display: flex;align-items: center;color: var(--el-color-primary);">
+            <el-icon><delete /></el-icon>
+            <span>删除</span>
+          </div>
+        </div>
         <!-- <el-row :gutter="20">
           <el-col :span="6">
             <el-form-item label="项目号" >
@@ -578,6 +592,7 @@
       </el-form>
       <el-table
         :data="planList"
+        ref="addTableRef"
         height="400"
         border
         show-overflow-tooltip
@@ -937,6 +952,7 @@ import { getToken } from "@/utils/auth";
 import bill from "@/components/storageBill/bill.vue";
 import printBill from "@/components/printBill/bill.vue";
 import { ref } from "vue";
+import { pl } from "element-plus/es/locales.mjs";
 
 const headers = ref({
   Authorization: "Bearer " + getToken(),
@@ -1124,6 +1140,7 @@ const outQueryParams = ref({
 });
 //查询库存中数据 搜索
 const planList = ref([]);
+const addTableRef = ref(null);
 function searchPlan() {
   if (outQueryParams.value.cangku.length > 0) {
     outQueryParams.value.cangku = outQueryParams.value.cangku[1];
@@ -1144,15 +1161,64 @@ function handleSelectionChange(selection) {
   checkOutList.value = selection;
 }
 
+// 点击添加至出库
+const outBoundData = ref([]);
+function addOutBoundData() {
+  if (checkOutList.value.length == 0) {
+    proxy.$modal.msgError("请勾选数据");
+    return;
+  }
+  let data = outBoundData.value.concat(checkOutList.value);
+  const map = new Map();
+  // 遍历数组，Map的键为id值，值为数组元素，自动覆盖重复键
+  data.forEach(item => map.set(item.id, item));
+  // 把Map的值转为数组（保留最后一次出现的重复项）
+  outBoundData.value = Array.from(map.values());
+}
+
+// 查看所有的出库数据
+const viewOutBoundData = () => {
+  planList.value = JSON.parse(JSON.stringify(outBoundData.value));
+  console.log(addTableRef.value)
+  // nextTick(() => {
+  //   planList.value.forEach(item => {
+  //     addTableRef.value.toggleRowSelection(item, true)
+  //   })
+  // })
+  // checkOutList.value = planList.value
+}
+
+// 删除选中的出库数据
+const deleteOutBoundData = () => {
+  if (checkOutList.value.length == 0) {
+    proxy.$modal.msgError("请勾选数据");
+    return;
+  }
+  proxy.$modal.confirm("确认删除选中的出库数据吗？").then(() => {
+    const ids = checkOutList.value.map(item => item.id);
+    console.log(ids)
+    planList.value = planList.value.filter(item => {
+        // 无id的元素默认保留（如果想删除无id的，可改为 item?.id && !arr2Ids.has(item.id)）
+        return !ids.includes(item?.id);
+    });
+    outBoundData.value = planList.value
+  });
+}
+ 
 /** 新增按钮操作 */
 function handleAdd() {
   reset();
   open.value = true;
+  outBoundData.value = [];
   title.value = "添加出库单据";
 }
 
 /** 提交按钮 */
 function submitForm() {
+  if (outBoundData.value.length !== checkOutList.value) {
+    proxy.$modal.msgError("请查看勾选数据");
+    return;
+  }
   proxy.$refs["stockRef"].validate((valid) => {
     if (valid) {
       if (checkOutList.value.length == 0) {
@@ -1555,33 +1621,24 @@ function submitDispatch() {
   });
 }
 </script>
-<style scoped>
+<style scoped lang="scss">
 .printMeBox {
   div {
     line-height: 30px;
   }
 }
-.titleBox {
-  text-align: center;
-  margin-bottom: 20px;
-}
-.topBox {
+.addOutBoundBox{
   display: flex;
-  flex-wrap: wrap;
-}
-.topEveryBox {
-  width: 50%;
-}
-.tableBox {
-  margin-top: 10px;
-}
-.oneLineBox {
-  display: flex;
-}
-.everyBox {
-  width: 25%;
-}
-.bottomBox {
-  margin-top: 10px;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 10px;
+  cursor: pointer;
+  .addOutBound {
+    display: flex;
+    align-items: center;
+    color: var(--el-text-color-regular);
+    font-weight: bold;
+  }
+
 }
 </style>