|
|
|
@ -4,26 +4,14 @@ |
|
|
|
<div class="main"> |
|
|
|
<div class="left"> |
|
|
|
<div class="top"> |
|
|
|
<div class="ns-table-title">关联企业</div> |
|
|
|
<div> |
|
|
|
<a-input-search |
|
|
|
v-model:value="searchValue" |
|
|
|
style="margin-bottom: 8px" |
|
|
|
placeholder="请输入关联企业" |
|
|
|
@search="onSearch" /> |
|
|
|
<a-tree |
|
|
|
v-if="treeData?.length" |
|
|
|
:tree-data="treeData" |
|
|
|
defaultExpandAll |
|
|
|
@select="handleSelect"> |
|
|
|
<ns-tree-api v-bind="orgTreeConfig" @select="handleSelect"> |
|
|
|
<template #title="data"> |
|
|
|
{{ data.orgInfo?.orgName }} |
|
|
|
</template> |
|
|
|
</a-tree> |
|
|
|
</div> |
|
|
|
</ns-tree-api> |
|
|
|
</div> |
|
|
|
<div class="top"> |
|
|
|
<div class="ns-table-title">关联部门</div> |
|
|
|
<!-- <div class="ns-table-title">关联部门</div> |
|
|
|
|
|
|
|
<a-input-search |
|
|
|
v-model:value="searchValue2" |
|
|
|
@ -38,7 +26,12 @@ |
|
|
|
<template #title="data"> |
|
|
|
{{ data.deptInfo?.deptName }} |
|
|
|
</template> |
|
|
|
</a-tree> |
|
|
|
</a-tree> --> |
|
|
|
<ns-tree-api v-bind="deptTreeConfig" @select="handleSelect2"> |
|
|
|
<template #title="data"> |
|
|
|
{{ data.deptInfo?.deptName }} |
|
|
|
</template> |
|
|
|
</ns-tree-api> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="right"> |
|
|
|
@ -87,16 +80,15 @@ |
|
|
|
</a-modal> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script lang="ts"> |
|
|
|
<script lang="ts" setup> |
|
|
|
import { computed, createVNode, defineComponent, reactive, ref, watchEffect } from 'vue'; |
|
|
|
import { http } from '/nerv-lib/util/http'; |
|
|
|
import { NsMessage, NsModal } from '/nerv-lib/component'; |
|
|
|
import { formConfig, formConfig2 } from './config'; |
|
|
|
import { origanizemanage } from '/@/api/origanizemanage'; |
|
|
|
|
|
|
|
export default defineComponent({ |
|
|
|
name: 'OrderListIndex', |
|
|
|
setup() { |
|
|
|
defineOptions({ name: 'OrderListIndex' }); |
|
|
|
|
|
|
|
const mainRef = ref(); |
|
|
|
const data = reactive({}); |
|
|
|
let formData = ref({}); |
|
|
|
@ -124,7 +116,61 @@ |
|
|
|
const treeData2 = ref([]); |
|
|
|
const userAuthList = ref([]); |
|
|
|
const orgId = JSON.parse(sessionStorage.getItem('userInfo')).orgId; |
|
|
|
const orgTreeConfig = ref({ |
|
|
|
defaultExpandAll: true, |
|
|
|
api: origanizemanage.queryOrgTree, |
|
|
|
defaultParams: { orgId }, |
|
|
|
transform: (data) => { |
|
|
|
const otherOrg = data[0].listOrg; |
|
|
|
let treeData = []; |
|
|
|
// 特殊处理 |
|
|
|
if (data[0].orgInfo) { |
|
|
|
treeData = data; |
|
|
|
} |
|
|
|
otherOrg?.map((item) => { |
|
|
|
treeData.push({ orgInfo: item } as never); |
|
|
|
}); |
|
|
|
return treeData; |
|
|
|
}, |
|
|
|
header: { |
|
|
|
title: '关联企业', |
|
|
|
icon: 'orgLink', |
|
|
|
}, |
|
|
|
formConfig: { |
|
|
|
schemas: [ |
|
|
|
{ |
|
|
|
field: 'orgName', |
|
|
|
component: 'NsInput', |
|
|
|
autoSubmit: true, |
|
|
|
componentProps: { |
|
|
|
placeholder: '请输入企业名称', |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
}, |
|
|
|
}); |
|
|
|
const deptTreeConfig = ref({ |
|
|
|
defaultExpandAll: true, |
|
|
|
api: origanizemanage.queryDeptTree, |
|
|
|
defaultParams: { orgId }, |
|
|
|
|
|
|
|
header: { |
|
|
|
title: '关联部门', |
|
|
|
icon: 'deptLink', |
|
|
|
}, |
|
|
|
formConfig: { |
|
|
|
schemas: [ |
|
|
|
{ |
|
|
|
field: 'deptName', |
|
|
|
component: 'NsInput', |
|
|
|
autoSubmit: true, |
|
|
|
componentProps: { |
|
|
|
placeholder: '请输入部门名称', |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
}, |
|
|
|
}); |
|
|
|
const dynamicDisabled = computed(() => { |
|
|
|
return formRef.value?.validateResult && userAuthList.value?.length; |
|
|
|
}); |
|
|
|
@ -157,11 +203,9 @@ |
|
|
|
}; |
|
|
|
const onSearch2 = () => { |
|
|
|
console.log(searchValue2.value); |
|
|
|
fetch(origanizemanage.queryDeptTree, { deptName: searchValue2.value, orgId }).then( |
|
|
|
(res) => { |
|
|
|
fetch(origanizemanage.queryDeptTree, { deptName: searchValue2.value, orgId }).then((res) => { |
|
|
|
treeData2.value = res.data; |
|
|
|
}, |
|
|
|
); |
|
|
|
}); |
|
|
|
}; |
|
|
|
|
|
|
|
const tableFetch = (params) => { |
|
|
|
@ -439,7 +483,7 @@ |
|
|
|
label: '账号名', |
|
|
|
component: 'NsInput', |
|
|
|
componentProps: { |
|
|
|
// placeholder: '请输入账号名', |
|
|
|
placeholder: '请输入账号名', |
|
|
|
maxLength: 30, |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -448,7 +492,7 @@ |
|
|
|
label: '姓名', |
|
|
|
component: 'NsInput', |
|
|
|
componentProps: { |
|
|
|
// placeholder: '请输入姓名', |
|
|
|
placeholder: '请输入姓名', |
|
|
|
maxLength: 30, |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -457,7 +501,7 @@ |
|
|
|
label: '手机号', |
|
|
|
component: 'NsInput', |
|
|
|
componentProps: { |
|
|
|
// placeholder: '请输入手机号', |
|
|
|
placeholder: '请输入手机号', |
|
|
|
maxLength: 11, |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -476,6 +520,7 @@ |
|
|
|
component: 'NsSelect', |
|
|
|
componentProps: { |
|
|
|
allowClear: true, |
|
|
|
placeholder: '请选择用户状态', |
|
|
|
options: [ |
|
|
|
{ |
|
|
|
label: '正常', |
|
|
|
@ -548,59 +593,38 @@ |
|
|
|
], |
|
|
|
}, |
|
|
|
}; |
|
|
|
|
|
|
|
return { |
|
|
|
formRef, |
|
|
|
tableConfig, |
|
|
|
tableConfig2, |
|
|
|
data, |
|
|
|
mainRef, |
|
|
|
visible, |
|
|
|
addformvisible, |
|
|
|
formSchema, |
|
|
|
formSchema2, |
|
|
|
formData, |
|
|
|
formData2, |
|
|
|
treeData, |
|
|
|
treeData2, |
|
|
|
searchValue, |
|
|
|
searchValue2, |
|
|
|
handleSelect, |
|
|
|
handleSelect2, |
|
|
|
onClose, |
|
|
|
onEdit, |
|
|
|
onSearch, |
|
|
|
onSearch2, |
|
|
|
handleOk, |
|
|
|
handleClose, |
|
|
|
dynamicDisabled, |
|
|
|
modalFormRef, |
|
|
|
}; |
|
|
|
}, |
|
|
|
}); |
|
|
|
</script> |
|
|
|
<style lang="less" scoped> |
|
|
|
.main { |
|
|
|
background-color: @ns-content-bg; |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
.left { |
|
|
|
width: 350px; |
|
|
|
max-height: calc(100vh - 96px); |
|
|
|
overflow: hidden; |
|
|
|
border-right: 16px solid rgb(229, 235, 240); |
|
|
|
width: 300px; |
|
|
|
// max-height: calc(100vh - 96px); |
|
|
|
margin-right: @ns-gap; |
|
|
|
min-width: fit-content; |
|
|
|
> div { |
|
|
|
border-radius: @ns-border-radius; |
|
|
|
background-color: @white; |
|
|
|
box-shadow: @ns-content-box-shadow; |
|
|
|
flex: 1; |
|
|
|
} |
|
|
|
.top:first-child { |
|
|
|
border-bottom: 16px solid #e5ebf0; |
|
|
|
margin-bottom: @ns-gap; |
|
|
|
} |
|
|
|
|
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
.right { |
|
|
|
flex: 1; |
|
|
|
min-width: 0; |
|
|
|
} |
|
|
|
.top { |
|
|
|
height: 50%; |
|
|
|
// height: 50%; |
|
|
|
// border-bottom: 5px solid rgb(229, 235, 240); |
|
|
|
overflow-y: auto; |
|
|
|
// overflow-y: auto; |
|
|
|
} |
|
|
|
.ns-table-title { |
|
|
|
text-align: left; |
|
|
|
|
xuziqiang
3 months ago
