parent
4552ee1a80
commit
653deca63c
@ -0,0 +1,107 @@ |
||||
<template> |
||||
<div class="app-container"> |
||||
<el-form ref="form" :model="queryParams" label-width="80px" inline> |
||||
<el-form-item> |
||||
<el-input placeholder="请输入员工名称"></el-input> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-select v-model="queryParams.status" placeholder="全部" clearable style="width: 240px"> |
||||
<el-option v-for="dict in dict.type.employee_status" :key="dict.value" :label="dict.label" |
||||
:value="dict.value"/> |
||||
</el-select> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary">查询</el-button> |
||||
<el-button>重置</el-button> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-button type="primary" @click="open=true">新增员工</el-button> |
||||
<el-button>批量锁定</el-button> |
||||
<el-button>批量开启</el-button> |
||||
<el-button>批量删除</el-button> |
||||
<el-table :data="dataList" border class="table"> |
||||
<el-table-column type="selection"></el-table-column> |
||||
<el-table-column label="ID">1</el-table-column> |
||||
<el-table-column label="员工姓名">张三</el-table-column> |
||||
<el-table-column label="手机号">1888888888888</el-table-column> |
||||
<el-table-column label="角色">角色1、角色2</el-table-column> |
||||
<el-table-column label="状态"> |
||||
<el-switch/> |
||||
</el-table-column> |
||||
<el-table-column label="操作"> |
||||
<el-button type="text">编辑</el-button> |
||||
<el-button type="text">删除</el-button> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-form> |
||||
<el-dialog :visible.sync="open" title="新增员工"> |
||||
<el-form :model="addForm" inline label-width="100px"> |
||||
<el-form-item label="员工名称"> |
||||
<el-input placeholder="请输入"/> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="手机号"> |
||||
<el-input placeholder="请输入"/> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="登陆密码"> |
||||
<el-input placeholder="不填默认123456" type="password" show-password/> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="角色"> |
||||
<template v-for="(item,index) in addForm.roles"> |
||||
<br v-if="index>0"/> |
||||
<el-select placeholder="选择角色" v-model="addForm.roles[index]" :class="{'mt':index>0}"/> |
||||
<i class="el-icon-plus" @click="addForm.roles.push(undefined)"/> |
||||
<i class="el-icon-minus" v-if="index>0" @click="addForm.roles.splice(index,1)"/> |
||||
</template> |
||||
</el-form-item> |
||||
|
||||
</el-form> |
||||
<div class="text-center"> |
||||
<el-button type="primary" @click="save">保存</el-button> |
||||
<el-button>重置</el-button> |
||||
</div> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'EmployeeList', |
||||
dicts: ['employee_status'], |
||||
data() { |
||||
return { |
||||
open: false, |
||||
dataList: [{}], |
||||
addForm: { |
||||
roles: [undefined] |
||||
}, |
||||
queryParams: { |
||||
status: undefined |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
save() { |
||||
this.$modal.msgSuccess('保存成功') |
||||
this.open = false |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.table { |
||||
margin-top: 10px; |
||||
} |
||||
|
||||
.mt { |
||||
margin-top: 10px; |
||||
} |
||||
|
||||
i { |
||||
color: #1684FC; |
||||
margin-left: 10px; |
||||
} |
||||
</style> |
@ -0,0 +1,108 @@ |
||||
<template> |
||||
<div class="app-container"> |
||||
<el-form :model="queryParams" inline> |
||||
<el-form-item> |
||||
<el-input placeholder="请输入角色名称"/> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-input placeholder="请输入角色ID"/> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<el-button type="primary">查询</el-button> |
||||
<el-button>重置</el-button> |
||||
|
||||
</el-form-item> |
||||
|
||||
</el-form> |
||||
<el-button type="primary" @click="open=true"> 新增角色</el-button> |
||||
<el-button>批量锁定</el-button> |
||||
<el-button>批量开启</el-button> |
||||
<el-button>批量删除</el-button> |
||||
<el-table :data="dataList" border class="table"> |
||||
<el-table-column type="selection" align="center"></el-table-column> |
||||
<el-table-column type="index" align="center" label="序号"></el-table-column> |
||||
<el-table-column align="center" label="角色名称">财务主管</el-table-column> |
||||
<el-table-column align="center" label="权限">首页、财务管理</el-table-column> |
||||
<el-table-column align="center" label="备注"></el-table-column> |
||||
<el-table-column align="center" label="创建时间">2022-12-31 12:31</el-table-column> |
||||
<el-table-column align="center" label="状态"> |
||||
<el-switch/> |
||||
</el-table-column> |
||||
<el-table-column align="center" label="操作"> |
||||
<el-button type="text">编辑</el-button> |
||||
<el-button type="text">删除</el-button> |
||||
</el-table-column> |
||||
|
||||
</el-table> |
||||
<el-dialog :visible.sync="open" title="新增角色"> |
||||
<el-form inline label-width="100px"> |
||||
<el-form-item label="角色名称"> |
||||
<el-input placeholder="请输入"></el-input> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="序号"> |
||||
<el-input placeholder="数字越小排名越靠前"></el-input> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="是否禁用"> |
||||
<el-switch/> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="备注"> |
||||
<el-input type="textarea" :autosize="{minRows:3}" placeholder="请输入"></el-input> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item label="选择权限"> |
||||
<el-button type="text">全选</el-button> |
||||
</el-form-item> |
||||
<br/> |
||||
<el-form-item> |
||||
<el-tree :data="permissions" show-checkbox node-key="id"/> |
||||
</el-form-item> |
||||
</el-form> |
||||
<div class="text-center"> |
||||
<el-button type="primary" @click="save">保存</el-button> |
||||
<el-button>重置</el-button> |
||||
</div> |
||||
</el-dialog> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'RoleManagement', |
||||
data() { |
||||
return { |
||||
permissions: [{ id: 33, label: '首页' }, { |
||||
id: 1, |
||||
label: '用户管理', |
||||
children: [{ |
||||
id: 4, |
||||
label: '编辑' |
||||
}, { |
||||
id: 5, |
||||
label: '查看' |
||||
}, { |
||||
id: 6, |
||||
label: '删除' |
||||
}] |
||||
}], |
||||
open: false, |
||||
dataList: [{}], |
||||
queryParams: {} |
||||
} |
||||
}, |
||||
methods: { |
||||
save() { |
||||
this.$modal.msgSuccess('保存成功') |
||||
this.open = false |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.table { |
||||
margin-top: 10px; |
||||
} |
||||
</style> |
Loading…
Reference in new issue