@zengqiao@新增修改删除角色

dmp-edge-ai/src/service/RoleService.js

@@ -23,3 +23,49 @@ export function list(data) {
    params: data
  })
}
/**
 * 根据角色Id获取角色详情
 * @param roleId
 */
export function getRoleInfo(roleId) {
  return request({
    url: `/role/info/${roleId}`,
    method: 'get'
  })
}
/**
 * 新增角色
 * @param data
 */
export function add(data) {
  return request({
    url: '/role/add',
    method: 'post',
    data
  })
}
/**
 * 编辑角色
 * @param data
 */
export function edit(data) {
  return request({
    url: '/role/edit',
    method: 'post',
    data
  })
}
/**
 * 根据角色Id删除角色
 * @param roleId
 */
export function deleteRole(roleId) {
  return request({
    url: `/role/delete/${roleId}`,
    method: 'get'
  })
}

dmp-edge-ai/src/views/system/role/components/BaseDialog.vue

@@ -0,0 +1,107 @@
<template>
  <el-dialog :title="title" class="common-modal" :visible.sync="dialogVisible" width="550px" @open="initData">
    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
      <el-form-item label="角色名称" prop="roleName">
        <el-input v-model.trim="form.roleName"></el-input>
      </el-form-item>
      <el-form-item label="角色描述" prop="description">
        <el-input v-model.trim="form.description"></el-input>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button v-if="!submitLoading" type="primary" @click="submit(modalType)">确认</el-button>
      <el-button v-else type="primary" :loading="submitLoading">提交中</el-button>
      <el-button @click="dialogVisible = false">关闭并返回</el-button>
    </span>
  </el-dialog>
</template>
<script>
import * as RoleService from '@/service/RoleService'
import { ModalType } from '@/utils/constant'
export default {
  name: 'BaseDialog',
  props: {
    roleId: {
      type: [Number, String]
    },
    show: {
      type: Boolean,
      required: true,
      default: false
    }
  },
  data() {
    return {
      form: {
        roleName: '',
        description: ''
      },
      rules: {
        roleName: [{ required: true, message: '请输入角色名称', trigger: 'blur' }]
      },
      modalType: ModalType.ADD,
      submitLoading: false
    }
  },
  computed: {
    dialogVisible: {
      set(val) {
        this.$emit('update:show', val)
      },
      get() {
        return this.show
      }
    },
    title() {
      return this.modalType === ModalType.ADD ? '新增角色' : '编辑角色'
    }
  },
  methods: {
    /**
     * 初始化模态框
     */
    initData() {
      this.$refs.form && this.$refs.form.resetFields()
      this.form = {
        roleName: '',
        description: ''
      }
      if (this.roleId) {
        // 编辑
        this.modalType = ModalType.EDIT
        RoleService.getRoleInfo(this.roleId).then((res) => {
          this.form = { ...res }
        })
      } else {
        // 新增
        this.modalType = ModalType.ADD
      }
    },
    submit(type) {
      this.$refs['form'].validate(async (valid) => {
        if (!valid) {
          return
        }
        const params = { ...this.form }
        this.submitLoading = true
        try {
          if (type === ModalType.ADD) {
            // 新增
            await RoleService.add(params)
          } else {
            // 编辑
            await RoleService.edit(params)
          }
          this.dialogVisible = false
          this.$emit('refresh')
        } finally {
          this.submitLoading = false
        }
      })
    }
  }
}
</script>
<style scoped lang="scss"></style>

dmp-edge-ai/src/views/system/role/index.vue

@@ -10,7 +10,7 @@
          clearable
          v-model="searchContent.keywords"
          style="width: 280px"
          placeholder="请输入角色名称/数据范围/角色描述"
          placeholder="请输入角色名称"
        ></el-input>
        <!--    <el-select v-model="searchContent.type" style="width: 200px" placeholder="角色类型" clearable>
          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
@@ -28,10 +28,11 @@
      <el-table :data="tableData" border :header-cell-style="headerStyle">
        <el-table-column label="角色名称" prop="roleName" width="180"></el-table-column>
        <el-table-column label="角色描述" prop="description" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作" width="210">
        <el-table-column label="操作" width="250">
          <template slot-scope="{ row }">
            <a class="table-option" @click="edit(row)">编辑</a>
            <a class="table-option" @click="assignMenu(row)">菜单分配</a>
            <a class="table-option" @click="assignOrganize(row)">组织权限分配</a>
            <a class="table-option" @click="deleteItem(row)">删除</a>
          </template>
        </el-table-column>
@@ -50,6 +51,7 @@
      >
      </el-pagination>
    </div>
    <base-dialog :show.sync="baseVisible" :roleId="roleId" @refresh="search"> </base-dialog>
  </div>
</template>
@@ -59,7 +61,8 @@ import * as RoleService from '@/service/RoleService'
export default {
  name: 'Role',
  components: {
    PageHeader
    PageHeader,
    BaseDialog: () => import('./components/BaseDialog')
  },
  data() {
    return {
@@ -76,46 +79,52 @@ export default {
      pagination: {
        pageNumber: 1, // 页码
        pageSize: 10, // 每页条数
        total: 50 // 总数
        total: 0 // 总数
      },
      options: [
        {
          value: '选项1',
          label: '黄金糕'
        },
        {
          value: '选项2',
          label: '双皮奶'
        },
        {
          value: '选项3',
          label: '蚵仔煎'
        },
        {
          value: '选项4',
          label: '龙须面'
        },
        {
          value: '选项5',
          label: '北京烤鸭'
        }
      ],
      tableData: []
      tableData: [],
      roleId: '',
      baseVisible: false
    }
  },
  methods: {
    addRole() {
      console.log(111)
      this.roleId = ''
      this.baseVisible = true
    },
    edit(row) {
      console.log(row)
      this.roleId = row.roleId
      this.baseVisible = true
    },
    assignMenu(row) {
      console.log(row)
    },
    deleteItem(row) {
    assignOrganize(row) {
      console.log(row)
    },
    deleteItem(row) {
      this.$confirm(`您确定删除该角色吗？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true
            instance.confirmButtonText = '删除中...'
            RoleService.deleteRole(row.roleId)
              .then(() => {
                this.search()
                done()
              })
              .finally(() => {
                instance.confirmButtonText = '确定'
                instance.confirmButtonLoading = false
              })
          } else {
            done()
          }
        }
      })
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      console.log(this.pagination)

dmp-edge-ai/src/views/system/user/index.vue

@@ -357,7 +357,6 @@ export default {
      })
    },
    changePassword(row) {
      console.log(row)
      this.changePasswordUserId = row.userId
      this.changePasswordDialog = true
    },