|
@ -18,35 +18,35 @@ |
|
|
<!--列表--> |
|
|
<!--列表--> |
|
|
<template> |
|
|
<template> |
|
|
<el-table :data="users" highlight-current-row v-loading="listLoading" style="width: 100%;"> |
|
|
<el-table :data="users" highlight-current-row v-loading="listLoading" style="width: 100%;"> |
|
|
<el-table-column type="index" width="60"> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="name" label="姓名" width="120" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="age" label="年龄" width="100" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="birth" label="生日" width="120" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="addr" label="地址" min-width="180" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column inline-template :context="_self" label="操作" width="150"> |
|
|
|
|
|
|
|
|
<el-table-column type="index" width="60"> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="name" label="姓名" width="120" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="age" label="年龄" width="100" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="birth" label="生日" width="120" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column prop="addr" label="地址" min-width="180" sortable> |
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
<el-table-column inline-template :context="_self" label="操作" width="150"> |
|
|
<span> |
|
|
<span> |
|
|
<el-button size="small" @click="handleEdit(row)">编辑</el-button> |
|
|
<el-button size="small" @click="handleEdit(row)">编辑</el-button> |
|
|
<el-button type="danger" size="small" @click="handleDel(row)">删除</el-button> |
|
|
<el-button type="danger" size="small" @click="handleDel(row)">删除</el-button> |
|
|
</span> |
|
|
</span> |
|
|
</el-table-column> |
|
|
|
|
|
</el-table> |
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
</el-table-column> |
|
|
|
|
|
</el-table> |
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
<!--分页--> |
|
|
|
|
|
<el-col :span="24" class="toolbar" style="padding-bottom:10px;"> |
|
|
|
|
|
<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;"> |
|
|
|
|
|
</el-pagination> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
<!--分页--> |
|
|
|
|
|
<el-col :span="24" class="toolbar" style="padding-bottom:10px;"> |
|
|
|
|
|
<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="20" :total="total" style="float:right;"> |
|
|
|
|
|
</el-pagination> |
|
|
|
|
|
</el-col> |
|
|
|
|
|
|
|
|
<!--编辑界面--> |
|
|
|
|
|
<el-dialog :title="editFormTtile" v-model="editFormVisible" :close-on-click-modal="false"> |
|
|
|
|
|
|
|
|
<!--编辑界面--> |
|
|
|
|
|
<el-dialog :title="editFormTtile" v-model="editFormVisible" :close-on-click-modal="false"> |
|
|
<el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm"> |
|
|
<el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm"> |
|
|
<el-form-item label="姓名" prop="name"> |
|
|
<el-form-item label="姓名" prop="name"> |
|
|
<el-input v-model="editForm.name" auto-complete="off"></el-input> |
|
|
<el-input v-model="editForm.name" auto-complete="off"></el-input> |
|
@ -72,11 +72,11 @@ |
|
|
</el-form-item> |
|
|
</el-form-item> |
|
|
</el-form> |
|
|
</el-form> |
|
|
<div slot="footer" class="dialog-footer"> |
|
|
<div slot="footer" class="dialog-footer"> |
|
|
<el-button @click.native="editFormVisible = false">取 消</el-button> |
|
|
|
|
|
<el-button type="primary" @click.native="editSubmit" :loading="editLoading">{{btnEditText}}</el-button> |
|
|
|
|
|
|
|
|
<el-button @click.native="editFormVisible = false">取消</el-button> |
|
|
|
|
|
<el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button> |
|
|
</div> |
|
|
</div> |
|
|
</el-dialog> |
|
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
</el-dialog> |
|
|
|
|
|
</section> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script> |
|
|
<script> |
|
@ -106,7 +106,6 @@ |
|
|
addr: '' |
|
|
addr: '' |
|
|
}, |
|
|
}, |
|
|
editLoading: false, |
|
|
editLoading: false, |
|
|
btnEditText: '提 交', |
|
|
|
|
|
editFormRules: { |
|
|
editFormRules: { |
|
|
name: [ |
|
|
name: [ |
|
|
{ required: true, message: '请输入姓名', trigger: 'blur' } |
|
|
{ required: true, message: '请输入姓名', trigger: 'blur' } |
|
@ -185,7 +184,6 @@ |
|
|
_this.$confirm('确认提交吗?', '提示', {}).then(() => { |
|
|
_this.$confirm('确认提交吗?', '提示', {}).then(() => { |
|
|
_this.editLoading = true; |
|
|
_this.editLoading = true; |
|
|
NProgress.start(); |
|
|
NProgress.start(); |
|
|
_this.btnEditText = '提交中'; |
|
|
|
|
|
|
|
|
|
|
|
if (_this.editForm.id == 0) { |
|
|
if (_this.editForm.id == 0) { |
|
|
//新增 |
|
|
//新增 |
|
@ -199,7 +197,6 @@ |
|
|
addUser(para).then((res) => { |
|
|
addUser(para).then((res) => { |
|
|
_this.editLoading = false; |
|
|
_this.editLoading = false; |
|
|
NProgress.done(); |
|
|
NProgress.done(); |
|
|
_this.btnEditText = '提 交'; |
|
|
|
|
|
_this.$notify({ |
|
|
_this.$notify({ |
|
|
title: '成功', |
|
|
title: '成功', |
|
|
message: '提交成功', |
|
|
message: '提交成功', |
|
@ -221,7 +218,6 @@ |
|
|
editUser(para).then((res) => { |
|
|
editUser(para).then((res) => { |
|
|
_this.editLoading = false; |
|
|
_this.editLoading = false; |
|
|
NProgress.done(); |
|
|
NProgress.done(); |
|
|
_this.btnEditText = '提 交'; |
|
|
|
|
|
_this.$notify({ |
|
|
_this.$notify({ |
|
|
title: '成功', |
|
|
title: '成功', |
|
|
message: '提交成功', |
|
|
message: '提交成功', |
|
@ -258,7 +254,9 @@ |
|
|
this.getUsers(); |
|
|
this.getUsers(); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style scoped> |
|
|
<style scoped> |
|
|
|
|
|
|
|
|
</style> |
|
|
</style> |