zhangzihao
/
javaee1
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

9.19 上午课堂提交

This commit is contained in:
zz 2024-09-19 10:13:05 +08:00
parent 327232932a
commit 9a167db817
2 changed files with 349 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

325
Vue/Vue001/src/App.vue
View File

@ -1,41 +1,302 @@
<!--
<script setup>
import { ref,onMounted } from 'vue';
import axios from 'axios; '
onMounted(()=>{
axios({
method:'get',
url:'http://127.0.0.1:8080/getsudents'
}).then( res =>{
console.log(res.data)
personList.value = red.data.data
}).catch( err =>{
console.log(err)
})
})
import { ref } from 'vue';
const msg = ref('hello world!!!')
const num = ref(10)
function myclick(){
// alert('点击')
if(mycolor.value=='red'){
mycolor.value='blue'
}else{
mycolor.value='red'
}
}
const username = ref('')
const password = ref('')
function login(){
if(username.value == 'admin' && password.value == '123456'){
alert('登录成功')
}else{
alert('登陆失败')
}
}
const isshow = ref(true)
const mycolor = ref('red')
const personList = ref([
{
id:1,
age:20,
name:"test111"
},{
id:2,
age:21,
name:"test222"
},{
id:3,
age:22,
name:"test333"
}
])
</script>
<template>
<el-input style="width:200px;margin:5px type="text" v-model=
<el-input style="width:200px;margin:5px type="text"
<table border='1'>
<tr>
<td>id</td>
<td>年龄</td>
<td>姓名</td>
<td>班级</td>
</tr>
<tr v-for="person in personList">
<td>{{person.id}}</td>
<td>{{person.age}}</td>
<td>{{person.age}}</td>
<td>{{person.classname}}</td>
</tr>
</table>
</template>
<ul>
<li v-for="person in personList">
{{person.id}} {{person.age}} {{person.name}}
</li>
</ul>
<div>{{msg.toLocaleUpperCase()}}</div>
<div>{{num*4}}</div>
<button @click="myclick">点击11</button>
<div :class="mycolor">test</div>
//<div v-if='isshow':class="mycolor">test1</div>
//v-model= @
<div>{{username}}</div>
<div>{{password}}</div>
<input type="text" v-model="username" /><br/>
<input type="text" v-model="password" /><br/>
<button @click="login">登录</button>
</template>
<style>
.red{
width: 100px;
height: 100px;
background-color: red;
}
.blue{
width: 200px;
height: 100px;
background-color: blue;
}
</style>
-->
<!-- <script setup>
import { ref,onMounted } from 'vue'
import axios from 'axios';
onMounted(()=>{
axios({
method:'get',
url:'http://127.0.0.1:8080/getstudents'
}).then( res =>{
console.log(res.data)
personList.value = res.data.data
} ).catch( err =>{
console.log(err)
} )
})
const personList = ref(null)
const username = ref('')
const password = ref('')
function login(){
axios({
method:'post',
url:'http://127.0.0.1:8080/login1',
params:{
username:username.value,
password:password.value
}
}).then( res =>{
console.log(res.data)
if(res.data.code==0){
alert("登陆成功")
}else{
alert("登陆失败")
}
} ).catch( err =>{
console.log(err)
} )
const imgurl = ref('')
const handlesuccess = (res,file,files)=>{
console.log(res.data)
imgurl.value = res.data
}
}
</script>
<template>
<img style="width: 100px;height: 100px" :src="imgurl">
<el-upload
class="upload-demo"
drag
action="http://127.0.0.1:8080/uploadcommit1"
:on-success="handlesuccess"
multiple
>
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="el-upload__text">
把文件拖拽上传 <em>或点击按钮上传</em>
</div>
<template #tip>
<div class="el-upload__tip">
jpg/png files with a size less than 500kb
</div>
</template>
</el-upload>
<input style="width: 200px;margin: 5px;" type="text" v-model="username" /><br/>
<input style="width: 200px;margin: 5px;" type="text" v-model="password" /><br/>
<el-button @click="login">登录</el-button>
<el-table :data="personList" style="width: 100%">
<el-table-column prop="id" label="id" width="180" />
<el-table-column prop="age" label="年龄" width="180" />
<el-table-column prop="name" label="姓名" width="180"/>
<el-table-column prop="classname" label="班级" width="180"/>
</el-table>
</template>
<style>
</style>
-->
<script setup>
import {
ref,
reactive,
onMounted
} from 'vue'
import axios from 'axios';
onMounted(() => {
loadData()
});
const personList = ref(null);
function loadData() {
axios({
method: 'get',
url: 'http://127.0.0.1:8080/getstudents'
}).then(res => {
console.log(res.data);
personList.value = res.data.data;
}).catch(err => {
console.log(err);
});
}
function deleteRow(row) {
console.log(row)
axios({
method: 'get',
url: 'http://127.0.0.1:8080/deletestudentbyid/' + row.id
}).then(res => {
loadData();
}).catch(err => {
console.log(err);
});
}
const dialogVisible = ref(false);
const form = reactive({
id: null,
name: '',
age: '',
classname:''
});
function updateRow(row) {
dialogVisible.value = true;
Object.assign(form,row);
}
function saveData(){
axios({
method: 'post',
url: 'http://127.0.0.1:8080/saveData',
params:form
}).then(res => {
loadData();
dialogVisible.value = false;
Object.assign(form,{
id: null,
name: '',
age: '',
classname: ''
});
}).catch(err => {
console.log(err);
});
}
function addperson(){
dialogVisible.value = true;
}
</script>
<template>
<el-button type="primary" @click="addperson">新增</el-button>
<el-dialog v-model="dialogVisible" title="编辑信息" width="500">
<el-form :model="form" label-width="auto" style="max-width: 600px">
<el-form-item label="id">
<el-input v-model="form.id" />
</el-form-item>
<el-form-item label="姓名">
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="年龄">
<el-input v-model="form.age" />
</el-form-item>
<el-form-item label="班级">
<el-input v-model="form.classname" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="saveData">保存</el-button>
</div>
</template>
</el-dialog>
<el-table :data="personList" style="width: 100%">
<el-table-column prop="id" label="id" width="180" />
<el-table-column prop="age" label="年龄" width="180" />
<el-table-column prop="name" label="姓名" width="180" />
<el-table-column prop="classname" label="班级" width="180" />
<el-table-column fixed="right" label="操作" width="120">
<template #default="{ row }">
<el-button type="primary" size="small" @click="updateRow(row)">更新</el-button>
<el-button type="danger" size="small" @click="deleteRow(row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
<style>
</style>

64
springboot/src/main/java/com/zhangzihao/springboot/springboot/Controllor/JsaonControllor.java
View File

@ -1,20 +1,68 @@
package com.zhangzihao.springboot.springboot.Controllor;
import com.zhangzihao.springboot.springboot.model.Student;
import com.zhangzihao.springboot.springboot.model.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import javax.xml.transform.Result;
import java.io.File;
import java.io.IOException;
import java.util.UUID;
@Controller
public class JsaonControllor {
//返回Json数据,App/小程序 前端分离
public class JsonController {
// @RequestMapping("getUser")
// //@RequestMapping("getUser") 表明这个方法处理 getUser 的请求
// @ResponseBody
// public User getUser(){
// User user = new User();
// user.setUsername("Lala");
// user.setClassname("医信1班");
// return user;
// }
@Autowired
IStudentService studentService;
@RequestMapping("getstudents")
public Result getstudents(){
return Result.ok(studentService.list());
}
@RequestMapping("login1")
public Result login1(String username,String password){
if(username.equals("admin")&& password.equals("123456"))
return Result.ok("登录成功");
return Result.error("登录失败");
}
@RequestMapping("getuser")
@ResponseBody
public User getUser()
{
public User getuser(){
User user = new User();
user.setUsername("张三");
user.setClassname("21医信");
user.setUsername("Lala");
user.setClassname("医信1班");
return user;
}
}
@RequestMapping("uploadcommit1")
public Result uploadSuccess(MultipartFile file) throws IOException
{
File file1 = new File("D:\\data");
String fileName = UUID.randomUUID().toString()+file.getOriginalFilename();
file.transferTo(new File(file1,fileName));
return Result.ok().put("data","http://127.0.0.1:8080/"+fileName);
}
@RequestMapping("/deletestudentbyid/{id}")
public Result deleteStudentById(@PathVariable Integer id)
{
return Result.ok(studentService.removeById(id));
}
@RequestMapping("")
public Result saveDate(Student student)
{
return Result.ok(studentService.saveOrUpdate(student));
}
}