feat : 菜单与公司选择组件修改
This commit is contained in:
@@ -40,7 +40,7 @@ export const getMenuInfo = (menuId) => {
|
|||||||
|
|
||||||
export const getMenuOpt = (excludeId=0) => {
|
export const getMenuOpt = (excludeId=0) => {
|
||||||
return request({
|
return request({
|
||||||
url: '/admin/menu/option/role/'+excludeId,
|
url: '/admin/menu/option/'+excludeId,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,23 +12,24 @@
|
|||||||
</el-input>
|
</el-input>
|
||||||
<el-button v-if="isChooseAll" @click="chooseAll">全选</el-button>
|
<el-button v-if="isChooseAll" @click="chooseAll">全选</el-button>
|
||||||
<el-button v-else @click="cancelAll">不全选</el-button>
|
<el-button v-else @click="cancelAll">不全选</el-button>
|
||||||
<!-- <el-checkbox-group v-model="checkBtn" @change="handleChange">-->
|
<!-- <el-checkbox-group v-model="checkBtn" @change="handleChange">-->
|
||||||
<!-- <el-checkbox label="全选" value="1" />-->
|
<!-- <el-checkbox label="全选" value="1" />-->
|
||||||
<!-- <el-checkbox label="Option B" value="Value B" />-->
|
<!-- <el-checkbox label="Option B" value="Value B" />-->
|
||||||
<!-- <el-checkbox label="Option C" value="Value C" />-->
|
<!-- <el-checkbox label="Option C" value="Value C" />-->
|
||||||
<!-- <el-checkbox label="disabled" value="Value disabled" disabled />-->
|
<!-- <el-checkbox label="disabled" value="Value disabled" disabled />-->
|
||||||
<!-- <el-checkbox-->
|
<!-- <el-checkbox-->
|
||||||
<!-- label="selected and disabled"-->
|
<!-- label="selected and disabled"-->
|
||||||
<!-- value="Value selected and disabled"-->
|
<!-- value="Value selected and disabled"-->
|
||||||
<!-- disabled-->
|
<!-- disabled-->
|
||||||
<!-- />-->
|
<!-- />-->
|
||||||
<!-- </el-checkbox-group>-->
|
<!-- </el-checkbox-group>-->
|
||||||
<!-- 人员选择 -->
|
<!-- 人员选择 -->
|
||||||
<el-empty :image-size="100" description="似乎没有数据" v-show="dataList.length === 0"/>
|
<el-empty :image-size="100" description="似乎没有数据" v-show="dataList.length === 0"/>
|
||||||
<el-scrollbar style="height:87%;">
|
<el-scrollbar style="height:87%;">
|
||||||
<div class="tree">
|
<div class="tree">
|
||||||
<el-tree :data="dataList" ref="tree" :props="defaultProps" empty-text="" node-key="value"
|
<el-tree :data="dataList" ref="tree" :props="defaultProps" empty-text="" node-key="value"
|
||||||
default-expand-all :show-checkbox="showCheckbox" highlight-current :default-checked-keys="defaultChecked"
|
default-expand-all :show-checkbox="showCheckbox" highlight-current
|
||||||
|
:default-checked-keys="defaultChecked"
|
||||||
:check-strictly="true" @node-click="(node,check)=>handle(node,check)"
|
:check-strictly="true" @node-click="(node,check)=>handle(node,check)"
|
||||||
@check-change="handleChange" :filter-node-method="filterNode">
|
@check-change="handleChange" :filter-node-method="filterNode">
|
||||||
<template #default="{ node, data }">
|
<template #default="{ node, data }">
|
||||||
@@ -85,7 +86,7 @@ const props = defineProps({
|
|||||||
type: Boolean
|
type: Boolean
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const checkBtn=ref(1)
|
const checkBtn = ref(1)
|
||||||
const isChooseAll = ref(true);
|
const isChooseAll = ref(true);
|
||||||
let selectItem = reactive({
|
let selectItem = reactive({
|
||||||
type: -1,
|
type: -1,
|
||||||
@@ -117,25 +118,31 @@ const _value = computed({
|
|||||||
watch(() => filterText.value, (newVal) => {
|
watch(() => filterText.value, (newVal) => {
|
||||||
tree.value.filter(newVal);
|
tree.value.filter(newVal);
|
||||||
});
|
});
|
||||||
const matterTree=(list)=>{
|
const matterTree = (list) => {
|
||||||
list.forEach(item=>{
|
list.forEach(item => {
|
||||||
tree.value.setChecked(item,true)
|
tree.value.setChecked(item, true)
|
||||||
if(item.children!==undefined){
|
if (item.children !== undefined) {
|
||||||
matterTree(item.children)
|
matterTree(item.children)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const cancelAll=()=>{
|
const cancelAll = () => {
|
||||||
isChooseAll.value=true
|
isChooseAll.value = true
|
||||||
tree.value.setCheckedNodes([])
|
tree.value.setCheckedNodes([])
|
||||||
}
|
}
|
||||||
const chooseAll=()=>{
|
const chooseAll = () => {
|
||||||
isChooseAll.value=false
|
isChooseAll.value = false
|
||||||
matterTree(dataList.value)
|
matterTree(dataList.value)
|
||||||
}
|
}
|
||||||
const getList = () => {
|
const getList = () => {
|
||||||
getSubCompOpt().then(res => {
|
getSubCompOpt().then(res => {
|
||||||
dataList.value = res.data;
|
dataList.value = [
|
||||||
|
{
|
||||||
|
label: "全选",
|
||||||
|
value: -1,
|
||||||
|
children: res.data
|
||||||
|
}
|
||||||
|
]
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -149,47 +156,47 @@ const filterNode = (value, data) => {
|
|||||||
const show = () => {
|
const show = () => {
|
||||||
//用于弹开部门选择
|
//用于弹开部门选择
|
||||||
visible.value = true;
|
visible.value = true;
|
||||||
selectList.value=_value.value
|
selectList.value = _value.value
|
||||||
defaultChecked.value=_value.value.map(item=>item.value)
|
defaultChecked.value = _value.value.map(item => item.value)
|
||||||
getList()
|
getList()
|
||||||
};
|
};
|
||||||
const handleChange = (data, checked) => {
|
const handleChange = (data, checked) => {
|
||||||
// 左侧有选择框
|
// 左侧有选择框
|
||||||
// if (props.showCheckbox) {
|
// if (props.showCheckbox) {
|
||||||
// 左侧有选择框 + 多选
|
// 左侧有选择框 + 多选
|
||||||
if (props.multiple) {
|
if (props.multiple) {
|
||||||
//不添加重复的数据到右边
|
//不添加重复的数据到右边
|
||||||
for (let i = 0; i < selectList.value.length; i++) {
|
for (let i = 0; i < selectList.value.length; i++) {
|
||||||
if (selectList.value[i].value === data.value) {
|
if (selectList.value[i].value === data.value) {
|
||||||
selectList.value.splice(i, 1);
|
selectList.value.splice(i, 1);
|
||||||
break;
|
break;
|
||||||
}
|
|
||||||
}
|
|
||||||
if (checked) {
|
|
||||||
// if (data.children === undefined) {
|
|
||||||
selectList.value.push(data);
|
|
||||||
// }
|
|
||||||
} else if (data === "1") {
|
|
||||||
tree.value.setCheckedKeys([]);
|
|
||||||
selectList.value = [];
|
|
||||||
}
|
|
||||||
} else {// 左侧有选择框 + 单选
|
|
||||||
//不添加重复的数据到右边
|
|
||||||
for (let i = 0; i < selectList.value.length; i++) {
|
|
||||||
if (selectList.value[i].value === data.value) {
|
|
||||||
selectList.value.splice(i, 1);
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (checked) {
|
|
||||||
tree.value.setCheckedNodes([data]);
|
|
||||||
// this.$refs.tree.setCheckedKeys([]);
|
|
||||||
selectList.value = [data];
|
|
||||||
} else if (data === "1") {
|
|
||||||
selectList.value = [];
|
|
||||||
tree.value.setCheckedKeys([]);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if (checked) {
|
||||||
|
// if (data.children === undefined) {
|
||||||
|
selectList.value.push(data);
|
||||||
|
// }
|
||||||
|
} else if (data === "1") {
|
||||||
|
tree.value.setCheckedKeys([]);
|
||||||
|
selectList.value = [];
|
||||||
|
}
|
||||||
|
} else {// 左侧有选择框 + 单选
|
||||||
|
//不添加重复的数据到右边
|
||||||
|
for (let i = 0; i < selectList.value.length; i++) {
|
||||||
|
if (selectList.value[i].value === data.value) {
|
||||||
|
selectList.value.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (checked) {
|
||||||
|
tree.value.setCheckedNodes([data]);
|
||||||
|
// this.$refs.tree.setCheckedKeys([]);
|
||||||
|
selectList.value = [data];
|
||||||
|
} else if (data === "1") {
|
||||||
|
selectList.value = [];
|
||||||
|
tree.value.setCheckedKeys([]);
|
||||||
|
}
|
||||||
|
}
|
||||||
// }
|
// }
|
||||||
};
|
};
|
||||||
const handle = (node, check) => {
|
const handle = (node, check) => {
|
||||||
@@ -215,7 +222,7 @@ const noSelected = (selectItem) => {
|
|||||||
//左侧无选择框时,右侧显示×
|
//左侧无选择框时,右侧显示×
|
||||||
for (let i = 0; i < selectList.value.length; i++) {
|
for (let i = 0; i < selectList.value.length; i++) {
|
||||||
if (selectList.value[i].value === selectItem.value) {
|
if (selectList.value[i].value === selectItem.value) {
|
||||||
tree.value.setChecked(selectList.value[i].value,false);
|
tree.value.setChecked(selectList.value[i].value, false);
|
||||||
selectList.value.splice(i, 1);
|
selectList.value.splice(i, 1);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -212,11 +212,7 @@ const showCompany = () => {
|
|||||||
const selected = (select) => {
|
const selected = (select) => {
|
||||||
let companyInfoList = []
|
let companyInfoList = []
|
||||||
for (let val of select) {
|
for (let val of select) {
|
||||||
let companyInfo = {
|
companyInfoList.push(val)
|
||||||
value: val.value,
|
|
||||||
label: val.label
|
|
||||||
}
|
|
||||||
companyInfoList.push(companyInfo)
|
|
||||||
formData.value.companyIds.push(val.value)
|
formData.value.companyIds.push(val.value)
|
||||||
}
|
}
|
||||||
companyList.value = companyInfoList
|
companyList.value = companyInfoList
|
||||||
|
|||||||
@@ -143,7 +143,7 @@ const init = async () => {
|
|||||||
form.value.setValues({state: '1', template: false})
|
form.value.setValues({state: '1', template: false})
|
||||||
const res = await getTemRoleOption()
|
const res = await getTemRoleOption()
|
||||||
localData.tempRoleOpt = res.data
|
localData.tempRoleOpt = res.data
|
||||||
const { data } = await getMenuOptRole()
|
const { data } = await getMenuOptRole(0)
|
||||||
localData.menuData = data.menuOption
|
localData.menuData = data.menuOption
|
||||||
// localData.checked = data.checked
|
// localData.checked = data.checked
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -114,6 +114,12 @@ const tableConfig = reactive({
|
|||||||
label: '手机号码',
|
label: '手机号码',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
prop: 'accountType',
|
||||||
|
label: '主子账号',
|
||||||
|
align: 'center',
|
||||||
|
currentRender: ({row, index}) => (<Tag dictType={'account_type'} value={row.accountType} />)
|
||||||
|
},
|
||||||
{
|
{
|
||||||
prop: 'state',
|
prop: 'state',
|
||||||
label: '状态',
|
label: '状态',
|
||||||
|
|||||||
Reference in New Issue
Block a user