From 0644caa46a4f041af61157446bc9377746eaca21 Mon Sep 17 00:00:00 2001
From: hezi66677 <847517741@qq.com>
Date: Sat, 9 Nov 2024 15:04:10 +0000
Subject: [PATCH] =?UTF-8?q?Vue=E7=AC=AC=E4=BA=8C=E6=AC=A1=E5=A4=87?=
 =?UTF-8?q?=E4=BB=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Vue第二次备份
---
 APP-2.vue | 133 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 133 insertions(+)
 create mode 100644 APP-2.vue

diff --git a/APP-2.vue b/APP-2.vue
new file mode 100644
index 0000000..14f397c
--- /dev/null
+++ b/APP-2.vue
@@ -0,0 +1,133 @@
+<script setup>
+	import {
+		ref,
+		onMounted,
+		reactive
+	} from 'vue';
+	import axios from 'axios'
+
+	const studentList = ref(null)
+	//ÉúÃüÖÜÆÚ·½·¨ Ö±½ÓÖ´ÐÐ
+	onMounted(() => {
+		myClick()
+	})
+	// ²éѯ
+	function myClick() {
+		axios({
+			//²»´ø²ÎÊý
+			method: 'GET',
+			url: 'http://127.0.0.1:8080/student/studentlist',
+		}).then(res => {
+			console.log(res.data)
+			//TODO ÏÔʾÊý¾Ý
+			studentList.value = res.data.data
+		}).catch(err => {
+			console.log(err)
+		})
+	}
+	//ɾ³ý
+	function deleteStudent(row) {
+		console.log(row)
+		axios({
+			//´ø²ÎÊý
+			method: 'POST',
+			url: 'http://127.0.0.1:8080/student/deleteStudent',
+			params: {
+				id: row.id
+			}
+		}).then(res => {
+			console.log(res.data)
+			myClick()
+
+		}).catch(err => {
+			console.log(err)
+		})
+	}
+
+	const dialogVisible = ref(false)
+	const form = reactive({
+		id: null,
+		age: 0,
+		name: ''
+	})
+	//±à¼­
+	function updataStudent(row) {
+		console.log(row)
+		dialogVisible.value = true
+		//row --> form
+		Object.assign(form,row)
+	}
+	
+	//¸üÐÂ
+	function updataNewStudent(){
+		axios({
+			//´ø²ÎÊý
+			method: 'POST',
+			url: 'http://127.0.0.1:8080/student/updateStudent',
+			params: form
+		}).then(res => {
+			console.log(res.data)
+			dialogVisible.value = false
+			myClick()
+		
+		}).catch(err => {
+			console.log(err)
+		})
+	}
+	
+	//Ôö¼Ó
+	function addStudent(){
+		dialogVisible.value = true
+		Object.assign(form,{
+		id: null,
+		age: 0,
+		name: ''
+	})
+	}
+</script>
+
+<template>
+	<!-- Ôöɾ¸Ä²é -->
+	
+	<el-button @click="addStudent">Ôö¼Ó</el-button>
+	
+	<el-table :data="studentList" border stripe 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="ÐÕÃû" />
+		<el-table-column fixed="right" label="²Ù×÷" min-width="120">
+			<template #default="{row}">
+				<el-button link type="danger" size="small" @click="deleteStudent(row)">
+					ɾ³ý
+				</el-button>
+				<el-button link type="primary" size="small" @click="updataStudent(row)">
+					±à¼­
+				</el-button>
+			</template>
+		</el-table-column>
+	</el-table>
+	
+	<el-dialog v-model="dialogVisible" title="Ôö¼ÓºÍ±à¼­Óû§¹¦ÄÜ" width="500" :before-close="handleClose">
+		<el-form :model="form" label-width="auto" style="max-width: 600px">
+			<el-form-item label="id">
+				<el-input disabled v-model="form.id" />
+			</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.name" />
+			</el-form-item>
+		</el-form>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="dialogVisible = false">È¡Ïû</el-button>
+				<el-button type="primary" @click="updataNewStudent()"> È·¶¨ </el-button>
+			</div>
+		</template> 
+	</el-dialog>
+
+
+</template>
+
+<style>
\ No newline at end of file