一、后端作業
1、創建資料庫
資料庫名shop_v1.0，字符集utf8，排序規則utf8_general_ci，執行腳本，
CREATE TABLE `t_user` (
`id` bigint NOT NULL AUTO_INCREMENT,
`username` varchar(64) NOT NULL COMMENT '用戶名',
`password` varchar(128) DEFAULT NULL COMMENT '密碼',
`name` varchar(64) DEFAULT NULL,
`email` varchar(64) DEFAULT NULL,
`telephone` varchar(32) DEFAULT NULL,
`birthday` date DEFAULT NULL,
`gender` char(1) DEFAULT NULL,
`status` char(1) DEFAULT NULL,
`create_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
`update_time` timestamp NULL DEFAULT NULL ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
2、創建springboot工程
File -- New -- Project -- Spring Initializr，
3、添加Maven依賴，完整pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.10.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.zl</groupId>
<artifactId>springboot-demo</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>springboot-demo</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<!-- 資料庫驅動 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<scope>runtime</scope>
</dependency>
<!-- mp -->
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-boot-starter</artifactId>
<version>3.4.1</version>
</dependency>
<!-- mp代碼生成器 -->
<dependency>
<groupId>com.baomidou</groupId>
<artifactId>mybatis-plus-generator</artifactId>
<version>3.4.1</version>
</dependency>
<!-- mp代碼生成器模板 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<!-- Swagger2 -->
<dependency>
<groupId>io.springfox</groupId>
<artifactId>springfox-swagger2</artifactId>
<version>2.7.0</version>
</dependency>
<dependency>
<groupId>io.springfox</groupId>
<artifactId>springfox-swagger-ui</artifactId>
<version>2.7.0</version>
</dependency>
<!-- swagger2美化 -->
<dependency>
<groupId>com.github.xiaoymin</groupId>
<artifactId>swagger-bootstrap-ui</artifactId>
<version>1.9.3</version>
</dependency>
<!-- lombok -->
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
使用lombok需安裝lombok插件，如果已安裝此處可忽略，
4、添加代碼生成器CodeGenerator
執行生成代碼，
/**
* @author zhanglei
* 演示例子，執行 main 方法控制臺輸入模塊表名回車自動生成對應專案目錄中
*/
public class CodeGenerator {
/**
* <p>
* 讀取控制臺內容
* </p>
*/
public static String scanner(String tip) {
Scanner scanner = new Scanner(System.in);
StringBuilder help = new StringBuilder();
help.append("請輸入" + tip + "：");
System.out.println(help.toString());
if (scanner.hasNext()) {
String ipt = scanner.next();
if (StringUtils.isNotBlank(ipt)) {
return ipt;
}
}
throw new MybatisPlusException("請輸入正確的" + tip + "！");
}
public static void main(String[] args) {
// 代碼生成器
AutoGenerator mpg = new AutoGenerator();
// 全域配置
GlobalConfig gc = new GlobalConfig();
String projectPath = System.getProperty("user.dir");
gc.setOutputDir(projectPath + "/src/main/java");
gc.setAuthor("zhanglei");
gc.setOpen(false);
// 物體屬性 Swagger2 注解
// gc.setSwagger2(true);
mpg.setGlobalConfig(gc);
// 資料源配置
DataSourceConfig dsc = new DataSourceConfig();
dsc.setUrl("jdbc:mysql://localhost:3306/shop_v1.0?useUnicode=true&useSSL=false&characterEncoding=utf8");
// dsc.setSchemaName("public");
dsc.setDriverName("com.mysql.jdbc.Driver");
dsc.setUsername("root");
dsc.setPassword("12345678");
mpg.setDataSource(dsc);
// 包配置
PackageConfig pc = new PackageConfig();
pc.setModuleName(scanner("模塊名"));
pc.setParent("com.zl");
mpg.setPackageInfo(pc);
// 自定義配置
InjectionConfig cfg = new InjectionConfig() {
@Override
public void initMap() {
// to do nothing
}
};
// 如果模板引擎是 freemarker
String templatePath = "/templates/mapper.xml.ftl";
// 如果模板引擎是 velocity
// String templatePath = "/templates/mapper.xml.vm";
// 自定義輸出配置
List<FileOutConfig> focList = new ArrayList<>();
// 自定義配置會被優先輸出
focList.add(new FileOutConfig(templatePath) {
@Override
public String outputFile(TableInfo tableInfo) {
// 自定義輸出檔案名 ， 如果你 Entity 設定了前后綴、此處注意 xml 的名稱會跟著發生變化！！
return projectPath + "/src/main/resources/mapper/" + pc.getModuleName()
+ "/" + tableInfo.getEntityName() + "Mapper" + StringPool.DOT_XML;
}
});
// cfg.setFileCreate(new IFileCreate() {
// @Override
// public boolean isCreate(ConfigBuilder configBuilder, FileType fileType, String filePath) {
// // 判斷自定義檔案夾是否需要創建
// checkDir("呼叫默認方法創建的目錄，自定義目錄用");
// if (fileType == FileType.MAPPER) {
// // 已經生成 mapper 檔案判斷存在，不想重新生成回傳 false
// return !new File(filePath).exists();
// }
// // 允許生成模板檔案
// return true;
// }
// });
cfg.setFileOutConfigList(focList);
mpg.setCfg(cfg);
// 配置模板
TemplateConfig templateConfig = new TemplateConfig();
// 配置自定義輸出模板
// 指定自定義模板路徑，注意不要帶上.ftl/.vm, 會根據使用的模板引擎自動識別
// templateConfig.setEntity("templates/entity2.java");
// templateConfig.setService();
// templateConfig.setController();
templateConfig.setXml(null);
mpg.setTemplate(templateConfig);
// 策略配置
StrategyConfig strategy = new StrategyConfig();
strategy.setNaming(NamingStrategy.underline_to_camel);
strategy.setColumnNaming(NamingStrategy.underline_to_camel);
// strategy.setSuperEntityClass("你自己的父類物體,沒有就不用設定!");
strategy.setEntityLombokModel(true);
strategy.setRestControllerStyle(true);
// 公共父類
// strategy.setSuperControllerClass("你自己的父類控制器,沒有就不用設定!");
// 寫于父類中的公共欄位
// strategy.setSuperEntityColumns("id");
strategy.setInclude(scanner("表名，多個英文逗號分割").split(","));
strategy.setControllerMappingHyphenStyle(true);
// strategy.setTablePrefix(pc.getModuleName() + "_");
// 處理表前綴
strategy.setTablePrefix("t_");
mpg.setStrategy(strategy);
mpg.setTemplateEngine(new FreemarkerTemplateEngine());
mpg.execute();
}
}
將生成的代碼復制到對應檔案夾下，
5、添加組態檔
server.port=8089
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/shop_v1.0?characterEncoding=utf-8&useSSL=false
spring.datasource.username=root
spring.datasource.password=12345678
6、添加MybatisPlusConfig
/**
* @author zhanglei
*/
@Configuration
@MapperScan("com.zl.mapper")
public class MybatisPlusConfig {
@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor() {
MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL));
return interceptor;
}
}
7、添加Swagger2Config
/**
* @author zhanglei
*/
@Configuration
@EnableSwagger2
@EnableSwaggerBootstrapUI
public class Swagger2Config {
@Bean
public Docket docket() {
return new Docket(DocumentationType.SWAGGER_2)
.apiInfo(new ApiInfoBuilder().title("springboot+vue前后端分離demo介面檔案").build());
}
}
8、添加通用回傳
package com.zl.entity;
import java.util.HashMap;
public class R extends HashMap<String, Object> {
private static final int OK = 200;
private static final int ERROR = 400;
private int code;
private String msg;
private Object data;
public R(int code, String msg, Object data) {
this.put("code", code);
this.put("msg", msg);
this.put("data", data);
}
public R(int code, String msg) {
this.put("code", code);
this.put("msg", msg);
}
public R() {
}
public int getCode() {
return (Integer) this.get("code");
}
public void setCode(int code) {
this.put("code", code);
}
public String getMsg() {
return (String) this.get("msg");
}
public void setMsg(String msg) {
this.put("msg", msg);
}
public Object getData() {
return this.get("data");
}
public void setData(Object data) {
this.put("data", data);
}
public static R ok() {
return new R(OK, "操作成功");
}
public static R ok(String msg) {
return new R(OK, msg);
}
public static R ok(Object data) {
return new R(OK, "操作成功", data);
}
public static R ok(String msg, Object data) {
return new R(OK, msg, data);
}
public static R ok(int code, String msg, Object data) {
return new R(code, msg, data);
}
public static R error() {
return new R(ERROR, "操作失敗");
}
public static R error(String msg) {
return new R(ERROR, msg);
}
public static R error(int code, String msg) {
return new R(code, msg);
}
}
9、修改UserController
@Api(tags = "用戶管理")
@Slf4j
@CrossOrigin
@RestController
public class UserController {
@Resource
private IUserService userService;
@GetMapping("/user")
public R queryUsers(@RequestParam(value = "https://www.cnblogs.com/zhanglei-code/p/pageNum", defaultValue = "https://www.cnblogs.com/zhanglei-code/p/1") int pageNum,
@RequestParam(value = "https://www.cnblogs.com/zhanglei-code/p/pageSize", defaultValue = "https://www.cnblogs.com/zhanglei-code/p/5") int pageSize,
HttpServletRequest request) {
String username = request.getParameter("username");
String name = request.getParameter("name");
Page<User> page = new Page<>(pageNum, pageSize);
QueryWrapper<User> queryWrapper = new QueryWrapper<>();
queryWrapper.orderByDesc("create_time");
if (!StringUtils.isEmpty(username)) {
queryWrapper.like("username", username);
}
if (!StringUtils.isEmpty(name)) {
queryWrapper.like("name", name);
}
userService.page(page, queryWrapper);
log.info("當前頁數" + page.getCurrent());
log.info("總頁數" + page.getPages());
log.info("每頁條數" + page.getSize());
log.info("總條數" + page.getTotal());
log.info("是否有上一頁" + page.hasPrevious());
log.info("是否有下一頁" + page.hasNext());
return R.ok(page);
}
@GetMapping("/user/{id}")
public R queryUserById(@PathVariable("id") Long id) {
return R.ok(userService.getById(id));
}
@PostMapping("/user")
public R insertUser(@RequestBody User user) {
userService.save(user);
return R.ok();
}
@PutMapping("/user")
public R updateUser(@RequestBody User user) {
userService.updateById(user);
return R.ok();
}
@DeleteMapping("/user/{id}")
public R deleteUserById(@PathVariable("id") Long id) {
userService.removeById(id);
return R.ok();
}
@DeleteMapping("/user")
public R deleteUsersByIds(@RequestBody List<Long> ids) {
userService.removeByIds(ids);
return R.ok();
}
}
完整工程結構，
最后修改下User物體，解決日期字串與LocalDate轉化問題，
@JsonFormat(pattern = "yyyy-MM-dd")
private LocalDate birthday;
完成后啟動，
10、介面測驗
訪問 http://localhost:8089/swagger-ui.html 或者 http://localhost:8089/doc.html 測驗一下介面，
二、前端作業
1、安裝node.js
進入官網(http://nodejs.cn/)，下載長期支持版并安裝，
檢查是否安裝成功，
node -v
npm -v
2、安裝vue腳手架vue-cli
npm install -g @vue/cli
3、vue可視化管理工具創建專案
vue ui
-
創建
-
填寫專案名稱
-
手動配置專案
-
功能配置（注意紅框位置，其余保持默認）
-
選擇Vue2.x
-
創建專案，不保留預設
4、安裝依賴
npm install
# 或者
npm install --registry=https://registry.npm.taobao.org
5、專案啟動
npm run serve
6、安裝element-ui、axios
element-ui
npm install element-ui --save
// 在main.js中引入
import Element from 'element-ui'
import "element-ui/lib/theme-chalk/index.css"
Vue.use(Element)
axios
npm install axios --save
// 在main.js中引入
import axios from 'axios'
Vue.prototype.$axios = axios
7、添加工具類
src下創建utils檔案夾，在檔案夾下新建request.js，
import axios from 'axios'
import {Message} from 'element-ui';
// create an axios instance
const service = axios.create({
baseURL: "http://localhost:8089",
// timeout: 5000 // request timeout
})
// response interceptor
service.interceptors.response.use(
response => {
const res = response.data
// store.commit('SET_LOADING',false);
// if the custom code is not 20000, it is judged as an error.
if (res.code !== 200) {
Message.error({message: res.msg});
return Promise.reject(new Error(res.message || 'Error'))
} else {
return res
}
},
error => {
console.log('error' + error)
if (error.response.status) {
switch (error.response.status) {
case 401:
Message.error({message: '登錄狀態已過期'});
//跳至登錄頁
break;
case 403:
Message.error({message: '您的權限不足'});
break;
case 404:
Message.error({message: '您訪問的網頁不存在'});
break;
case 504:
Message.error({message: '服務器宕機了，( ╯□╰ )'});
break;
// 其他錯誤，直接拋出錯誤提示
default:
if (error.response.data.msg) {
Message.error({message: error.response.data.msg})
} else {
Message.error({message: '未知錯誤'});
}
}
}
return Promise.reject(error)
}
)
export default service
8、添加介面API
src下創建api檔案夾，在檔案夾下新建user.js，
import request from '@/utils/request'
// 查詢串列
export function queryUsers(params) {
return request({
url: '/user',
method: 'get',
params: params
})
}
// 查詢單條
export function queryUserById(id) {
return request({
url: '/user/' + id,
method: 'get'
})
}
// 新增
export function insertUser(data) {
return request({
url: '/user',
method: 'post',
data: data
})
}
// 修改
export function updateUser(data) {
return request({
url: '/user',
method: 'put',
data: data
})
}
// 單條洗掉
export function deleteUserById(id) {
return request({
url: '/user' + id,
method: 'delete'
})
}
// 批量洗掉
export function deleteUsersByIds(ids) {
return request({
url: '/user',
method: 'delete',
data: ids
})
}
9、添加頁面
在views檔案夾下新建User.vue，
<template>
<div>
<el-form :inline="true" size="small" :model="searchForm" ref="searchForm">
<el-form-item prop="username">
<el-input v-model="searchForm.username" placeholder="用戶名" clearable/>
</el-form-item>
<el-form-item prop="name">
<el-input v-model="searchForm.name" placeholder="姓名" clearable/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-refresh" @click="reset">重置</el-button>
</el-form-item>
</el-form>
<el-form :inline="true" size="small">
<el-form-item>
<el-button type="primary" icon="el-icon-plus" @click="dialogVisible=true">新增</el-button>
</el-form-item>
<el-form-item>
<el-popconfirm title="確認想要批量洗掉記錄嗎？" @confirm="deleteHandle(null)">
<el-button type="danger"
icon="el-icon-delete"
slot="reference"
:disabled="delDisabled">批量洗掉
</el-button>
</el-popconfirm>
</el-form-item>
</el-form>
<el-table
size="medium"
v-loading="loading"
ref="multipleTable"
:data="https://www.cnblogs.com/zhanglei-code/p/tableData"
border
@selection-change="selectionChange">
<el-table-column type="selection"/>
<el-table-column prop="username" label="用戶名"/>
<el-table-column prop="name" label="姓名"/>
<el-table-column prop="email" label="郵箱"/>
<el-table-column prop="telephone" label="電話"/>
<el-table-column prop="birthday" label="生日"/>
<el-table-column prop="gender" label="性別">
<template slot-scope="scope">
<span v-if="scope.row.gender === '1'">男</span>
<span v-else-if="scope.row.gender === '0'">女</span>
</template>
</el-table-column>
<el-table-column prop="status" label="狀態">
<template slot-scope="scope">
<el-tag size="small" v-if="scope.row.status === '1'" type="success">啟用</el-tag>
<el-tag size="small" v-else-if="scope.row.status === '0'" type="danger">停用</el-tag>
</template>
</el-table-column>
<el-table-column prop="icon" label="操作">
<template slot-scope="scope">
<el-button type="text" icon="el-icon-edit" @click="updateHandle(scope.row.id)">編輯</el-button>
<el-popconfirm title="確認想要洗掉記錄嗎？" @confirm="deleteHandle(scope.row.id)">
<el-button type="text"
icon="el-icon-delete"
slot="reference"
style="margin-left:10px;">洗掉
</el-button>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="pageSizeChange"
@current-change="currentPageChange"
layout="total, sizes, prev, pager, next, jumper"
:page-sizes="[5, 20, 50, 100]"
:current-page="currentPage"
:page-size="pageSize"
:total="total">
</el-pagination>
<!--新增對話框-->
<el-dialog
title="資訊"
:visible.sync="dialogVisible"
@close="dialogClose('form')">
<el-form :model="form" :rules="rules" ref="form" size="small" label-position="right" label->
<el-form-item label="用戶名" prop="username">
<el-input v-model="form.username"/>
</el-form-item>
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name"/>
</el-form-item>
<el-form-item label="郵箱" prop="email">
<el-input v-model="form.email"/>
</el-form-item>
<el-form-item label="手機號" prop="telephone">
<el-input v-model="form.telephone"/>
</el-form-item>
<el-form-item label="生日" prop="birthday">
<el-date-picker
type="date" placeholder="選擇日期" v-model="form.birthday"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd" style="width: 260px;">
</el-date-picker>
</el-form-item>
<el-form-item label="性別" prop="gender">
<el-radio-group v-model="form.gender">
<el-radio :label="'1'">男</el-radio>
<el-radio :label="'0'">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="狀態" prop="status">
<el-select v-model="form.status" placeholder="請選擇">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="https://www.cnblogs.com/zhanglei-code/p/item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer">
<el-button size="small" @click="dialogVisible = false">取 消</el-button>
<el-button size="small" type="primary" @click="submitForm('form')">確 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {queryUsers, queryUserById, insertUser, updateUser, deleteUserById, deleteUsersByIds} from "@/api/user";
export default {
name: "User",
data() {
return {
loading: false,
searchForm: {
username: '',
name: ''
},
form: {
id: null,
username: '',
name: '',
email: '',
telephone: '',
birthday: '',
gender: '',
status: '0'
},
delDisabled: true,
dialogVisible: false,
total: 0,
pageSize: 5,
currentPage: 1,
tableData: [],
selections: [],
options: [{
value: '1',
label: '啟用'
}, {
value: '0',
label: '停用'
}],
rules: {
username: [
{required: true, message: '請輸入用戶名稱', trigger: 'blur'}
],
name: [
{required: true, message: '請輸入姓名', trigger: 'blur'}
]
}
}
},
methods: {
pageSizeChange(val) {
this.pageSize = val
this.search()
},
currentPageChange(val) {
this.currentPage = val
this.search()
},
selectionChange(val) {
this.selections = val
this.delDisabled = val.length === 0
},
resetForm(formName) {
this.$refs[formName].resetFields()
},
dialogClose(formName) {
this.resetForm(formName)
this.form = {}
this.dialogVisible = false
},
reset() {
this.resetForm('searchForm')
this.search()
},
doSearch() {
this.currentPage = 1
this.pageSize = 5
this.search()
},
search() {
this.loading = true
queryUsers({
pageNum: this.currentPage,
pageSize: this.pageSize,
username: this.searchForm.username,
name: this.searchForm.name
}).then(res => {
this.tableData = https://www.cnblogs.com/zhanglei-code/p/res.data.records
this.total = res.data.total
this.loading = false
})
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
if (!this.form.id) {
insertUser(this.form)
.then(res => {
this.$message({message:'保存成功', type: 'success'});
this.doSearch()
this.dialogVisible = false
})
} else {
updateUser(this.form)
.then(res => {
this.$message({message: '更新成功', type: 'success'});
this.doSearch()
this.dialogVisible = false
})
}
} else {
return false;
}
});
},
updateHandle(id) {
this.dialogVisible = true
queryUserById(id).then(res => {
this.form = res.data
})
},
deleteHandle(id) {
let ids = []
if (id) {
ids.push(id)
} else {
this.selections.forEach(row => {
ids.push(row.id)
})
}
deleteUsersByIds(ids).then(res => {
this.$message({message: '洗掉成功', type: 'success'});
this.doSearch()
})
}
},
created() {
this.search()
}
}
</script>
<style>
.el-pagination {
margin-top: 10px;
}
.el-input {
width: 260px;
}
</style>
10、添加路由
src/router/index.js中添加路由，
{
path: '/user',
name: 'user',
component: () => import('../views/User.vue')
}
11、修改App.vue
將樣式和部分頁面代碼注釋掉，
<template>
<div id="app">
<!-- <nav>-->
<!-- <router-link to="/">Home</router-link> |-->
<!-- <router-link to="/about">About</router-link>-->
<!-- </nav>-->
<router-view/>
</div>
</template>
<style>
/*#app {*/
/* font-family: Avenir, Helvetica, Arial, sans-serif;*/
/* -webkit-font-smoothing: antialiased;*/
/* -moz-osx-font-smoothing: grayscale;*/
/* text-align: center;*/
/* color: #2c3e50;*/
/*}*/
/*nav {*/
/* padding: 30px;*/
/*}*/
/*nav a {*/
/* font-weight: bold;*/
/* color: #2c3e50;*/
/*}*/
/*nav a.router-link-exact-active {*/
/* color: #42b983;*/
/*}*/
</style>
完整工程結構，
重新啟動，
12、訪問測驗
瀏覽器輸入：http://localhost:8080/#/user
本文來自博客園，作者：zhanglei-code，轉載請注明原文鏈接：https://www.cnblogs.com/zhanglei-code/p/16262104.html
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/472852.html
標籤：Java