一个 CRUD 示例

最新推荐文章于 2022-07-22 10:51:07 发布

weixin_33881140

最新推荐文章于 2022-07-22 10:51:07 发布

阅读量278

点赞数

文章标签：开发工具 python javascript ViewUI

原文链接：https://my.oschina.net/huangyong/blog/160423

版权

2019独角兽企业重金招聘Python工程师标准>>>

本文是《轻量级 Java Web 框架架构设计》的系列博文。

目前，Smart Framework 的核心代码已基本完成，感谢大家的关注！为了答谢大家，我想倾情奉献一份 CRUD 示例给大家，收到后一定要给我评论哦！

现在就出发，我要做一个产品管理系统！当然只是玩具级别的了，只是为了体验一下要开发一个 CRUD 到底要写多少代码？

第一步，写一个 Entity 类：

public class Product extends BaseEntity {

    private long productTypeId;

    private String productName;

    private String productCode;

    private int price;

    private String description;

    ... 省略 getter/setter 方法
}

第二步，写一个 Service 接口：

public interface ProductService {

    List<Product> getProductList();

    Product getProduct(long productId);

    boolean createProduct(Map<String, Object> productFieldMap);

    boolean updateProduct(long productId, Map<String, Object> productFieldMap);

    boolean deleteProduct(long productId);
}

第三步，为 Service 接口写一个实现类：

@Bean
public class ProductServiceImpl extends BaseService implements ProductService {

    @Override
    public List<Product> getProductList() {
        return DataSet.selectList(Product.class, "");
    }

    @Override
    public Product getProduct(long productId) {
        return DataSet.select(Product.class, "id = ?", productId);
    }

    @Override
    @Transaction
    public boolean createProduct(Map<String, Object> productFieldMap) {
        return DataSet.insert(Product.class, productFieldMap);
    }

    @Override
    @Transaction
    public boolean updateProduct(long productId, Map<String, Object> productFieldMap) {
        return DataSet.update(Product.class, productFieldMap, "id = ?", productId);
    }

    @Override
    @Transaction
    public boolean deleteProduct(long productId) {
        return DataSet.delete(Product.class, "id = ?", productId);
    }
}

第四步，写一个 Action 类：

@Bean
public class ProductAction extends BaseAction {

    @Inject
    private ProductService productService;

    @Request("get:/products")
    public Result getProducts() {
        List<Product> productList = productService.getProductList();
        return new Result(OK, productList);
    }

    @Request("get:/product/{id}")
    public Result getProductById(long productId) {
        if (productId == 0) {
            return new Result(ERROR_PARAM);
        }
        Product product = productService.getProduct(productId);
        if (product != null) {
            return new Result(OK, product);
        } else {
            return new Result(ERROR_DATA);
        }
    }

    @Request("post:/product")
    public Result createProduct(Map<String, Object> productFieldMap) {
        boolean success = productService.createProduct(productFieldMap);
        return new Result(OK, success);
    }

    @Request("put:/product/{id}")
    public Result updateProduct(long productId, Map<String, Object> productFieldMap) {
        if (productId == 0) {
            return new Result(ERROR_PARAM);
        }
        boolean success = productService.updateProduct(productId, productFieldMap);
        return new Result(OK, success);
    }

    @Request("delete:/product/{id}")
    public Result deleteProductById(long productId) {
        if (productId == 0) {
            return new Result(ERROR_PARAM);
        }
        boolean success = productService.deleteProduct(productId);
        return new Result(OK, success);
    }
}

第五步，写一个主页面（HTML 格式），用于显示所有的产品：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Product</title>
    <link rel="stylesheet" href="../style/global.css"/>
    <script type="text/javascript" src="../lib/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="../lib/jquery-form/jquery.form.min.js"></script>
</head>
<body>

<div class="css-panel">
    <div class="css-panel-header">
        <div class="css-left">
            <h3>Product List</h3>
        </div>
        <div class="css-right">
            <a href="product_create.html">New</a>
        </div>
    </div>
    <div class="css-panel-content">
        <table id="product_table" class="css-table">
            <thead>
                <tr>
                    <td>Product Type</td>
                    <td>Product Name</td>
                    <td>Product Code</td>
                    <td>Price</td>
                    <td>Description</td>
                    <td>Action</td>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
</div>

<script type="text/javascript">
    $(function() {
        $.ajax({
            url: '/products',
            success: function(result) {
                if (result.error == 0) {
                    var html = '';
                    $.each(result.data, function(i, product) {
                        html += '<tr data-id="' + product.id + '" data-name="' + product.productName + '">';
                        html += '    <td>' + product.productTypeId + '</td>';
                        html += '    <td>' + product.productName + '</td>';
                        html += '    <td>' + product.productCode + '</td>';
                        html += '    <td>' + product.price + '</td>';
                        html += '    <td>' + product.description + '</td>';
                        html += '    <td>';
                        html += '        <a href="#" class="ext-product-edit">Edit</a>';
                        html += '        <a href="#" class="ext-product-delete">Delete</a>';
                        html += '    </td>';
                        html += '</tr>'
                    });
                    $('#product_table tbody').html(html);
                }
            }
        });

        $(document).on('click', '.ext-product-edit', function() {
            var $tr = $(this).closest('tr');
            var productId = $tr.data('id');
            window.sessionStorage.setItem('product.id', productId);
            location.href = 'product_edit.html';
        });

        $(document).on('click', '.ext-product-delete', function() {
            var $tr = $(this).closest('tr');
            var productId = $tr.data('id');
            var productName = $tr.data('name');
            if (confirm('Do you want to delete product [' + productName + ']?')) {
                $.ajax({
                    url: '/product/' + productId,
                    type: 'delete',
                    success: function(result) {
                        if (result.error == 0) {
                            $tr.remove();
                        }
                    }
                });
                window.sessionStorage.removeItem('product.id');
            }
            return false;
        });

        window.sessionStorage.removeItem('product.id');
    });
</script>

</body>
</html>

代码全部完成，现在启动您的 Tomcat，看看效果吧！

进入产品主页面（product.html）：