0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 优化场景联动

This commit is contained in:
xieyonghong 2023-04-10 09:42:47 +08:00
parent f87bef89c3
commit 9fc1a55def
8 changed files with 351 additions and 329 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/home.ts
View File

@ -1,7 +1,7 @@
import server from '@/utils/request'; import server from '@/utils/request';
// 当前登录用户权限信息 // 当前登录用户权限信息
export const getMe_api = () => server.get(`/authorize/me`); export const getMe_api = () => server.get<{ user: any, [key : string]: any }>(`/authorize/me`);
// 设置登录用户选择的页面 // 设置登录用户选择的页面
export const setView_api = (data:object) => server.patch(`/user/settings/view/user`, data); export const setView_api = (data:object) => server.patch(`/user/settings/view/user`, data);
// 当前登录用户选择的页面 // 当前登录用户选择的页面

6
src/api/login.ts
View File

@ -10,7 +10,7 @@ export const config = () => server.get(`/authorize/captcha/config`)
* 获取验证码图片 * 获取验证码图片
* @returns * @returns
*/ */
export const code = () => server.get(`/authorize/captcha/image?width=130&height=30`) export const code = () => server.get<{ base64: string, key: string }>(`/authorize/captcha/image?width=130&height=30`)
/** /**
* 登录 * 登录
@ -57,3 +57,7 @@ export const userDetail = () => server.get<any>('/user/detail')
* 退出登录 * 退出登录
*/ */
export const loginout_api = () => server.get<any>('/user-token/reset') export const loginout_api = () => server.get<any>('/user-token/reset')
export const getOAuth2 = (params: any) => server.get<any>('/oauth2/authorize', params)
export const initApplication = (clientId: string | number) => server.get<{name: string}>(`/application/${clientId}/info`)

5
src/components/Layout/BasicLayoutPage.vue
View File

@ -110,8 +110,6 @@ const jump = (item: any) => {
path = item.path path = item.path
} }
console.log(item, history.state)
console.log(path)
// jumpPage(slotProps.route.path) // jumpPage(slotProps.route.path)
router.push(path) router.push(path)
} }
@ -119,8 +117,7 @@ const jump = (item: any) => {
const breadcrumb = computed(() => const breadcrumb = computed(() =>
{ {
const paths = router.currentRoute.value.name as string const paths = router.currentRoute.value.name as string
console.log(router.currentRoute)
console.log(route)
const metas = findRouteMeta(paths) const metas = findRouteMeta(paths)
return metas.map((item, index) => { return metas.map((item, index) => {
return { return {

8
src/router/menu.ts
View File

@ -4,6 +4,7 @@ export const AccountCenterBindPath = '/account/center/bind'
export const InitLicense = '/init-license' export const InitLicense = '/init-license'
export const NotificationSubscriptionCode = 'account/NotificationSubscription' export const NotificationSubscriptionCode = 'account/NotificationSubscription'
export const NotificationRecordCode = 'account/NotificationRecord' export const NotificationRecordCode = 'account/NotificationRecord'
export const OauthPath = '/oauth'
export const AccountMenu = { export const AccountMenu = {
path: '/account', path: '/account',
@ -70,6 +71,13 @@ export default [
{ {
path: InitLicense, path: InitLicense,
component: () => import('@/views/system/License/index.vue') component: () => import('@/views/system/License/index.vue')
},
{
path: OauthPath,
meta: {
title: '授权页'
},
component: () => import('@/views/oauth/index.vue')
} }
] ]

1
src/views/rule-engine/Scene/Save/action/ListItem/FilterCondition.vue
View File

@ -348,6 +348,7 @@ const termAdd = () => {
} }
const onDelete = () => { const onDelete = () => {
const key = formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.actionName].terms?.[props.termsName].terms?.[props.name].key
formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.actionName].terms?.[props.termsName].terms?.splice(props.name, 1) formModel.value.branches?.[props.branchName]?.then?.[props.thenName]?.actions?.[props.actionName].terms?.[props.termsName].terms?.splice(props.name, 1)
const _options = formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options const _options = formModel.value.branches![props.branchName].then[props.thenName].actions[props.name].options
const termsColumns = _options?.termsColumns || [] const termsColumns = _options?.termsColumns || []

7
src/views/rule-engine/Scene/Save/action/ListItem/FilterGroup.vue
View File

@ -107,8 +107,11 @@ const onKeys: string[] = EventSubscribeKeys({
action: props.actionName action: props.actionName
}) })
const handleRequest = () => { const handleRequest = (e: any) => {
columnRequest() const hasDelete = 'isDelete' in e
if (!hasDelete) {
columnRequest()
}
} }
EventEmitter.subscribe(onKeys, handleRequest) EventEmitter.subscribe(onKeys, handleRequest)

637
src/views/rule-engine/Scene/Save/action/ListItem/Item.vue
View File

@ -6,328 +6,328 @@
> >
<div class="actions-item"> <div class="actions-item">
<CheckItem v-bind='props'> <CheckItem v-bind='props'>
<div class="item-options-warp"> <div class="item-options-warp">
<div class="item-options-type" @click="onAdd"> <div class="item-options-type" @click="onAdd">
<img <img
style="width: 18px" style="width: 18px"
:src=" :src="
iconMap.get( iconMap.get(
data?.executor === 'alarm' data?.executor === 'alarm'
? data?.alarm?.mode ? data?.alarm?.mode
: data?.executor, : data?.executor,
) )
" "
/> />
</div> </div>
<div <div
class="item-options-content" class="item-options-content"
v-if="data?.executor === 'alarm'" v-if="data?.executor === 'alarm'"
> >
<template v-if="data?.alarm?.mode === 'trigger'"> <template v-if="data?.alarm?.mode === 'trigger'">
满足条件后将触发<j-button 满足条件后将触发<j-button
style="padding: 0" style="padding: 0"
type="link" type="link"
@click.stop="triggerVisible = true" @click.stop="triggerVisible = true"
>关联此场景的告警</j-button >关联此场景的告警</j-button
> >
</template> </template>
<template v-else> <template v-else>
满足条件后将解除<j-button 满足条件后将解除<j-button
style="padding: 0" style="padding: 0"
type="link" type="link"
@click.stop="triggerVisible = true" @click.stop="triggerVisible = true"
>关联此场景的告警</j-button >关联此场景的告警</j-button
> >
</template> </template>
</div> </div>
<div <div
class="item-options-content" class="item-options-content"
v-else-if="data?.executor === 'notify'" v-else-if="data?.executor === 'notify'"
@click="onType('notify')" @click="onType('notify')"
> >
<template v-if="data?.notify?.notifyType === 'dingTalk'"> <template v-if="data?.notify?.notifyType === 'dingTalk'">
<template <template
v-if="options?.provider === 'dingTalkRobotWebHook'" v-if="options?.provider === 'dingTalkRobotWebHook'"
> >
<div> <div>
通过<span class="notify-text-highlight" 通过<span class="notify-text-highlight"
>群机器人消息</span >群机器人消息</span
> >
发送 发送
<span class="notify-text-highlight"> <span class="notify-text-highlight">
{{ {{
options?.templateName || options?.templateName ||
data?.notify?.templateId data?.notify?.templateId
}} }}
</span> </span>
</div> </div>
</template> </template>
<template v-else> <template v-else>
<div> <div>
通过 通过
<span class="notify-text-highlight"> <span class="notify-text-highlight">
<img <img
style="width: 18px" style="width: 18px"
:src=" :src="
itemNotifyIconMap.get( itemNotifyIconMap.get(
data?.notify?.notifyType, data?.notify?.notifyType,
) )
" "
/> />
钉钉 钉钉
</span> </span>
向<span class="notify-text-highlight">{{ 向<span class="notify-text-highlight">{{
options?.sendTo || '' options?.sendTo || ''
}}</span> }}</span>
<span class="notify-text-highlight">{{ <span class="notify-text-highlight">{{
options?.orgName || '' options?.orgName || ''
}}</span> }}</span>
发送 发送
<span class="notify-text-highlight"> <span class="notify-text-highlight">
{{ {{
options?.templateName || options?.templateName ||
data?.notify?.templateId data?.notify?.templateId
}} }}
</span> </span>
</div> </div>
</template> </template>
</template> </template>
<template v-else-if="data?.notify?.notifyType === 'weixin'"> <template v-else-if="data?.notify?.notifyType === 'weixin'">
<div> <div>
通过 通过
<span class="notify-text-highlight"> <span class="notify-text-highlight">
<img <img
style="width: 18px" style="width: 18px"
:src=" :src="
itemNotifyIconMap.get( itemNotifyIconMap.get(
data?.notify?.notifyType, data?.notify?.notifyType,
) )
" "
/> />
微信 微信
</span> </span>
向<span class="notify-text-highlight">{{ 向<span class="notify-text-highlight">{{
options?.sendTo || ''
}}</span>
<span class="notify-text-highlight">{{
options?.orgName || ''
}}</span>
<span class="notify-text-highlight">{{
options?.tagName || ''
}}</span>
发送
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template v-else-if="data?.notify?.notifyType === 'email'">
<div style="display: flex;">
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
邮件
</span>
向<span class="notify-text-highlight">
<Ellipsis style='max-width: 400px;'>
{{
options?.sendTo || '' options?.sendTo || ''
}} }}</span>
</Ellipsis> <span class="notify-text-highlight">{{
</span> options?.orgName || ''
发送 }}</span>
<span class="notify-text-highlight"> <span class="notify-text-highlight">{{
options?.tagName || ''
}}</span>
发送
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template v-else-if="data?.notify?.notifyType === 'email'">
<div style="display: flex;">
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
邮件
</span>
向<span class="notify-text-highlight">
<Ellipsis style='max-width: 400px;'>
{{ {{
options?.templateName || options?.sendTo || ''
data?.notify?.templateId }}
}} </Ellipsis>
</span> </span>
</div> 发送
</template> <span class="notify-text-highlight">
<template v-else-if="data?.notify?.notifyType === 'voice'"> {{
<div> options?.templateName ||
通过 data?.notify?.templateId
<span class="notify-text-highlight"> }}
<img </span>
style="width: 18px" </div>
:src=" </template>
itemNotifyIconMap.get( <template v-else-if="data?.notify?.notifyType === 'voice'">
data?.notify?.notifyType, <div>
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
语音
</span>
向<span class="notify-text-highlight">{{
options?.sendTo || ''
}}</span>
发送
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template v-else-if="data?.notify?.notifyType === 'sms'">
<div>
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
短信
</span>
向<span class="notify-text-highlight">{{
options?.sendTo || ''
}}</span>
发送
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template
v-else-if="data?.notify?.notifyType === 'webhook'"
>
<div>
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
webhook
</span>
发送
<span>{{
options?.templateName ||
data?.notify?.templateId
}}</span>
</div>
</template>
</div>
<div
class="item-options-content"
v-else-if="data?.executor === 'delay'"
@click="onType('delay')"
>
{{ options?.name }}
</div>
<div
class="item-options-content"
v-else-if="data?.executor === 'device'"
@click="onType('device')"
>
<template v-if="['fixed', 'context'].includes(data?.device?.selector)">
<div style='display: flex; align-items: center;'>
<AIcon
:type="
typeIconMap[
data?.device?.message?.messageType ||
'INVOKE_FUNCTION'
]
"
/>
<span style="padding-left: 4px">{{
data?.options?.type
}}</span>
<AIcon
type="icon-mubiao"
style="padding:0 4px"
/>
<Ellipsis style='max-width: 200px;margin-right: 12px;'>
{{data?.options?.name}}
</Ellipsis>
<Ellipsis style='max-width: 400px;'>
{{data?.options?.propertiesName}}
</Ellipsis>
<span v-if='!isBoolean(data?.options?.propertiesValue) && data?.options?.propertiesValue'>为 </span>
<Ellipsis style='max-width: 200px;'>
{{
`${
(
isBoolean(
data?.options?.propertiesValue,
) )
" ? true
/> : data?.options?.propertiesValue
语音 )
</span> ? `${data?.options?.propertiesValue}`
向<span class="notify-text-highlight">{{ : ''
options?.sendTo || '' }`
}}</span> }}
发送 </Ellipsis>
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template v-else-if="data?.notify?.notifyType === 'sms'">
<div>
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
短信
</span>
向<span class="notify-text-highlight">{{
options?.sendTo || ''
}}</span>
发送
<span class="notify-text-highlight">
{{
options?.templateName ||
data?.notify?.templateId
}}
</span>
</div>
</template>
<template
v-else-if="data?.notify?.notifyType === 'webhook'"
>
<div>
通过
<span class="notify-text-highlight">
<img
style="width: 18px"
:src="
itemNotifyIconMap.get(
data?.notify?.notifyType,
)
"
/>
webhook
</span>
发送
<span>{{
options?.templateName ||
data?.notify?.templateId
}}</span>
</div>
</template>
</div>
<div
class="item-options-content"
v-else-if="data?.executor === 'delay'"
@click="onType('delay')"
>
{{ options?.name }}
</div>
<div
class="item-options-content"
v-else-if="data?.executor === 'device'"
@click="onType('device')"
>
<template v-if="['fixed', 'context'].includes(data?.device?.selector)">
<div style='display: flex; align-items: center;'>
<AIcon
:type="
typeIconMap[
data?.device?.message?.messageType ||
'INVOKE_FUNCTION'
]
"
/>
<span style="padding-left: 4px">{{
data?.options?.type
}}</span>
<AIcon
type="icon-mubiao"
style="padding:0 4px"
/>
<Ellipsis style='max-width: 200px;margin-right: 12px;'>
{{data?.options?.name}}
</Ellipsis>
<Ellipsis style='max-width: 400px;'>
{{data?.options?.propertiesName}}
</Ellipsis>
<span v-if='!isBoolean(data?.options?.propertiesValue) && data?.options?.propertiesValue'>为 </span>
<Ellipsis style='max-width: 200px;'>
{{
`${
(
isBoolean(
data?.options?.propertiesValue,
)
? true
: data?.options?.propertiesValue
)
? `${data?.options?.propertiesValue}`
: ''
}`
}}
</Ellipsis>
</div> </div>
</template> </template>
<template v-else-if="data?.device?.selector === 'tag'"> <template v-else-if="data?.device?.selector === 'tag'">
<div> <div>
<AIcon <AIcon
:type=" :type="
typeIconMap[ typeIconMap[
data?.device?.message?.messageType || data?.device?.message?.messageType ||
'INVOKE_FUNCTION' 'INVOKE_FUNCTION'
] ]
" "
/> />
{{ data?.options?.type }} {{ data?.options?.type }}
<span>{{ data?.options?.tagName }}</span> <span>{{ data?.options?.tagName }}</span>
的{{ data?.options?.productName }} 的{{ data?.options?.productName }}
{{ data?.options?.propertiesName }} {{ data?.options?.propertiesName }}
</div> </div>
</template> </template>
<template v-else-if="data?.device?.selector === 'relation'"> <template v-else-if="data?.device?.selector === 'relation'">
<div> <div>
<AIcon <AIcon
:type=" :type="
typeIconMap[ typeIconMap[
data?.device?.message?.messageType || data?.device?.message?.messageType ||
'INVOKE_FUNCTION' 'INVOKE_FUNCTION'
] ]
" "
/> />
{{ data?.options?.type }}与<span>{{ {{ data?.options?.type }}与<span>{{
data?.options?.triggerName data?.options?.triggerName
}}</span }}</span
>具有相同 {{ data?.options?.relationName }}的{{ >具有相同 {{ data?.options?.relationName }}的{{
data?.options?.productName data?.options?.productName
}}设备的 }}设备的
{{ data?.options?.propertiesName }} {{ data?.options?.propertiesName }}
</div> </div>
</template> </template>
</div> </div>
<j-button v-else @click="onAdd">点击配置执行动作</j-button> <j-button v-else @click="onAdd">点击配置执行动作</j-button>
</div> </div>
<div class="item-number">{{ name + 1 }}</div> <div class="item-number">{{ name + 1 }}</div>
<j-popconfirm title="确认删除？" @confirm="onDelete" placement="topRight" :overlayStyle='{minWidth: "190px"}'> <j-popconfirm title="确认删除？" @confirm="onDelete" placement="topRight" :overlayStyle='{minWidth: "190px"}'>
<div class="item-delete"> <div class="item-delete">
<AIcon type="DeleteOutlined" /> <AIcon type="DeleteOutlined" />
</div> </div>
</j-popconfirm> </j-popconfirm>
</CheckItem> </CheckItem>
</div> </div>
</j-form-item> </j-form-item>
@ -461,11 +461,14 @@ const termsOptions = computed(() => {
}); });
const onDelete = () => { const onDelete = () => {
const key = _data.value.branches![props.branchesName].then[props.thenName].actions[props.name].key
EventEmitter.emit(key!, { isDelete: true })
if (props.name !== 0 && !props.parallel) { // 清空上一个串行执行动作中的options.termsColumns和terms if (props.name !== 0 && !props.parallel) { // 清空上一个串行执行动作中的options.termsColumns和terms
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.termsColumns = [] _data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.termsColumns = []
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.terms = [] _data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].options!.terms = []
_data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].terms = [] _data.value.branches![props.branchesName].then[props.thenName].actions[props.name - 1].terms = []
} }
emit('delete'); emit('delete');
}; };

14
src/views/rule-engine/Scene/Save/util.ts
View File

@ -68,6 +68,8 @@ export const EventEmitterKeys = (params: Params): string => {
* @constructor * @constructor
*/ */
export const EventSubscribeKeys = (params: Params): string[] => { export const EventSubscribeKeys = (params: Params): string[] => {
const sceneStore = useSceneStore()
let keys: string[] = [] let keys: string[] = []
if (params.action === 0) { if (params.action === 0) {
@ -75,10 +77,14 @@ export const EventSubscribeKeys = (params: Params): string[] => {
} }
for (let i = 0; i <= params.action; i++) { for (let i = 0; i <= params.action; i++) {
const _b = `branches_${params.branch}` // branchesName let key = sceneStore.data.branches?.[params.branch].then[params.branchGroup].actions[i]?.key
const _t = `then_${params.branchGroup}` // thenName if (!key) {
const _a = `then_${i}` // actionName const _b = `branches_${params.branch}` // branchesName
keys.push(`${_b}_${_t}_${_a}`) const _t = `then_${params.branchGroup}` // thenName
const _a = `then_${i}` // actionName
key = `${_b}_${_t}_${_a}`
}
keys.push(key)
} }
return keys return keys