bibi 3 years ago
parent bdb5efd205
commit 98193f9fee

@ -57,4 +57,32 @@ export function FindAllMenus(params) {
params: params, params: params,
}) })
} }
export function changeMenuShow(params) {
return httpService({
url: `/user/jurisdiction/isShowMenus`,
method: 'post',
data: params,
})
}
export function getActions(params) {
return httpService({
url: `/user/jurisdiction/findOperationByMId`,
method: 'get',
params: params,
})
}
export function changeActions(params) {
return httpService({
url: `/user/jurisdiction/isCheckOperation`,
method: 'post',
data: params,
})
}
// 当前用户菜单
export function getMenu(params) {
return httpService({
url: `/user/manageUser/findAllMenusByUser`,
method: 'GET',
params: params,
})
}

@ -4,61 +4,36 @@
<!-- 角色列表 --> <!-- 角色列表 -->
<a-col :span="5"> <a-col :span="5">
<div class="cardTitle">所有角色</div> <div class="cardTitle">所有角色</div>
<a-button class="add-btn" style="margin: 10px" @click="add.show = true"
>新增角色</a-button
>
<a-collapse accordion @change="rolechange"> <a-collapse accordion @change="rolechange">
<a-collapse-panel <a-collapse-panel
v-for="(item, index) in roleList" v-for="(item, index) in roleList"
:key="index" :key="index"
:header="item.name" :header="item.name"
> >
<a-button
type="link"
icon="form"
slot="extra"
@click.stop="editRole(item.id)"
>
</a-button>
<a-button
type="link"
slot="extra"
style="color: #ff4d4f"
icon="delete"
@click.stop="delRole(item.id)"
></a-button>
<div <div
v-for="(rolechild, indexs) in item.childrenList" v-for="(rolechild, indexs) in item.childrenList"
class="role-card" class="role-card"
:key="indexs" :key="indexs"
@click="rolechoose(rolechild.id)"
> >
<span class="role-li"> <span class="role-li">
<span>{{ rolechild.name || "无" }}</span> <span>{{ rolechild.name || "无" }}</span>
<span v-show="rolechild.name" <span v-show="rolechild.name"> </span>
><a-button type="link" icon="form" @click="editRole(rolechild.id)">
</a-button>
<a-button
type="link"
style="color: #ff4d4f"
icon="delete"
@click="delRole(rolechild.id)"
></a-button
></span>
</span> </span>
</div> </div>
</a-collapse-panel> </a-collapse-panel>
</a-collapse> </a-collapse>
</a-col> </a-col>
<!-- 人员表格 --> <!-- 功能表格 -->
<a-col :span="19"> <a-col :span="19">
<div class="treebox"> <div class="treebox">
<a-tree <a-tree
class="tree" class="tree"
v-model="checkedKeys" v-model="checkedKeys"
checkable checkable
checkStrictly
:replace-fields="replaceFields" :replace-fields="replaceFields"
:expanded-keys="expandedKeys" :expanded-keys="expandedKeys"
:auto-expand-parent="autoExpandParent"
:selected-keys="selectedKeys" :selected-keys="selectedKeys"
:tree-data="menus" :tree-data="menus"
@expand="onExpand" @expand="onExpand"
@ -68,31 +43,40 @@
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
<add-form <a-drawer
:show="add.show" title="操作"
:title="add.title" placement="right"
:list="roleList" :closable="false"
@close="addClose" :visible="actions.show"
@success='success' @close="onClose"
:id='add.editId' >
></add-form> <div class="content">
<div v-if="actionsList.length === 0"></div>
<a-checkbox
v-for="action in actionsList"
:checked="action.isCheck"
:key="action.id"
@change="onChange($event, action.id)"
>
{{ action.name }}</a-checkbox
>
</div>
</a-drawer>
</div> </div>
</template> </template>
<script> <script>
import { getrolelist, FindAllMenus, roleDel } from "@/api/basic/role"; import {
import addForm from "./form.vue"; getrolelist,
FindAllMenus,
changeMenuShow,
getActions,
changeActions,
} from "@/api/basic/role";
export default { export default {
components: {
addForm,
},
data() { data() {
return { return {
add: { roleId: null,
show: false,
title: "新增角色",
editId:null
},
roleList: [], roleList: [],
expandedKeys: [], expandedKeys: [],
replaceFields: { replaceFields: {
@ -100,11 +84,13 @@ export default {
title: "name", title: "name",
key: "id", key: "id",
}, },
autoExpandParent: true,
checkedKeys: [], checkedKeys: [],
selectedKeys: [], selectedKeys: [],
ActionsList: [], menus: [], //
menus: [], actionsList: [], //
actions: {
show: false,
},
}; };
}, },
mounted() { mounted() {
@ -116,60 +102,86 @@ export default {
this.roleList = res.data; this.roleList = res.data;
}); });
}, },
rolechoose(data) {
this.checkedKeys = [];
if (data !== undefined) {
this.roleId = data;
FindAllMenus({ roleId: this.roleId }).then((res) => {
this.menus = res.data;
this.defaultCheck(this.menus);
});
} else if (data === undefined) {
this.roleId = null;
}
},
rolechange(data) { rolechange(data) {
if (data) { if (data) {
this.searchForm.roleId = this.roleList[data].id; this.checkedKeys = [];
FindAllMenus({ roleId: this.searchForm.roleId }).then((res) => { this.roleId = this.roleList[data].id;
FindAllMenus({ roleId: this.roleId }).then((res) => {
this.menus = res.data; this.menus = res.data;
this.defaultCheck(this.menus);
}); });
} else { } else {
this.searchForm.roleId = null; this.roleId = null;
this.menus = [];
} }
}, },
success(){ defaultCheck(arr) {
this.getData() for (let item of arr) {
}, if (item.isShow === true && item.childrenList !== null) {
addClose() { this.checkedKeys.push(item.id);
this.add.show = false; this.defaultCheck(item.childrenList);
this.add.editId = undefined; } else if (item.isShow === true) {
}, this.checkedKeys.push(item.id);
//
editRole(id){
this.add.editId = id
this.add.title = '修改角色'
this.add.show= true;
},
//
delRole(id) {
var vm = this;
this.$confirm({
title: "是否删除",
// okText:'',
// cancelText:'',
icon: "delete",
onOk:()=> {
roleDel({roleId:id}).then(res=>{
if(res.code === 200){
this.$message.success(res.msg)
this.getData()
}else{
this.$message.error(res.msg)
}
})
} }
}); }
}, },
onExpand(expandedKeys) { onExpand(expandedKeys) {
this.expandedKeys = expandedKeys; this.expandedKeys = expandedKeys;
this.autoExpandParent = false; this.autoExpandParent = false;
}, },
onCheck(checkedKeys) { onCheck(checkedKeys, e) {
// console.log('onCheck', checkedKeys);
this.checkedKeys = checkedKeys; this.checkedKeys = checkedKeys;
// console.log(e.node.eventKey);
changeMenuShow({
roleId: this.roleId,
showMenusId: e.node.eventKey,
}).then((res) => {
if (res.code === 200) {
this.$message.success(res.msg);
} else {
this.$message.error(res.msg);
}
});
}, },
onSelect(selectedKeys, info) { onSelect(selectedKeys, info) {
// console.log('onSelect', info); // console.log('onSelect', info);
this.selectedKeys = selectedKeys; this.selectedKeys = selectedKeys;
// console.log(selectedKeys);
getActions({ roleId: this.roleId, menusId: this.selectedKeys[0] }).then(
(res) => {
this.actionsList = res.data;
this.actions.show = true;
}
);
},
onChange(e, id) {
changeActions({
roleId: this.roleId,
menusId: this.selectedKeys[0],
operationId: id,
}).then((res) => {
if (res.code === 200) {
this.$message.success(res.msg);
this.onSelect(this.selectedKeys)
} else {
this.$message.error(res.msg);
}
});
},
onClose() {
this.actions.show = false;
}, },
}, },
watch: { watch: {
@ -200,12 +212,11 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
/deep/.ant-tree ul { .treebox {
width: 200px; padding-left: 30px;
} }
.tree { .tree {
display: flex; display: flex;
margin-left: 20px;
} }
.role-card { .role-card {
line-height: 30px; line-height: 30px;
@ -221,4 +232,7 @@ export default {
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
} }
/deep/.ant-checkbox-wrapper + .ant-checkbox-wrapper {
margin: 0px;
}
</style> </style>

@ -228,6 +228,7 @@ export default {
addClose() { addClose() {
this.add.show = false; this.add.show = false;
this.add.editId = undefined; this.add.editId = undefined;
this.add.title = "新增角色";
}, },
// //
editRole(id) { editRole(id) {

@ -47,13 +47,37 @@
</a-row> </a-row>
</div> </div>
<div class="login-input" v-else-if="activeName === '2'"> <div class="login-input" v-else-if="activeName === '2'">
<a-cascader :options="cityList" placeholder="请选择城市" v-model='cityvalue' :show-search="{ filter }" @change="onChange" :field-names="{ label: 'name', value: 'id', children: 'cityList' }"/> <a-cascader
:options="cityList"
placeholder="请选择城市"
v-model="cityvalue"
:show-search="{ filter }"
@change="onChange"
:field-names="{
label: 'name',
value: 'id',
children: 'cityList',
}"
/>
<span class="form"> <span class="form">
<a-select v-model="communityCode" notFoundContent='该城市无可选择小区' :disabled='cityvalue.length===0' placeholder="请选择小区"> <a-select
<a-select-option v-for="item in communityList" :key='item.id' :value='item.code'>{{item.name}}</a-select-option> v-model="communityCode"
notFoundContent="该城市无可选择小区"
:disabled="cityvalue.length === 0"
placeholder="请选择小区"
>
<a-select-option
v-for="item in communityList"
:key="item.id"
:value="item.code"
>{{ item.name }}</a-select-option
>
</a-select> </a-select>
<a-input placeholder="请输入手机号码" v-model="form.tel"></a-input> <a-input
placeholder="请输入手机号码"
v-model="form.tel"
></a-input>
<a-input <a-input
placeholder="请输入验证码" placeholder="请输入验证码"
v-model="form.code" v-model="form.code"
@ -69,7 +93,12 @@
<a-button <a-button
type="primary" type="primary"
@click="login" @click="login"
style="width: 90%; margin-left: 30px;margin-top:20px;margin-bottom:10px" style="
width: 90%;
margin-left: 30px;
margin-top: 20px;
margin-bottom: 10px;
"
> >
登录 登录
</a-button> </a-button>
@ -194,7 +223,7 @@
</template> </template>
<script> <script>
import { loginTel, sendTelCode, } from "../../api/public/login"; import { loginTel, sendTelCode } from "../../api/public/login";
export default { export default {
name: "Login", name: "Login",
data() { data() {
@ -205,7 +234,7 @@ export default {
tel: "", tel: "",
code: "", code: "",
}, },
communityCode:undefined, communityCode: undefined,
rules: { rules: {
tel: [ tel: [
{ {
@ -234,56 +263,62 @@ export default {
}, },
], ],
}, },
cityList:[],// cityList: [], //
cityvalue:[], // cityvalue: [], //
communityList:[] // communityList: [], //
}; };
}, },
created() { created() {
this.keyupEnter(); this.keyupEnter();
this.getAllCity() this.getAllCity();
}, },
watch: { watch: {
communityCode:{ communityCode: {
handler(value){ handler(value) {
this.setCommunityCode(value); this.setCommunityCode(value);
} },
} },
}, },
methods: { methods: {
getAllCity(){ getAllCity() {
this.$axios({ this.$axios({
method:'get', method: "get",
url:process.env.VUE_APP_URL+'manage/city/allCity',//apicommunityCode url: process.env.VUE_APP_URL + "manage/city/allCity", //apicommunityCode
}).then((response) =>{
this.cityList = response.data.data
this.setCity(response.data.data);
}).catch((error) =>{
console.log(error) //
}) })
.then((response) => {
this.cityList = response.data.data;
this.setCity(response.data.data);
})
.catch((error) => {
console.log(error); //
});
}, },
getCommunity(cityId){ getCommunity(cityId) {
this.$axios({ this.$axios({
method:'get', method: "get",
url:process.env.VUE_APP_URL+'manage/community/findAll',//apicommunityCode url: process.env.VUE_APP_URL + "manage/community/findAll", //apicommunityCode
params:{ // params: {
cityId:cityId cityId: cityId,
} },
}).then((response) =>{ //使ES6
this.communityList = response.data.data
}).catch((error) =>{
console.log(error) //
}) })
.then((response) => {
this.communityList = response.data.data;
})
.catch((error) => {
console.log(error); //
});
}, },
// //
onChange(data){ onChange(data) {
this.getCommunity(data[2]) this.getCommunity(data[2]);
this.communityCode=undefined this.communityCode = undefined;
}, },
// //
filter(inputValue, path) { filter(inputValue, path) {
return path.some(cityList => cityList.name.toLowerCase().indexOf(inputValue.toLowerCase()) > -1); return path.some(
(cityList) =>
cityList.name.toLowerCase().indexOf(inputValue.toLowerCase()) > -1
);
}, },
// enter // enter
keyupEnter() { keyupEnter() {
@ -295,9 +330,9 @@ export default {
}; };
}, },
login() { login() {
if(this.communityCode===undefined) { if (this.communityCode === undefined) {
this.$message.error('先选择小区') this.$message.error("先选择小区");
return return;
} }
loginTel(this.form).then((res) => { loginTel(this.form).then((res) => {
if (res.code === 200) { if (res.code === 200) {
@ -312,9 +347,9 @@ export default {
}, },
// //
getCode() { getCode() {
if(this.communityCode === undefined) { if (this.communityCode === undefined) {
this.$message.error('先选择小区') this.$message.error("先选择小区");
return return;
} }
console.log(this.getCommunityCode); console.log(this.getCommunityCode);
sendTelCode(this.form).then((res) => { sendTelCode(this.form).then((res) => {
@ -405,7 +440,7 @@ export default {
/deep/.ant-form-item { /deep/.ant-form-item {
margin-top: -10px; margin-top: -10px;
} }
.login-input .form{ .login-input .form {
text-align: left; text-align: left;
margin-top: 20px; margin-top: 20px;
/deep/.ant-input { /deep/.ant-input {
@ -426,10 +461,10 @@ export default {
margin-bottom: 15px; margin-bottom: 15px;
} }
} }
/deep/.ant-cascader-picker{ /deep/.ant-cascader-picker {
text-align: left; text-align: left;
margin-top: 20px; margin-top: 20px;
margin-left: 25px; margin-left: 25px;
width:90%; width: 90%;
} }
</style> </style>

Loading…
Cancel
Save