<template>
<div>
<h1 align="center">SSM阶段机试,ts={{ts}}</h1>
<!-- 查询 行内表单-->
<el-form :inline="true">
<el-form-item label="名称">
<el-input v-model="oricename" placeholder="请输入订单名称"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="query">查询</el-button>
<el-button type="primary" @click="open">新增</el-button>
</el-form-item>
</el-form>
<!-- 表格 基础表格-->
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="id" label="编号" width="180">
</el-table-column>
<el-table-column prop="oricename" label="名称" width="180">
</el-table-column>
<el-table-column prop="price" label="价格">
</el-table-column>
<el-table-column prop="status" label="状态">
</el-table-column>
</el-table>
<!-- 新增 弹出自定义内容-->
<el-dialog @close="close" title="新增" :visible.sync="dialogFormVisible">
<el-form :model="form" :rules="rules" ref="form">
<el-form-item prop="oricename" label="名称" :visible.sync="formLabelWidth">
<el-input v-model="form.oricename" autocomplete="off"></el-input>
</el-form-item>
<el-form-item prop="price" label="价格" :visible.sync="formLabelWidth">
<el-input v-model="form.price" autocomplete="off"></el-input>
</el-form-item>
<el-form-item prop="status" label="状态" :visible.sync="formLabelWidth">
<el-select v-model="form.status" placeholder="请选择状态">
<el-option label="完成" value="完成"></el-option>
<el-option label="未完成" value="未完成"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data: function() {
return {
ts: new Date().getTime(),
oricename: '',
tableData: [],
form: {},
dialogFormVisible: false,
formLabelWidth: "100px",
rules: {
oricename: [{
required: true,
message: '请输入订单名称',
trigger: 'blur'
}],
price: [{
required: true,
message: '请输入价格',
trigger: 'blur'
}],
status: [{
required: true,
message: '请输入状态',
trigger: 'change'
}],
}
};
},
methods: {
close() {
this.form = {};
this.$refs["form"].resetFields();
},
open() {
this.dialogFormVisible = true;
},
save() {
this.$refs["form"].validate((valid) => {
if (valid) {
this.axios.post(this.axios.urls.ADD, this.form).then(resp => {
let data = resp.data;
if (data.code === 200) {
this.dialogFormVisible = false;
this.query();
} else {
this.$message({
message: '新增失败',
type: 'error'
});
}
})
} else {
console.log('error submit!!');
return false;
}
});
},
query() {
//1
let url = this.axios.urls.QUERY;
//2
this.axios.post(url, {
oricename: this.oricename
}).then(resp => {
console.log(resp.data);
this.tableData = resp.data.data;
}).catch(resp => {})
}
}
}
</script>
<style>
</style>
//Controller
@RestController @RequestMapping("/orice") public class OriceController { @Autowired private OriceService oriceService; @RequestMapping("/addorice") public Json<?> addorice(Orice orice){ oriceService.insert(orice); return new Json<>(); } @RequestMapping("/query") public Json<List<Orice>> query(Orice orice){ List<Orice> orices = oriceService.query(orice); return new Json<>(200,"OK",orices); } @Data @AllArgsConstructor @NoArgsConstructor class Json<T>{ private int code = 200; private String msg = "OK"; private T data; } }
//select
select * from t_orice where 1=1 <if test="null!=oricename and ''!=oricename"> and oricename like concat('%',#{oricename},'%') </if>