=人类驯服人工智能实录

以下是基于 Spring BootVue 的详细代码实现,涵盖后端 API 和前端界面设计。我们将分模块实现需求,并确保代码简洁、功能完整。


1. 后端 Spring Boot 实现

1.1 项目结构

src
├── main
│   ├── java
│   │   └── com
│   │       └── warehouse
│   │           ├── controller
│   │           ├── service
│   │           ├── repository
│   │           ├── model
│   │           └── WarehouseApplication.java
│   └── resources
│       ├── application.properties
│       └── data.sql
└── test

1.2 数据库配置 (application.properties)

spring.datasource.url=jdbc:mysql://localhost:3306/warehouse_db
spring.datasource.username=root
spring.datasource.password=password
spring.jpa.hibernate.ddl-auto=update
spring.jpa.show-sql=true

1.3 实体类 (model 包)

仓库表实体 (Warehouse.java)

package com.warehouse.model;

import jakarta.persistence.*;
import java.util.Date;

@Entity
public class Warehouse {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long WarehouseID;

    private String WarehouseName;
    private String Location;
    private Integer Capacity;
    private Date CreatedDate;

    // Getters and Setters
}

物资类别表实体 (MaterialCategory.java)

package com.warehouse.model;

import jakarta.persistence.*;

@Entity
public class MaterialCategory {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long CategoryID;

    private String CategoryName;
    private String MaterialCode;
    private String MaterialName;
    private String Specification;
    private String Material;

    // Getters and Setters
}

物资台账明细表实体 (MaterialLedger.java)

package com.warehouse.model;

import jakarta.persistence.*;
import java.util.Date;

@Entity
public class MaterialLedger {
    @Id
    private String LedgerID;

    private String MaterialCode;
    private String MaterialName;
    private String Specification;
    private String MaterialType;
    private String Supplier;
    private String Brand;
    private Integer Quantity;
    private String Unit;
    private Long WarehouseID;
    private String OperationType;
    private Date OperationDate;

    // Getters and Setters
}

1.4 仓库管理模块 (controllerservice 包)

仓库服务接口 (WarehouseService.java)

package com.warehouse.service;

import com.warehouse.model.Warehouse;
import java.util.List;

public interface WarehouseService {
    Warehouse addWarehouse(Warehouse warehouse);
    void deleteWarehouse(Long warehouseID);
    Warehouse updateWarehouse(Long warehouseID, Warehouse warehouse);
    List<Warehouse> getAllWarehouses();
}

仓库服务实现 (WarehouseServiceImpl.java)

package com.warehouse.service;

import com.warehouse.model.Warehouse;
import com.warehouse.repository.WarehouseRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class WarehouseServiceImpl implements WarehouseService {
    @Autowired
    private WarehouseRepository warehouseRepository;

    @Override
    public Warehouse addWarehouse(Warehouse warehouse) {
        return warehouseRepository.save(warehouse);
    }

    @Override
    public void deleteWarehouse(Long warehouseID) {
        warehouseRepository.deleteById(warehouseID);
    }

    @Override
    public Warehouse updateWarehouse(Long warehouseID, Warehouse warehouse) {
        warehouse.setWarehouseID(warehouseID);
        return warehouseRepository.save(warehouse);
    }

    @Override
    public List<Warehouse> getAllWarehouses() {
        return warehouseRepository.findAll();
    }
}

仓库控制器 (WarehouseController.java)

package com.warehouse.controller;

import com.warehouse.model.Warehouse;
import com.warehouse.service.WarehouseService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@RequestMapping("/api/warehouses")
public class WarehouseController {
    @Autowired
    private WarehouseService warehouseService;

    @PostMapping
    public Warehouse addWarehouse(@RequestBody Warehouse warehouse) {
        return warehouseService.addWarehouse(warehouse);
    }

    @DeleteMapping("/{id}")
    public void deleteWarehouse(@PathVariable Long id) {
        warehouseService.deleteWarehouse(id);
    }

    @PutMapping("/{id}")
    public Warehouse updateWarehouse(@PathVariable Long id, @RequestBody Warehouse warehouse) {
        return warehouseService.updateWarehouse(id, warehouse);
    }

    @GetMapping
    public List<Warehouse> getAllWarehouses() {
        return warehouseService.getAllWarehouses();
    }
}

2. 前端 Vue 实现

2.1 项目结构

src
├── assets
├── components
│   ├── WarehouseList.vue
│   ├── WarehouseForm.vue
├── views
│   ├── WarehouseView.vue
├── router
│   └── index.js
├── App.vue
└── main.js

2.2 仓库管理页面 (WarehouseView.vue)

<template>
  <div>
    <h1>仓库管理</h1>
    <WarehouseForm @add-warehouse="addWarehouse" />
    <WarehouseList :warehouses="warehouses" @delete-warehouse="deleteWarehouse" />
  </div>
</template>

<script>
import WarehouseForm from '@/components/WarehouseForm.vue';
import WarehouseList from '@/components/WarehouseList.vue';
import axios from 'axios';

export default {
  components: {
    WarehouseForm,
    WarehouseList,
  },
  data() {
    return {
      warehouses: [],
    };
  },
  created() {
    this.fetchWarehouses();
  },
  methods: {
    async fetchWarehouses() {
      const response = await axios.get('/api/warehouses');
      this.warehouses = response.data;
    },
    async addWarehouse(warehouse) {
      await axios.post('/api/warehouses', warehouse);
      this.fetchWarehouses();
    },
    async deleteWarehouse(id) {
      await axios.delete(`/api/warehouses/${id}`);
      this.fetchWarehouses();
    },
  },
};
</script>

2.3 仓库表单组件 (WarehouseForm.vue)

<template>
  <form @submit.prevent="submitForm">
    <input v-model="warehouse.WarehouseName" placeholder="仓库名称" required />
    <input v-model="warehouse.Location" placeholder="仓库位置" required />
    <input v-model="warehouse.Capacity" placeholder="仓库容量" type="number" required />
    <button type="submit">新增仓库</button>
  </form>
</template>

<script>
export default {
  data() {
    return {
      warehouse: {
        WarehouseName: '',
        Location: '',
        Capacity: null,
      },
    };
  },
  methods: {
    submitForm() {
      this.$emit('add-warehouse', this.warehouse);
      this.warehouse = { WarehouseName: '', Location: '', Capacity: null };
    },
  },
};
</script>

2.4 仓库列表组件 (WarehouseList.vue)

<template>
  <ul>
    <li v-for="warehouse in warehouses" :key="warehouse.WarehouseID">
      {{ warehouse.WarehouseName }} - {{ warehouse.Location }}
      <button @click="deleteWarehouse(warehouse.WarehouseID)">删除</button>
    </li>
  </ul>
</template>

<script>
export default {
  props: ['warehouses'],
  methods: {
    deleteWarehouse(id) {
      this.$emit('delete-warehouse', id);
    },
  },
};
</script>

以下是 物资管理模块 的详细代码实现,基于 Spring Boot 和 Vue。我们将按照类似仓库管理模块的方式扩展物资管理功能。


1. 后端 Spring Boot 实现

1.1 实体类 (model 包)

物资类别表实体 (MaterialCategory.java)

package com.warehouse.model;

import jakarta.persistence.*;

@Entity
public class MaterialCategory {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long CategoryID;

    private String CategoryName;
    private String MaterialCode;
    private String MaterialName;
    private String Specification;
    private String Material;

    // Getters and Setters
}

1.2 物资管理模块 (controllerservice 包)

物资服务接口 (MaterialCategoryService.java)

package com.warehouse.service;

import com.warehouse.model.MaterialCategory;
import java.util.List;

public interface MaterialCategoryService {
    MaterialCategory addMaterialCategory(MaterialCategory materialCategory);
    void deleteMaterialCategory(Long categoryID);
    MaterialCategory updateMaterialCategory(Long categoryID, MaterialCategory materialCategory);
    List<MaterialCategory> getAllMaterialCategories();
}

物资服务实现 (MaterialCategoryServiceImpl.java)

package com.warehouse.service;

import com.warehouse.model.MaterialCategory;
import com.warehouse.repository.MaterialCategoryRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class MaterialCategoryServiceImpl implements MaterialCategoryService {
    @Autowired
    private MaterialCategoryRepository materialCategoryRepository;

    @Override
    public MaterialCategory addMaterialCategory(MaterialCategory materialCategory) {
        return materialCategoryRepository.save(materialCategory);
    }

    @Override
    public void deleteMaterialCategory(Long categoryID) {
        materialCategoryRepository.deleteById(categoryID);
    }

    @Override
    public MaterialCategory updateMaterialCategory(Long categoryID, MaterialCategory materialCategory) {
        materialCategory.setCategoryID(categoryID);
        return materialCategoryRepository.save(materialCategory);
    }

    @Override
    public List<MaterialCategory> getAllMaterialCategories() {
        return materialCategoryRepository.findAll();
    }
}

物资控制器 (MaterialCategoryController.java)

package com.warehouse.controller;

import com.warehouse.model.MaterialCategory;
import com.warehouse.service.MaterialCategoryService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@RequestMapping("/api/material-categories")
public class MaterialCategoryController {
    @Autowired
    private MaterialCategoryService materialCategoryService;

    @PostMapping
    public MaterialCategory addMaterialCategory(@RequestBody MaterialCategory materialCategory) {
        return materialCategoryService.addMaterialCategory(materialCategory);
    }

    @DeleteMapping("/{id}")
    public void deleteMaterialCategory(@PathVariable Long id) {
        materialCategoryService.deleteMaterialCategory(id);
    }

    @PutMapping("/{id}")
    public MaterialCategory updateMaterialCategory(@PathVariable Long id, @RequestBody MaterialCategory materialCategory) {
        return materialCategoryService.updateMaterialCategory(id, materialCategory);
    }

    @GetMapping
    public List<MaterialCategory> getAllMaterialCategories() {
        return materialCategoryService.getAllMaterialCategories();
    }
}

2. 前端 Vue 实现

2.1 项目结构

src
├── assets
├── components
│   ├── MaterialCategoryList.vue
│   ├── MaterialCategoryForm.vue
├── views
│   ├── MaterialCategoryView.vue
├── router
│   └── index.js
├── App.vue
└── main.js

2.2 物资管理页面 (MaterialCategoryView.vue)

<template>
  <div>
    <h1>物资管理</h1>
    <MaterialCategoryForm @add-material-category="addMaterialCategory" />
    <MaterialCategoryList :materialCategories="materialCategories" @delete-material-category="deleteMaterialCategory" />
  </div>
</template>

<script>
import MaterialCategoryForm from '@/components/MaterialCategoryForm.vue';
import MaterialCategoryList from '@/components/MaterialCategoryList.vue';
import axios from 'axios';

export default {
  components: {
    MaterialCategoryForm,
    MaterialCategoryList,
  },
  data() {
    return {
      materialCategories: [],
    };
  },
  created() {
    this.fetchMaterialCategories();
  },
  methods: {
    async fetchMaterialCategories() {
      const response = await axios.get('/api/material-categories');
      this.materialCategories = response.data;
    },
    async addMaterialCategory(materialCategory) {
      await axios.post('/api/material-categories', materialCategory);
      this.fetchMaterialCategories();
    },
    async deleteMaterialCategory(id) {
      await axios.delete(`/api/material-categories/${id}`);
      this.fetchMaterialCategories();
    },
  },
};
</script>

2.3 物资表单组件 (MaterialCategoryForm.vue)

<template>
  <form @submit.prevent="submitForm">
    <input v-model="materialCategory.CategoryName" placeholder="类别名称" required />
    <input v-model="materialCategory.MaterialCode" placeholder="物资编码" required />
    <input v-model="materialCategory.MaterialName" placeholder="物资名称" required />
    <input v-model="materialCategory.Specification" placeholder="规格" required />
    <input v-model="materialCategory.Material" placeholder="材质" required />
    <button type="submit">新增物资类别</button>
  </form>
</template>

<script>
export default {
  data() {
    return {
      materialCategory: {
        CategoryName: '',
        MaterialCode: '',
        MaterialName: '',
        Specification: '',
        Material: '',
      },
    };
  },
  methods: {
    submitForm() {
      this.$emit('add-material-category', this.materialCategory);
      this.materialCategory = {
        CategoryName: '',
        MaterialCode: '',
        MaterialName: '',
        Specification: '',
        Material: '',
      };
    },
  },
};
</script>

2.4 物资列表组件 (MaterialCategoryList.vue)

<template>
  <ul>
    <li v-for="category in materialCategories" :key="category.CategoryID">
      {{ category.CategoryName }} - {{ category.MaterialCode }} - {{ category.MaterialName }}
      <button @click="deleteMaterialCategory(category.CategoryID)">删除</button>
    </li>
  </ul>
</template>

<script>
export default {
  props: ['materialCategories'],
  methods: {
    deleteMaterialCategory(id) {
      this.$emit('delete-material-category', id);
    },
  },
};
</script>

3. 路由配置 (router/index.js)

import Vue from 'vue';
import Router from 'vue-router';
import MaterialCategoryView from '@/views/MaterialCategoryView.vue';

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: '/material-categories',
      name: 'MaterialCategoryView',
      component: MaterialCategoryView,
    },
  ],
});

以下是 入库/出库模块 的详细代码实现,基于 Spring Boot 和 Vue。我们将按照类似仓库管理和物资管理模块的方式扩展入库/出库功能。


1. 后端 Spring Boot 实现

1.1 实体类 (model 包)

物资台账明细表实体 (MaterialLedger.java)

package com.warehouse.model;

import jakarta.persistence.*;
import java.util.Date;

@Entity
public class MaterialLedger {
    @Id
    private String LedgerID;

    private String MaterialCode;
    private String MaterialName;
    private String Specification;
    private String MaterialType;
    private String Supplier;
    private String Brand;
    private Integer Quantity;
    private String Unit;
    private Long WarehouseID;
    private String OperationType; // 入库或出库
    private Date OperationDate;

    // Getters and Setters
}

1.2 入库/出库模块 (controllerservice 包)

台账服务接口 (MaterialLedgerService.java)

package com.warehouse.service;

import com.warehouse.model.MaterialLedger;
import java.util.List;

public interface MaterialLedgerService {
    MaterialLedger addMaterialLedger(MaterialLedger materialLedger);
    List<MaterialLedger> getAllMaterialLedgers();
    List<MaterialLedger> getMaterialLedgersByMaterialCode(String materialCode);
    List<MaterialLedger> getMaterialLedgersByWarehouseID(Long warehouseID);
}

台账服务实现 (MaterialLedgerServiceImpl.java)

package com.warehouse.service;

import com.warehouse.model.MaterialLedger;
import com.warehouse.repository.MaterialLedgerRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class MaterialLedgerServiceImpl implements MaterialLedgerService {
    @Autowired
    private MaterialLedgerRepository materialLedgerRepository;

    @Override
    public MaterialLedger addMaterialLedger(MaterialLedger materialLedger) {
        return materialLedgerRepository.save(materialLedger);
    }

    @Override
    public List<MaterialLedger> getAllMaterialLedgers() {
        return materialLedgerRepository.findAll();
    }

    @Override
    public List<MaterialLedger> getMaterialLedgersByMaterialCode(String materialCode) {
        return materialLedgerRepository.findByMaterialCode(materialCode);
    }

    @Override
    public List<MaterialLedger> getMaterialLedgersByWarehouseID(Long warehouseID) {
        return materialLedgerRepository.findByWarehouseID(warehouseID);
    }
}

台账控制器 (MaterialLedgerController.java)

package com.warehouse.controller;

import com.warehouse.model.MaterialLedger;
import com.warehouse.service.MaterialLedgerService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;

import java.util.List;

@RestController
@RequestMapping("/api/material-ledgers")
public class MaterialLedgerController {
    @Autowired
    private MaterialLedgerService materialLedgerService;

    @PostMapping
    public MaterialLedger addMaterialLedger(@RequestBody MaterialLedger materialLedger) {
        return materialLedgerService.addMaterialLedger(materialLedger);
    }

    @GetMapping
    public List<MaterialLedger> getAllMaterialLedgers() {
        return materialLedgerService.getAllMaterialLedgers();
    }

    @GetMapping("/material-code/{materialCode}")
    public List<MaterialLedger> getMaterialLedgersByMaterialCode(@PathVariable String materialCode) {
        return materialLedgerService.getMaterialLedgersByMaterialCode(materialCode);
    }

    @GetMapping("/warehouse/{warehouseID}")
    public List<MaterialLedger> getMaterialLedgersByWarehouseID(@PathVariable Long warehouseID) {
        return materialLedgerService.getMaterialLedgersByWarehouseID(warehouseID);
    }
}

2. 前端 Vue 实现

2.1 项目结构

src
├── assets
├── components
│   ├── MaterialLedgerList.vue
│   ├── MaterialLedgerForm.vue
├── views
│   ├── MaterialLedgerView.vue
├── router
│   └── index.js
├── App.vue
└── main.js

2.2 入库/出库管理页面 (MaterialLedgerView.vue)

<template>
  <div>
    <h1>入库/出库管理</h1>
    <MaterialLedgerForm @add-material-ledger="addMaterialLedger" />
    <MaterialLedgerList :materialLedgers="materialLedgers" />
  </div>
</template>

<script>
import MaterialLedgerForm from '@/components/MaterialLedgerForm.vue';
import MaterialLedgerList from '@/components/MaterialLedgerList.vue';
import axios from 'axios';

export default {
  components: {
    MaterialLedgerForm,
    MaterialLedgerList,
  },
  data() {
    return {
      materialLedgers: [],
    };
  },
  created() {
    this.fetchMaterialLedgers();
  },
  methods: {
    async fetchMaterialLedgers() {
      const response = await axios.get('/api/material-ledgers');
      this.materialLedgers = response.data;
    },
    async addMaterialLedger(materialLedger) {
      await axios.post('/api/material-ledgers', materialLedger);
      this.fetchMaterialLedgers();
    },
  },
};
</script>

2.3 台账表单组件 (MaterialLedgerForm.vue)

<template>
  <form @submit.prevent="submitForm">
    <input v-model="materialLedger.MaterialCode" placeholder="物资编码" required />
    <input v-model="materialLedger.MaterialName" placeholder="物资名称" required />
    <input v-model="materialLedger.Specification" placeholder="规格" required />
    <input v-model="materialLedger.MaterialType" placeholder="物资分类" required />
    <input v-model="materialLedger.Supplier" placeholder="供应商" required />
    <input v-model="materialLedger.Brand" placeholder="品牌" required />
    <input v-model="materialLedger.Quantity" placeholder="数量" type="number" required />
    <input v-model="materialLedger.Unit" placeholder="计量单位" required />
    <input v-model="materialLedger.WarehouseID" placeholder="仓库编号" type="number" required />
    <select v-model="materialLedger.OperationType" required>
      <option value="入库">入库</option>
      <option value="出库">出库</option>
    </select>
    <input v-model="materialLedger.OperationDate" type="date" required />
    <button type="submit">提交</button>
  </form>
</template>

<script>
export default {
  data() {
    return {
      materialLedger: {
        MaterialCode: '',
        MaterialName: '',
        Specification: '',
        MaterialType: '',
        Supplier: '',
        Brand: '',
        Quantity: 0,
        Unit: '',
        WarehouseID: null,
        OperationType: '入库',
        OperationDate: new Date().toISOString().split('T')[0],
      },
    };
  },
  methods: {
    submitForm() {
      this.$emit('add-material-ledger', this.materialLedger);
      this.materialLedger = {
        MaterialCode: '',
        MaterialName: '',
        Specification: '',
        MaterialType: '',
        Supplier: '',
        Brand: '',
        Quantity: 0,
        Unit: '',
        WarehouseID: null,
        OperationType: '入库',
        OperationDate: new Date().toISOString().split('T')[0],
      };
    },
  },
};
</script>

2.4 台账列表组件 (MaterialLedgerList.vue)

<template>
  <ul>
    <li v-for="ledger in materialLedgers" :key="ledger.LedgerID">
      {{ ledger.MaterialCode }} - {{ ledger.MaterialName }} - {{ ledger.Quantity }} {{ ledger.Unit }} - {{ ledger.OperationType }}
    </li>
  </ul>
</template>

<script>
export default {
  props: ['materialLedgers'],
};
</script>

3. 路由配置 (router/index.js)

import Vue from 'vue';
import Router from 'vue-router';
import MaterialLedgerView from '@/views/MaterialLedgerView.vue';

Vue.use(Router);

export default new Router({
  routes: [
    {
      path: '/material-ledgers',
      name: 'MaterialLedgerView',
      component: MaterialLedgerView,
    },
  ],
});
posted @ 2025-03-05 21:04  花朝——  阅读(25)  评论(0)    收藏  举报