明梦爽
2022-04-17 5529b7077126be368abd444d45ec085d8c7779e3
src/components/Administrator/AdEdit.vue
@@ -1,24 +1,16 @@
<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 }} -->
@@ -27,18 +19,13 @@
              <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>
@@ -55,13 +42,9 @@
      </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>
@@ -78,65 +61,65 @@
</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: '确定',
@@ -147,63 +130,61 @@
      })
      //如果用户点击确定则返回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>