海上捞火锅

海上捞火锅


添加员工

<p>[TOC]</p> <h5>简要描述</h5> <ul> <li>添加员工</li> </ul> <h5>前端页面和服务端交互过程</h5> <ul> <li>页面发送ajax请求,将新增员工页面中输入的数据以json的形式提交到服务端</li> <li>服务端Controller接收页面提交的数据并调用Service将数据进行保存</li> <li>Service调用Mapper操作数据库,保存数据</li> </ul> <h5>触发事件</h5> <pre><code>&lt;el-button type="primary" @click="addMemberHandle('add')" &gt; + 添加员工 &lt;/el-button&gt;</code></pre> <h5>接口调用</h5> <pre><code>addEmployee(params).then(res =&gt; { if (res.code === 1) { this.$message.success('员工添加成功!') if (!st) { this.goBack() } else { this.ruleForm = { username: '', 'name': '', 'phone': '', // 'password': '', // 'rePassword': '',/ 'sex': '男', 'idNumber': '' } }</code></pre> <h5>请求URL</h5> <ul> <li><code>[context-path]/employee</code></li> </ul> <h5>请求方式</h5> <ul> <li>POST </li> </ul> <h5>API接口</h5> <pre><code>function addEmployee (params) { return $axios({ url: '/employee', method: 'post', data: { ...params } }) } </code></pre> <h5>参数</h5> <table> <thead> <tr> <th style="text-align: left;">参数名</th> <th style="text-align: left;">必选</th> <th style="text-align: left;">类型</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td style="text-align: left;">name</td> <td style="text-align: left;">是</td> <td style="text-align: left;">varchar(32)</td> <td>账号</td> </tr> <tr> <td style="text-align: left;">username</td> <td style="text-align: left;">是</td> <td style="text-align: left;">varchar(32)</td> <td>员工姓名</td> </tr> <tr> <td style="text-align: left;">phone</td> <td style="text-align: left;">是</td> <td style="text-align: left;">varchar(64)</td> <td>手机号</td> </tr> <tr> <td style="text-align: left;">sex</td> <td style="text-align: left;">是</td> <td style="text-align: left;">varchar(2)</td> <td>性别</td> </tr> <tr> <td style="text-align: left;">id_number</td> <td style="text-align: left;">是</td> <td style="text-align: left;">varchar(18)</td> <td>身份证号</td> </tr> </tbody> </table> <h5>返回示例</h5> <pre><code>code: 1 data: "新增员工成功" map: {} msg: null </code></pre> <h5>返回参数说明</h5> <table> <thead> <tr> <th style="text-align: left;">参数名</th> <th style="text-align: left;">类型</th> <th>说明</th> </tr> </thead> <tbody> <tr> <td style="text-align: left;">code</td> <td style="text-align: left;">int</td> <td>返回码:1:成功 0或其他:失败</td> </tr> <tr> <td style="text-align: left;">data</td> <td style="text-align: left;">object</td> <td>返回数据</td> </tr> <tr> <td style="text-align: left;">map</td> <td style="text-align: left;">map</td> <td>动态数据</td> </tr> <tr> <td style="text-align: left;">msg</td> <td style="text-align: left;">string</td> <td>错误信息</td> </tr> </tbody> </table> <h5>备注</h5> <ul> <li>data有两种返回结果</li> </ul> <pre><code>public static &lt;T&gt; R&lt;T&gt; success(T object) { R&lt;T&gt; r = new R&lt;T&gt;(); r.data = object; r.code = 1; return r; } public static &lt;T&gt; R&lt;T&gt; error(String msg) { R r = new R(); r.msg = msg; r.code = 0; return r; } </code></pre> <h5>后端接口请求参数</h5> <ul> <li>@RequestBody 接收前端传递给后端的json字符串中的数据(请求体Employee中的数据)</li> </ul> <h5>后端代码</h5> <pre><code>@PostMapping public R&lt;String&gt; save(@RequestBody Employee employee){ employee.setPassword("123456"); employeeService.save(employee); return R.success("新增员工成功"); }</code></pre>

页面列表

ITEM_HTML