PHP와 Vue를 사용하여 창고 관리의 아웃바운드 관리 기능을 개발하는 방법

PHP 및 Vue를 사용하여 창고 관리의 아웃바운드 관리 기능을 개발하는 방법

전자 상거래 비즈니스의 급속한 발전으로 창고 관리 시스템은 많은 회사의 일상 운영에 없어서는 안될 부분이 되었습니다. 그 중 아웃바운드 관리 기능은 창고 관리의 중요한 링크 중 하나입니다. 이 기사에서는 PHP와 Vue를 사용하여 간단하고 실용적인 아웃바운드 관리 기능을 개발하는 방법을 소개하고 구체적인 코드 예제를 제공합니다.

1. 아웃바운드 관리 기능 요구사항 분석

개발을 시작하기 전에 아웃바운드 관리 기능에 대한 요구사항을 명확히 해야 합니다. 일반적으로 아웃바운드 관리 기능에는 다음 측면이 포함되어야 합니다.

1. 아웃바운드 주문 관리: 아웃바운드 주문의 생성, 쿼리, 편집, 삭제 및 기타 기능을 포함합니다.
2. 출고 관리: 출고 품목 선택, 출고 수량 설정, 출고 내역 조회 등의 기능을 포함합니다.
3. 출고 기록 관리: 품목 정보, 수량, 시간 등 각 출고 발송물의 관련 정보를 기록합니다.

2. 기술 선택

아웃바운드 관리 기능을 구현하기 위해 백엔드 개발 언어로 PHP를 사용하고 프런트엔드 개발 프레임워크로 Vue를 사용하기로 결정했습니다.

PHP는 배우고 사용하기 쉽고 다양한 응용 프로그램을 갖춘 스크립트 언어입니다. Vue는 대화형 사용자 인터페이스를 구축하는 데 도움이 되는 경량 JavaScript 프레임워크입니다.

3. 데이터베이스 설계

코드 작성을 시작하기 전에 아웃바운드 배송과 관련된 정보를 저장할 데이터베이스 테이블을 설계해야 합니다. 다음은 간단한 예시입니다.

1. 아웃바운드 주문 테이블(stock_out)

   • id: 아웃바운드 주문 ID
   • out_date: 아웃바운드 날짜
   • operator: 연산자

2. 아웃바운드 품목 테이블( stock_out_items)

   • id: 출고 품목 ID
   • out_id: 출고 주문 ID
   • item_name: 품목 이름
   • item_qty: 출고 수량

IV. 백엔드 코드 구현

먼저 "stock_out.php"라는 A 파일을 생성합니다. 이는 품절 관리와 관련된 백엔드 로직을 처리합니다.

<?php

// 连接数据库
$conn = new mysqli("localhost", "username", "password", "database");

// 检查连接是否成功
if ($conn->connect_error) {
  die("数据库连接失败: " . $conn->connect_error);
}

// 获取出库单列表
function getStockOutList() {
  global $conn;
  $sql = "SELECT * FROM stock_out";
  $result = $conn->query($sql);
  
  if ($result->num_rows > 0) {
    $output = array();
    while($row = $result->fetch_assoc()) {
      $output[] = $row;
    }
    return $output;
  } else {
    return array();
  }
}

// 创建出库单
function createStockOut($out_date, $operator) {
  global $conn;
  $sql = "INSERT INTO stock_out (out_date, operator) VALUES ('$out_date', '$operator')";
  
  if ($conn->query($sql) === TRUE) {
    return true;
  } else {
    return false;
  }
}

// 删除出库单
function deleteStockOut($id) {
  global $conn;
  $sql = "DELETE FROM stock_out WHERE id = '$id'";
  
  if ($conn->query($sql) === TRUE) {
    return true;
  } else {
    return false;
  }
}

// 获取出库物品列表
function getStockOutItems($out_id) {
  global $conn;
  $sql = "SELECT * FROM stock_out_items WHERE out_id = '$out_id'";
  $result = $conn->query($sql);
  
  if ($result->num_rows > 0) {
    $output = array();
    while($row = $result->fetch_assoc()) {
      $output[] = $row;
    }
    return $output;
  } else {
    return array();
  }
}

// 创建出库物品
function createStockOutItem($out_id, $item_name, $item_qty) {
  global $conn;
  $sql = "INSERT INTO stock_out_items (out_id, item_name, item_qty) VALUES ('$out_id', '$item_name', '$item_qty')";
  
  if ($conn->query($sql) === TRUE) {
    return true;
  } else {
    return false;
  }
}

// 删除出库物品
function deleteStockOutItem($id) {
  global $conn;
  $sql = "DELETE FROM stock_out_items WHERE id = '$id'";
  
  if ($conn->query($sql) === TRUE) {
    return true;
  } else {
    return false;
  }
}

5. 프론트엔드 코드 구현

프론트엔드 코드에서는 Vue 프레임워크를 사용하여 아웃바운드 관리 기능의 상호작용 로직을 처리합니다. 다음은 간단한 예시입니다:

<div id="app">
  <h2>出库单管理</h2>
  
  <div v-for="stockOut in stockOutList">
    <p>出库单ID: {{ stockOut.id }}</p>
    <p>出库日期: {{ stockOut.out_date }}</p>
    <p>操作人员: {{ stockOut.operator }}</p>
    
    <button @click="deleteStockOut(stockOut.id)">删除</button>
  </div>
  
  <h2>出库物品管理</h2>
  
  <div>
    <input type="text" v-model="item.name" placeholder="物品名称">
    <input type="number" v-model="item.qty" placeholder="出库数量">
    <button @click="createStockOutItem">添加</button>
  </div>
  
  <div v-for="item in stockOutItems">
    <p>物品名称: {{ item.item_name }}</p>
    <p>出库数量: {{ item.item_qty }}</p>
    
    <button @click="deleteStockOutItem(item.id)">删除</button>
  </div>
</div>

<script>
  new Vue({
    el: "#app",
    data: {
      stockOutList: [],
      stockOutItems: [],
      item: {
        name: "",
        qty: 0
      }
    },
    mounted() {
      // 获取出库单列表
      this.getStockOutList();
    },
    methods: {
      // 获取出库单列表
      getStockOutList() {
        axios.get("stock_out.php?action=getStockOutList")
          .then(response => {
            this.stockOutList = response.data;
          })
          .catch(error => {
            console.error(error);
          });
      },
      
      // 删除出库单
      deleteStockOut(id) {
        axios.get(`stock_out.php?action=deleteStockOut&id=${id}`)
          .then(response => {
            if (response.data === true) {
              this.getStockOutList();
              alert("删除成功");
            } else {
              alert("删除失败");
            }
          })
          .catch(error => {
            console.error(error);
          });
      },
      
      // 添加出库物品
      createStockOutItem() {
        axios.post("stock_out.php?action=createStockOutItem", this.item)
          .then(response => {
            if (response.data === true) {
              this.getStockOutItems();
              alert("添加成功");
            } else {
              alert("添加失败");
            }
          })
          .catch(error => {
            console.error(error);
          });
      },
      
      // 删除出库物品
      deleteStockOutItem(id) {
        axios.get(`stock_out.php?action=deleteStockOutItem&id=${id}`)
          .then(response => {
            if (response.data === true) {
              this.getStockOutItems();
              alert("删除成功");
            } else {
              alert("删除成功");
            }
          })
          .catch(error => {
            console.error(error);
          });
      }
    }
  });
</script>

6. 요약

위는 PHP 및 Vue를 사용하여 창고 관리의 아웃바운드 관리 기능을 개발하기 위한 세부 단계 및 구체적인 코드 예시입니다. 이러한 방식으로 아웃바운드 주문과 아웃바운드 품목을 쉽게 관리할 수 있어 창고 관리의 효율성과 정확성이 향상됩니다. 이 기사가 도움이 되기를 바랍니다.

위 내용은 PHP와 Vue를 사용하여 창고 관리의 아웃바운드 관리 기능을 개발하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!