| | |
| | | <template> |
| | | <div> |
| | | <el-card class="box-card"> |
| | | <el-button type="primary" @click="add()" icon="el-icon-circle-plus" class='add'>注册新的管理员账号</el-button> |
| | | <el-button type="primary" @click="add()" icon="el-icon-circle-plus" class="add">注册新的管理员账号</el-button> |
| | | <!-- 新闻表格区域 --> |
| | | <el-table |
| | | :data="tableData" |
| | | border |
| | | style="width: 100%" |
| | | :header-cell-style="{textAlign: 'center'}" |
| | | :cell-style="{ textAlign: 'center' }" |
| | | > |
| | | <el-table :data="tableData" border style="width: 100%" :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }"> |
| | | <el-table-column type="index" label="序号" width="50"> |
| | | <!-- <template slot-scope="scope"> |
| | | <span>{{ (currentPage-1)*pageSize+scope.$index+1 }}</span> |
| | | </template> --> |
| | | </el-table-column> |
| | | <el-table-column prop="username" label="普通管理员账号" width="" > |
| | | </el-table-column> |
| | | <el-table-column prop="id" label="id" width=""> |
| | | </el-table-column> |
| | | <el-table-column prop="username" label="普通管理员账号" width=""> </el-table-column> |
| | | <el-table-column prop="id" label="id" width=""> </el-table-column> |
| | | <el-table-column label="操作" width=""> |
| | | <template slot-scope="scope"> |
| | | <!-- {{ scope.row.id }} --> |
| | |
| | | <el-button type="danger" @click="deleteAds(scope.row.id)" icon="el-icon-delete"></el-button> |
| | | </div> |
| | | </template> |
| | | |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <!-- 修改账户的对话框 --> |
| | | <el-dialog |
| | | title="修改普通管理员密码" |
| | | :visible.sync="editDialogVisible" |
| | | width="50%" |
| | | @close="editClose"> |
| | | <el-dialog title="修改普通管理员密码" :visible.sync="editDialogVisible" width="50%" @close="editClose"> |
| | | <!-- rules表单验证规则,ref当前表单的验证对象 --> |
| | | <el-form ref="editFormRef" :model="editForm" label-width="80px" status-icon> |
| | | <el-form ref="editFormRef" :model="editForm" label-width="80px" status-icon> |
| | | <el-form-item label="用户名:"> |
| | | <el-input v-model="editForm.username" prefix-icon="iconfont icon-user" placeholder="请输入账号" clearable=""></el-input> |
| | | </el-form-item> |
| | |
| | | </span> |
| | | </el-dialog> |
| | | <!-- 添加管理员对话框 --> |
| | | <el-dialog |
| | | title="添加普通管理员" |
| | | :visible.sync="addDialogVisible" |
| | | width="50%" |
| | | @close="addClose"> |
| | | <el-dialog title="添加普通管理员" :visible.sync="addDialogVisible" width="50%" @close="addClose"> |
| | | <!-- rules表单验证规则,ref当前表单的验证对象 --> |
| | | <el-form ref="addFormRef" :model="addForm" label-width="80px" status-icon> |
| | | <el-form ref="addFormRef" :model="addForm" label-width="80px" status-icon> |
| | | <el-form-item label="用户名:"> |
| | | <el-input v-model="addForm.username" prefix-icon="iconfont icon-user" placeholder="请输入账号" clearable=""></el-input> |
| | | </el-form-item> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getmain,editAccount,deleteAd,addAd } from '../../api/api' |
| | | import { getmain, editAccount, deleteAd, addAd } from '../../api/api' |
| | | export default { |
| | | data() { |
| | | return { |
| | | tableData:[], //普通管理员列表 |
| | | editDialogVisible:false, |
| | | addDialogVisible:false, |
| | | editForm:{ username:'',oldPassword:'',password:'' }, //修改表单对象 |
| | | addForm:{ username:'',password:'' } //添加管理对象 |
| | | tableData: [], //普通管理员列表 |
| | | editDialogVisible: false, |
| | | addDialogVisible: false, |
| | | editForm: { username: '', oldPassword: '', password: '' }, //修改表单对象 |
| | | addForm: { username: '', password: '' } //添加管理对象 |
| | | } |
| | | }, |
| | | created(){ |
| | | created() { |
| | | this.ready() |
| | | }, |
| | | methods:{ |
| | | methods: { |
| | | //获取铺管列表 |
| | | ready(){ |
| | | ready() { |
| | | getmain().then(res => { |
| | | // console.log(res); |
| | | if(res.code == 200){ |
| | | if (res.code == 200) { |
| | | this.tableData = res.data |
| | | } |
| | | }) |
| | | }, |
| | | //展示编辑对话框 |
| | | showEditDialog(){ |
| | | showEditDialog() { |
| | | this.editDialogVisible = true |
| | | }, |
| | | editClose(){ |
| | | this.editForm.username = ''; |
| | | this.editForm.oldPassword = ''; |
| | | this.editForm.password = ''; |
| | | editClose() { |
| | | this.editForm.username = '' |
| | | this.editForm.oldPassword = '' |
| | | this.editForm.password = '' |
| | | }, |
| | | cancel(){ |
| | | this.editForm.username = ''; |
| | | this.editForm.oldPassword = ''; |
| | | this.editForm.password = ''; |
| | | cancel() { |
| | | this.editForm.username = '' |
| | | this.editForm.oldPassword = '' |
| | | this.editForm.password = '' |
| | | this.editDialogVisible = false |
| | | }, |
| | | //编辑确定事件 |
| | | subEdit(){ |
| | | subEdit() { |
| | | const data = { |
| | | username:this.editForm.username, |
| | | oldPassword:this.editForm.oldPassword, |
| | | password:this.editForm.password |
| | | username: this.editForm.username, |
| | | oldPassword: this.editForm.oldPassword, |
| | | password: this.editForm.password |
| | | } |
| | | editAccount(data).then(res => { |
| | | // console.log(res); |
| | | if(res.code == 200){ |
| | | if (res.code == 200) { |
| | | this.$message.success('账户修改成功') |
| | | this.editDialogVisible = false |
| | | this.ready() |
| | | }else{ |
| | | } else { |
| | | this.$message.error('账户修改失败') |
| | | } |
| | | }) |
| | | }, |
| | | //删除普通管理员 |
| | | async deleteAds(id){ |
| | | async deleteAds(id) { |
| | | // console.log(id); |
| | | const res = await this.$confirm('此操作将永久删除该管理账号, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | |
| | | }) |
| | | //如果用户点击确定则返回confirm |
| | | //如果用户点击取消则返回cancel |
| | | console.log(res); |
| | | if(res !== 'confirm'){ |
| | | console.log(res) |
| | | if (res !== 'confirm') { |
| | | return this.$message.info('已取消删除~') |
| | | }else{ |
| | | } else { |
| | | // console.log(id); |
| | | const data = { |
| | | id:id |
| | | id: id |
| | | } |
| | | //参数data 要以对象的形式传入 |
| | | deleteAd(data).then(res => { |
| | | // console.log('>>>'+res); |
| | | if(res.code == 200){ |
| | | if (res.code == 200) { |
| | | this.$message.success('删除成功!') |
| | | this.ready() |
| | | }else{ |
| | | } else { |
| | | return this.$message.error('删除失败!') |
| | | } |
| | | }) |
| | | } |
| | | }, |
| | | add(){ |
| | | add() { |
| | | this.addDialogVisible = true |
| | | }, |
| | | //注册取消清空 |
| | | canceladd(){ |
| | | this.addForm.username = ''; |
| | | this.addForm.password = ''; |
| | | canceladd() { |
| | | this.addForm.username = '' |
| | | this.addForm.password = '' |
| | | this.addDialogVisible = false |
| | | }, |
| | | addClose(){ |
| | | this.addForm.username = ''; |
| | | this.addForm.password = ''; |
| | | addClose() { |
| | | this.addForm.username = '' |
| | | this.addForm.password = '' |
| | | }, |
| | | //注册提交 |
| | | addEdit(){ |
| | | addEdit() { |
| | | const data = { |
| | | username:this.addForm.username, |
| | | password:this.addForm.password |
| | | username: this.addForm.username, |
| | | password: this.addForm.password |
| | | } |
| | | addAd(data).then(res => { |
| | | if(res.code == 200){ |
| | | if (res.code == 200) { |
| | | this.$message.success('注册成功') |
| | | this.addDialogVisible = false |
| | | this.ready() |
| | | }else{ |
| | | } else { |
| | | this.$message.error('注册失败') |
| | | } |
| | | }) |
| | | |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="less" scoped> |
| | | .add{ |
| | | .add { |
| | | margin-bottom: 10px; |
| | | } |
| | | |
| | | </style> |
| | | </style> |