Skip to content

9
912project
提交 aaad34f4 authored 作者: CRS's avatar CRS
浏览文件
操作

合并分支 'crs' 到 'master'

Crs 查看合并请求 !4
上级 61988fe5 2fa4d062
隐藏空白字符变更
内嵌 并排
正在显示 包含 504 行增加 和 26 行删除
src/components/basicInformation/person/addPerson.vue 0 → 100644
浏览文件 @ aaad34f4
<template>
<div class="addPerson">
<p class="dialog-header">
<span>新增人员</span>
</p>
<div class="content">
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<p class="rowForm">
<el-form-item label="名称:" class="inline" prop="name">
<el-input v-model="form.name" placeholder="请输入名称"></el-input>
</el-form-item>
<el-form-item label="性别:" class="inline" prop="sex">
<el-radio-group v-model="form.sex">
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</el-form-item>
</p>
<p class="rowForm">
<el-form-item label="账户:" class="inline" prop="userName">
<el-input v-model="form.userName" placeholder="请输入账户名称"></el-input>
</el-form-item>
<el-form-item label="电话:" class="inline" prop="phone">
<el-input v-model="form.phone" placeholder="请输入电话"></el-input>
</el-form-item>
</p>
<p class="rowForm">
<el-form-item label="角色:" class="inline" prop="role">
<el-select v-model="form.role" placeholder="请选择角色">
<el-option v-for="item of roleList" :label="item.name" :value="item.id" :key="item.name"></el-option>
</el-select>
</el-form-item>
<el-form-item label="单位:" class="inline" prop="unit">
<el-select v-model="form.unit" placeholder="请选择单位">
<el-option v-for="item of unitList" :label="item.name" :value="item.id" :key="item.name"></el-option>
</el-select>
</el-form-item>
</p>
<p>
<el-form-item label="照片:" class="inline">
<el-upload
action="https://jsonplaceholder.typicode.com/posts/"
list-type="picture-card"
:limit="1"
:http-request="uploadFile"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
</p>
<p class="line"></p>
<p class="buttonClick">
<span class="buttonCancl" @click="resetForm('form')">取消</span>
<span class="buttonSave" @click="submitForm('form')">保存</span>
</p>
</el-form>
</div>
</div>
</template>
<script>
export default {
props: ['roleList', 'unitList'],
data () {
return {
form: {
name: '',
sex: '男',
userName: '',
phone: '',
role: '',
unit: ''
},
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' }
],
userName: [
{ required: true, message: '请输入账户', trigger: 'blur' }
]
},
dialogImageUrl: ''
}
},
created() {
},
mounted(){
},
methods: {
// 表单提交
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
console.log(this.form);
let val = {
'name': this.form.name,
'number': this.form.phone,
'roleId': this.form.role,
'unitId': this.form.unit,
'userName': this.form.userName,
'sex': this.form.sex
}
this.$server.postUserAdd(val).then((res) => { // 数据请求
if (res.data.code === 200) {
this.$message.success('新增人员成功！');
this.resetForm('form')
}
})
} else {
return false;
}
});
},
// 取消
resetForm(formName) {
this.$refs[formName].resetFields();
this.$emit('on-cancel')
},
uploadFile(file) {
console.log(file)
},
handleRemove(file, fileList) {
console.log(file, fileList);
}
},
components: {
},
watch: {
}
}
</script>
<style scoped>
.addPerson .content{
padding: 50px 80px 0 80px;
}
.addPerson>>>.el-input__inner{
border: 1px solid rgba(8,104,157,.3);
border-radius: 2px;
font-size: 18px;
color: #999;
height: 34px;
line-height: 34px;
width: 180px;
}
.addPerson .line{
margin: 0px 30px 0 30px;
height: 1px;
background: rgba(72,119,230,0.2);
}
.addPerson .buttonClick{
display: flex;
justify-content: space-evenly;
margin-top: 20px;
}
.addPerson .inline{
display: inline-block;
}
.addPerson>>>.el-form-item__label{
font-size: 18px;
color: #666;
}
.addPerson>>>.el-radio__label{
font-size: 18px;
color: #999;
}
.addPerson>>>.el-upload-list--picture-card .el-upload-list__item, .addPerson>>>.el-upload--picture-card{
height: 90px;
width: 70px;
line-height: 90px;
}
.addPerson>>>.el-form-item{
margin-bottom: 15px;
}
</style>
src/components/basicInformation/person/person.vue
浏览文件 @ aaad34f4
......@@ -3,14 +3,36 @@
<el-row>
<el-col :span="24">
<div class="content">
<p class="title">角色管理</p>
<p class="title">人员管理</p>
<p class="search">
<span class="searchVal">
<span>角色名称：</span>
<span>姓名：</span>
<el-input v-model="searchVal" size="medium" placeholder="请输入"></el-input>
</span>
<span class="searchVal">
<span>角色：</span>
<el-select v-model="searchRole" placeholder="请选择" clearable>
<el-option
v-for="item in roleList"
:key="item.name"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</span>
<span class="searchVal">
<span>单位：</span>
<el-select v-model="searchUnit" placeholder="请选择" clearable>
<el-option
v-for="item in unitList"
:key="item.name"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</span>
<span class="button" @click="search">搜索</span>
<span class="button new" @click="addrole">新增角色</span>
<span class="button new" @click="addperson">新增人员</span>
</p>
<div class="common-table">
<el-table
......@@ -21,23 +43,29 @@
style="width: 100%;margin-bottom: 10px;">
<el-table-column
prop="name"
label="人员名称"
align="center">
</el-table-column>
<el-table-column
prop="roleName"
label="角色"
align="center">
</el-table-column>
<el-table-column
prop="id"
label="人员"
prop="unitName"
label="单位"
align="center">
<template slot-scope="scope">
<!-- <span class="change"><img src="./img/look.png">查看</span>-->
</template>
</el-table-column>
<el-table-column
prop="authorityList"
label="权限"
prop="number"
label="联系方式"
align="center">
</el-table-column>
<el-table-column
label="查看"
align="center">
<template slot-scope="scope">
<!-- <span class="change" @click="readAuthority(scope.row)"><img src="./img/look.png">查看</span>-->
<span class="change" @click="read(scope.row)"><img src="./img/look.png">查看</span>
</template>
</el-table-column>
</el-table>
......@@ -61,24 +89,27 @@
<!-- 新增 / 编辑 公用弹窗 -->
<el-dialog :visible.sync="openModel" class="model">
<img src="../../../assets/img/close.png" class="closeModel" @click="reset()">
<component :is="components" @on-cancel="reset"></component>
<component :is="components" @on-cancel="reset" :roleList="roleList" :unitList="unitList"></component>
</el-dialog>
</div>
</template>
<script>
import add from './addPerson';
export default {
data () {
return {
searchVal: '',
currentPage: 1, // 分页第一页
pagesize: 8, // 每页个数
totleLength: 0, // 获取后台传的所有数据的长度
openModel: false, // 弹框开关
components: '', // 当前弹框内容
rolename: '', // 角色名称
roleList: '',
allData:[] // 列表内容
searchVal: '', // 搜索姓名
searchRole: '', // 搜索角色
searchUnit: '', // 搜索单位
allData:[], // 列表内容
roleList: [], // 角色列表
unitList: [] // 单位列表
}
},
created() {
......@@ -94,18 +125,38 @@ export default {
)
this.$store.commit('changeSidebar', val);
}
this.init()
this.$server.getRolefindAll().then((res) => { // 数据请求
if (res.data.code === 200) {
this.roleList = res.data.data;
this.$server.getUnitfindAll().then((res) => { // 数据请求
if (res.data.code === 200) {
this.unitList = res.data.data;
if (this.$route.params.value !== undefined) { // 角色页面跳转过来所带参数
console.log(this.$route.params.value);
for (let item of this.roleList) {
if (item.name === this.$route.params.value.name) {
this.searchRole = item.id
}
}
}
this.init()
}
})
}
})
},
methods: {
// 初始请求
init() {
let val;
if (this.searchVal !== '') {
if (this.searchVal !== '' || this.searchRole !== '' || this.searchUnit !== '') {
val = {
'page': this.currentPage,
'pageSize': this.pagesize,
't': {
'name': this.searchVal
'name': this.searchVal,
'roleId': this.searchRole,
'unitId': this.searchUnit
}
}
} else {
......@@ -114,7 +165,9 @@ export default {
'pageSize': this.pagesize
}
}
this.$server.postsearch(val).then((res) => { // 数据请求
console.log(val);
this.$server.postUserSearch(val).then((res) => { // 数据请求
console.log(res.data.data)
if (res.data.code === 200) {
this.allData = res.data.data.rows;
this.totleLength = res.data.data.total;
......@@ -139,9 +192,19 @@ export default {
reset() {
this.init();
this.openModel = false;
},
// 查看
read(val) {
this.$router.push({name: 'personPage',params:{'value': val}});
},
// 新增人员
addperson() {
this.openModel = true;
this.components = 'add'
}
},
components: {
add
},
watch: {
}
......@@ -176,10 +239,13 @@ export default {
color: #4663a6;
}
.person .content .searchVal>span{
width: 140px;
width: 66px;
display: inline-block;
line-height: 34px;
}
.person .content .searchVal:nth-child(2),.person .content .searchVal:nth-child(3){
margin-left: 4%;
}
.person .content .change{
color: #4877e6;
cursor: pointer;
......@@ -201,6 +267,9 @@ export default {
line-height: 34px;
width: 180px;
}
.person>>>.el-select .el-input .el-select__caret{
line-height: 25px;
}
.person .content .button{
display: inline-block;
width: 100px;
......@@ -209,7 +278,7 @@ export default {
text-align: center;
background: #4877e6;
cursor: pointer;
margin-left: 100px;
margin-left: 30px;
border-radius: 2px;
color: #fff;
font-size: 18px;
......
src/components/basicInformation/person/personPage.vue 0 → 100644
浏览文件 @ aaad34f4
<template>
<div class="personPage">
<el-row>
<el-col :span="24">
<div class="content">
<el-row>
<el-col :span="9">
<p class="title">人员信息</p>
<p class="search">
<span class="value">
<span>姓名：</span>
<el-input v-model="allVal.name" size="medium" :disabled="true"></el-input>
</span>
</p>
<p class="search">
<span class="value">
<span>角色：</span>
<el-input v-model="allVal.role" size="medium" :disabled="true"></el-input>
</span>
</p>
<p class="search">
<span class="value">
<span>联系电话：</span>
<el-input v-model="allVal.phone" size="medium" :disabled="true"></el-input>
</span>
</p>
<p class="search">
<span class="value">
<span>性别：</span>
<el-input v-model="allVal.sex" size="medium" :disabled="true"></el-input>
</span>
</p>
<p class="search">
<span class="value">
<span>公司：</span>
<el-input v-model="allVal.unit" size="medium" :disabled="true"></el-input>
</span>
</p>
</el-col>
<el-col :span="5">
<p class="status">
<span>状态：</span>
<img src="./img/click.png" style="width: 21px;height: 21px;" v-if="allVal.status === 1">
<img src="./img/clickN.png" style="width: 21px;height: 21px;" v-if="allVal.status === 0">
<span class="Sfont">在线</span>
</p>
</el-col>
<el-col :span="10">
<div class="upload">
<img src="./img/upload.png">
<p>上传个人照片</p>
</div>
<div class="jump">
<span class="button">相关项目</span>
<span class="button">相关评价</span>
</div>
</el-col>
</el-row>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
data () {
return {
allVal: {
name: '',
phone: '',
sex: '',
role: '',
unit: '',
status: 0
},
fileList: [],
dialogImageUrl: ''
}
},
created() {
},
mounted(){
let val = this.$store.getters.getSidebar;
if (val[val.length - 1].path !== 'personPage') {
val.push(
{
name: '人员信息',
path: 'personPage'
}
)
this.$store.commit('changeSidebar', val);
}
let value = this.$route.params.value;
if (value !== '' || value !== undefined) {
this.allVal.name = value.name;
this.allVal.phone = value.number;
this.allVal.sex = value.sex;
this.allVal.role = value.roleName;
this.allVal.unit = value.unitName;
}
},
methods: {
},
components: {
},
watch: {
}
}
</script>
<style scoped>
.personPage{
background: #ebf0f8;
width: 100%;
}
.personPage .content{
margin: 40px;
height: 841px;
background: #fff;
overflow: hidden;
}
.personPage .content .title{
padding: 30px 0 0 60px;
font-size: 20px;
color: #233b6e;
}
.personPage .content .search{
position: relative;
margin-top: 36px;
padding: 0px 0px 0px 70px;
}
.personPage .content .value{
width: 410px;
display: flex;
font-size: 18px;
color: #666;
}
.personPage .content .status, .personPage .content .upload, .personPage .content .jump{
margin-top: 86px;
font-size: 18px;
color: #333;
cursor: default;
}
.personPage .content .upload{
cursor: pointer;
width: 170px;
text-align: center;
display: inline-block;
}
.personPage .content .upload p{
margin-top: 10px;
}
.personPage .content .jump{
display: inline-block;
vertical-align: top;
width: 365px;
text-align: right;
}
.personPage .content .status>span{
vertical-align: bottom;
}
.personPage .content .Sfont{
display: inline-block;
margin-left: 5px;
}
.personPage .content .value>span{
width: 150px;
display: inline-block;
line-height: 34px;
text-align: right;
}
.personPage .content .button{
display: inline-block;
width: 100px;
height: 34px;
line-height: 34px;
text-align: center;
background: #4877e6;
cursor: pointer;
margin-left: 55px;
border-radius: 2px;
color: #fff;
font-size: 18px;
}
.personPage .content .button:hover{
background: rgba(72,119,230,.6);
}
.personPage>>>.el-input--medium .el-input__inner{
font-size: 18px;
color: #333;
font-family: 'Regular';
}
</style>
src/components/basicInformation/role/role.vue
浏览文件 @ aaad34f4
......@@ -29,7 +29,7 @@
label="人员"
align="center">
<template slot-scope="scope">
<span class="change"><img src="./img/look.png">查看</span>
<span class="change" @click="readPerson(scope.row)"><img src="./img/look.png">查看</span>
</template>
</el-table-column>
<el-table-column
......@@ -162,6 +162,10 @@ export default {
this.rolename = val;
this.components = 'authority';
}
},
// 跳转到人员列表
readPerson(row) {
this.$router.push({name: 'person',params:{'value': row}});
}
},
components: {
......
src/router/index.js
浏览文件 @ aaad34f4
......@@ -68,6 +68,12 @@ export default new Router({
name: 'person',
component: resolve => require(['../components/basicInformation/person/person.vue'], resolve)
},
// 基础资料管理-人员信息
{
path: '/personPage',
name: 'personPage',
component: resolve => require(['../components/basicInformation/person/personPage.vue'], resolve)
},
]
}
]
......
src/services/server.js
浏览文件 @ aaad34f4
......@@ -27,6 +27,29 @@ const server = {
data: data
});
},
postupdate(data) { // 更新角色权限
return axios('/role/update', {
method: 'put',
data: data
});
},
postUserSearch(data) { // 获取人员列表分页
return axios('/user/search', {
method: 'post',
data: data
});
},
getRolefindAll() { // 获取角色列表
return axios('/role/findAll', {
method: 'get'
});
},
postUserAdd(data) { // 新增用户
return axios('/user/add', {
method: 'post',
data: data
});
},
getUnitFindAll() { // 获取所有单位列表
return axios('/unit/findAll', {
method: 'get'
......@@ -37,6 +60,6 @@ const server = {
method: 'post',
data: data
});
},
}
}
export default server;
src/tools/element.js
浏览文件 @ aaad34f4
import Vue from 'vue'
import { Row, Col, Carousel, CarouselItem, Scrollbar, Input, Button, Table, TableColumn, Pagination, Dialog,Select,Radio,Option,
Upload, Message,} from 'element-ui'
import { Row, Col, Carousel, CarouselItem, Scrollbar, Input, Button, Table, TableColumn, Pagination, Dialog,
Message,Select, Option, Form, FormItem, Radio, RadioGroup, Upload,} from 'element-ui'
import './element-variables.scss'
Vue.use(Row);
Vue.use(Col);
......@@ -18,3 +18,10 @@ Vue.use(Option);
Vue.use(Radio);
Vue.use(Upload);
Vue.prototype.$message = Message;
Vue.use(Select);
Vue.use(Option);
Vue.use(Form);
Vue.use(FormItem);
Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(Upload);
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论