414 lines
12 KiB
Vue
414 lines
12 KiB
Vue
<template>
|
|
<j-input-group compact>
|
|
<j-select
|
|
style="width: 120px"
|
|
v-model:value="mySource"
|
|
@change="sourceChange"
|
|
>
|
|
<j-select-option key="5" value="relation">
|
|
平台用户
|
|
</j-select-option>
|
|
<j-select-option
|
|
v-if="notifyType === 'dingTalk'"
|
|
key="1"
|
|
value="fixed"
|
|
>
|
|
钉钉用户
|
|
</j-select-option>
|
|
<j-select-option
|
|
v-else-if="notifyType === 'weixin'"
|
|
key="2"
|
|
value="fixed"
|
|
>
|
|
微信用户
|
|
</j-select-option>
|
|
<j-select-option
|
|
v-else-if="notifyType === 'email'"
|
|
key="3"
|
|
value="fixed"
|
|
>
|
|
固定邮箱
|
|
</j-select-option>
|
|
<j-select-option v-else key="4" value="fixed">
|
|
固定号码
|
|
</j-select-option>
|
|
</j-select>
|
|
<template v-if="source === 'relation'">
|
|
<j-tree-select
|
|
v-if="['email'].includes(notifyType)"
|
|
style="width: calc(100% - 120px)"
|
|
placeholder="请选择收信人"
|
|
@change="(key, label) => onChange(source, key, label)"
|
|
:tree-data="treeData"
|
|
:multiple="true"
|
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
|
:value="relationData"
|
|
showSearch
|
|
allowClear
|
|
treeNodeFilterProp="title"
|
|
>
|
|
<template #title="{ key, username, title }">
|
|
<div
|
|
style="
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-right: 10px;
|
|
"
|
|
v-if="key !== 'p1' && key !== 'p2'"
|
|
>
|
|
{{ title }}
|
|
<span style="color: #cfcfcf">{{ username }}</span>
|
|
</div>
|
|
<span v-else>{{ title }}</span>
|
|
</template>
|
|
</j-tree-select>
|
|
<j-tree-select
|
|
v-else
|
|
style="width: calc(100% - 120px)"
|
|
placeholder="请选择收信人"
|
|
@change="
|
|
(key, label) => onChange(source, key, label)
|
|
"
|
|
:tree-data="treeData"
|
|
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
|
|
:value="relationData"
|
|
showSearch
|
|
allowClear
|
|
treeNodeFilterProp="title"
|
|
>
|
|
<template #title="{ key, username, title }">
|
|
<div
|
|
style="
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-right: 10px;
|
|
"
|
|
v-if="key !== 'p1' && key !== 'p2'"
|
|
>
|
|
{{ title }}
|
|
<span style="color: #cfcfcf">{{ username }}</span>
|
|
</div>
|
|
<span v-else>{{ title }}</span>
|
|
</template>
|
|
</j-tree-select>
|
|
</template>
|
|
<template v-else>
|
|
<j-select
|
|
style="width: calc(100% - 120px)"
|
|
v-if="['dingTalk', 'weixin'].includes(notifyType)"
|
|
placeholder="请选择收信人"
|
|
:value="value?.value"
|
|
showSearch
|
|
allowClear
|
|
@change="
|
|
(val, option) =>
|
|
onChange(
|
|
source,
|
|
val,
|
|
option?.label || option?.name,
|
|
)
|
|
"
|
|
:options="relationList"
|
|
/>
|
|
<j-select
|
|
style="width: calc(100% - 120px)"
|
|
v-else-if="['email'].includes(notifyType)"
|
|
placeholder="请输入收件人邮箱,多个收件人用换行分隔"
|
|
:value="value?.value"
|
|
mode="tags"
|
|
max-tag-count="responsive"
|
|
@change="
|
|
(val) =>
|
|
onChange(
|
|
source,
|
|
val,
|
|
Array.isArray(val) ? val.join(',') : val,
|
|
)
|
|
"
|
|
/>
|
|
<j-input
|
|
style="width: calc(100% - 120px)"
|
|
v-else-if="['sms', 'voice'].includes(notifyType)"
|
|
placeholder="请输入固定号码"
|
|
:value="value?.value"
|
|
@change="
|
|
(e) =>
|
|
onChange(source, e.target.value, e.target.value)
|
|
"
|
|
></j-input>
|
|
</template>
|
|
</j-input-group>
|
|
</template>
|
|
|
|
<script lang="ts" setup name="NotifyUser">
|
|
import { storeToRefs } from 'pinia';
|
|
import { useSceneStore } from '@/store/scene';
|
|
import NoticeApi from '@/api/notice/config';
|
|
import { unionBy } from 'lodash-es';
|
|
|
|
const sceneStore = useSceneStore();
|
|
const { data } = storeToRefs(sceneStore);
|
|
|
|
const props = defineProps({
|
|
notify: {
|
|
type: Object,
|
|
default: () => {},
|
|
},
|
|
value: {
|
|
type: [Object],
|
|
default: () => {},
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['update:value', 'change']);
|
|
|
|
const notifyType = computed(() => {
|
|
return props.notify?.notifyType;
|
|
});
|
|
|
|
const notifierId = computed(() => {
|
|
return props.notify?.notifierId;
|
|
});
|
|
|
|
const source = computed(() => {
|
|
if (props.value) {
|
|
return props.value?.source || 'relation';
|
|
} else {
|
|
return 'relation';
|
|
}
|
|
});
|
|
|
|
const triggerType = computed(() => {
|
|
return data.value?.trigger?.type;
|
|
});
|
|
|
|
const relationData = computed(() => {
|
|
const item = props.value;
|
|
if(notifyType.value === 'email'){
|
|
if(item && Array.isArray(item) && item.length){
|
|
if(item[0].source === 'relation'){
|
|
return item.map(i => {
|
|
if(i.relation?.objectType === 'user') {
|
|
return i?.relation?.objectId
|
|
}
|
|
return i?.relation?.related?.relation
|
|
})
|
|
}
|
|
}
|
|
} else if (item?.source === 'relation') {
|
|
const relation = item?.relation;
|
|
if (relation) {
|
|
if (relation.objectId) {
|
|
// 平台用户
|
|
return relation.objectId;
|
|
} else {
|
|
// 关系用户
|
|
return relation.related?.relation;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
const relationList = ref<any[]>([]);
|
|
const treeData = ref<any[]>([
|
|
{
|
|
title: '平台用户',
|
|
value: 'p1',
|
|
key: 'p1',
|
|
selectable: false,
|
|
children: [],
|
|
},
|
|
]);
|
|
const mySource = ref<string>('relation');
|
|
const treeDataMap = new Map()
|
|
|
|
|
|
const getRelationUsers = async (notifyType: string, notifierId: string) => {
|
|
let resp = undefined;
|
|
if (notifyType === 'dingTalk') {
|
|
resp = await NoticeApi.queryDingTalkUsers(notifierId);
|
|
} else {
|
|
resp = await NoticeApi.queryWechatUsers(notifierId);
|
|
}
|
|
if (resp && resp.status === 200) {
|
|
relationList.value = unionBy(resp.result, 'id').map((item: any) => {
|
|
return {
|
|
value: item.id,
|
|
label: item.name,
|
|
};
|
|
});
|
|
}
|
|
};
|
|
|
|
const getUser = async (_source: string, _triggerType: string) => {
|
|
const newTree = [
|
|
{
|
|
title: '平台用户',
|
|
value: 'p1',
|
|
key: 'p1',
|
|
selectable: false,
|
|
children: [],
|
|
},
|
|
];
|
|
let relationResp = undefined;
|
|
const platformResp = await NoticeApi.getPlatformUsers({
|
|
paging: false,
|
|
sorts: [{ name: 'name', order: 'asc' }],
|
|
});
|
|
if (_triggerType && _triggerType === 'device' && _source === 'relation') {
|
|
relationResp = await NoticeApi.getRelationUsers({
|
|
paging: false,
|
|
sorts: [{ name: 'name', order: 'asc' }],
|
|
});
|
|
}
|
|
if (platformResp.status === 200) {
|
|
newTree[0].children = platformResp.result.map((item: any) => {
|
|
treeDataMap.set(item.id, item)
|
|
return {
|
|
...item,
|
|
value: item.id,
|
|
key: item.id,
|
|
title: item.name,
|
|
};
|
|
});
|
|
}
|
|
if (relationResp && relationResp.success) {
|
|
newTree.push({
|
|
title: '关系用户',
|
|
value: 'p2',
|
|
key: 'p2',
|
|
selectable: false,
|
|
children: relationResp.result.map((item: any) => {
|
|
const obj = {
|
|
...item,
|
|
value: item.relation,
|
|
key: item.id,
|
|
title: item.name,
|
|
isRelation: true,
|
|
}
|
|
treeDataMap.set(item.relation, obj)
|
|
return obj
|
|
}),
|
|
});
|
|
}
|
|
treeData.value = newTree;
|
|
};
|
|
|
|
const sourceChange = (v: any) => {
|
|
emit('update:value', {
|
|
source: v,
|
|
});
|
|
emit('change',undefined)
|
|
};
|
|
|
|
const getObj = (
|
|
_source: string = 'fixed',
|
|
_value?: string | string[],
|
|
isRelation?: boolean,
|
|
) => {
|
|
const obj: any = {
|
|
source: _source,
|
|
};
|
|
if (_source === 'relation') {
|
|
if (isRelation) {
|
|
obj.relation = {
|
|
objectType: 'device',
|
|
objectSource: {
|
|
source: 'upper',
|
|
upperKey: 'scene.deviceId',
|
|
},
|
|
related: {
|
|
objectType: 'user',
|
|
relation: _value,
|
|
},
|
|
};
|
|
} else {
|
|
obj.relation = {
|
|
objectType: 'user',
|
|
objectId: _value,
|
|
};
|
|
}
|
|
} else {
|
|
obj.value = _value;
|
|
}
|
|
return obj;
|
|
};
|
|
|
|
const onChange = (
|
|
_source: string = 'fixed',
|
|
_value?: string | string[],
|
|
// isRelation?: boolean,
|
|
_name?: string,
|
|
) => {
|
|
let _values: any = undefined;
|
|
|
|
const _names: string[] = Array.isArray(_name) ? _name : [_name || ''];
|
|
if (Array.isArray(_value)) {
|
|
if (props?.notify?.notifyType === 'email') {
|
|
if (_source === 'fixed') {
|
|
_values = {
|
|
source: "fixed",
|
|
value: _value
|
|
}
|
|
} else {
|
|
_values = {
|
|
source: "relation",
|
|
relation: {
|
|
objectType: "user",
|
|
objectId: _value?.[0]
|
|
}
|
|
}
|
|
}
|
|
// _values = _value.map((item) => {
|
|
// const _item = treeDataMap.get(item)
|
|
// const _isRelation = _item?.isRelation
|
|
// if(_isRelation) {
|
|
// return getObj(_source, item, _isRelation);
|
|
// } else {
|
|
// return {
|
|
// source: "relation",
|
|
// relation:{
|
|
// objectType: "user",
|
|
// objectId: item
|
|
// }
|
|
// }
|
|
// }
|
|
// });
|
|
}
|
|
} else {
|
|
const item = treeDataMap.get(_value)
|
|
const _isRelation = item?.isRelation
|
|
_values = getObj(_source, _value, _isRelation);
|
|
}
|
|
emit('update:value', _values);
|
|
emit('change', _names.filter((item) => !!item).join(','));
|
|
};
|
|
|
|
watch(
|
|
() => triggerType.value,
|
|
(newVal) => {
|
|
if (newVal && source.value === 'relation') {
|
|
getUser(source.value, newVal);
|
|
}
|
|
},
|
|
{ deep: true, immediate: true },
|
|
);
|
|
|
|
watch(
|
|
() => source.value,
|
|
(newVal) => {
|
|
const v = newVal;
|
|
mySource.value = v as string;
|
|
if (
|
|
v === 'fixed' &&
|
|
['dingTalk', 'weixin'].includes(notifyType.value)
|
|
) {
|
|
getRelationUsers(notifyType.value, notifierId.value);
|
|
} else {
|
|
getUser(v, triggerType.value);
|
|
}
|
|
},
|
|
{ deep: true, immediate: true },
|
|
);
|
|
</script>
|