Skip to content

Commit 8539183

Browse files
3octaves3octaves
committed
feat(frontend): 新增单据通知设置页面 #8335 
1 parent c1c596f commit 8539183

File tree

5 files changed

+156
-42
lines changed

5 files changed

+156
-42
lines changed

‎dbm-ui/frontend/src/common/const/messageTypes.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
* 消息通知类型
33
*/
44

5+
import { t } from '@locales/index';
6+
57
export enum MessageTypes {
68
SMS = 'sms',
79
WEIXIN = 'weixin',
@@ -12,3 +14,12 @@ export enum MessageTypes {
1214
}
1315

1416
export const InputMessageTypes = [MessageTypes.WECOM_ROBOT] as string[];
17+
18+
export const MessageTipMap: Record<string, string> = {
19+
[MessageTypes.WECOM_ROBOT]: [
20+
t('获取会话ID方法:'),
21+
t('1. 群聊添加群机器人: 蓝鲸审批助手'),
22+
t('2. 手动蓝鲸审批助手，获取会话ID'),
23+
t('3. 将获取到的会话ID粘贴到输入框，多个会话ID使用逗号分隔'),
24+
].join('\n'),
25+
};

‎dbm-ui/frontend/src/components/auth-component/button.vue‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,10 @@
3636
bizId: undefined,
3737
});
3838
39+
const isAuth = defineModel<boolean>('isAuth', {
40+
default: false,
41+
});
42+
3943
defineOptions({
4044
inheritAttrs: false,
4145
});
@@ -45,6 +49,8 @@
4549
const inheritAttrs = attrsWithoutListener(attrs);
4650
4751
const { loading, isShowRaw, handleRequestPermission } = useBase(props);
52+
53+
watchEffect(() => (isAuth.value = Boolean(isShowRaw.value)));
4854
</script>
4955
<style lang="less">
5056
.auth-button-disable {

‎dbm-ui/frontend/src/components/db-popconfirm/index.vue‎

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,10 @@
6060
cancelHandler?: () => Promise<any> | void;
6161
}
6262
63+
interface Expose {
64+
updateTriggerTarget: () => void;
65+
}
66+
6367
const props = withDefaults(defineProps<Props>(), {
6468
placement: 'top',
6569
content: '',
@@ -102,7 +106,7 @@
102106
});
103107
};
104108
105-
onMounted(() => {
109+
const createTippy = () => {
106110
const tippyTarget = rootRef.value.children[0];
107111
108112
if (tippyTarget) {
@@ -132,14 +136,31 @@
132136
},
133137
});
134138
}
135-
});
139+
};
136140
137-
onBeforeUnmount(() => {
141+
const destroyTippy = () => {
138142
if (tippyIns) {
139143
tippyIns.hide();
140144
tippyIns.unmount();
141145
tippyIns.destroy();
142146
}
147+
};
148+
149+
onMounted(() => {
150+
createTippy();
151+
});
152+
153+
onBeforeUnmount(() => {
154+
destroyTippy();
155+
});
156+
157+
defineExpose<Expose>({
158+
updateTriggerTarget() {
159+
nextTick(() => {
160+
destroyTippy();
161+
createTippy();
162+
});
163+
},
143164
});
144165
</script>
145166
<style lang="less">

‎dbm-ui/frontend/src/locales/zh-cn.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3885,6 +3885,9 @@
38853885
"审批人": "审批人",
38863886
"协助人": "协助人",
38873887
"单据通知": "单据通知",
3888+
"获取会话ID方法:": "获取会话ID方法:",
3889+
"1. 群聊添加群机器人: 蓝鲸审批助手": "1. 群聊添加群机器人: 蓝鲸审批助手",
3890+
"2. 手动蓝鲸审批助手，获取会话ID": "2. 手动 {'@'}蓝鲸审批助手，获取会话ID",
3891+
"3. 将获取到的会话ID粘贴到输入框，多个会话ID使用逗号分隔": "3. 将获取到的会话ID粘贴到输入框，多个会话ID使用逗号分隔",
38883892
"这行勿动！新增翻译请在上一行添加！": ""
3889-
38903893
}

‎dbm-ui/frontend/src/views/ticket-notice-setting/Index.vue‎

Lines changed: 111 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -42,18 +42,28 @@
4242
<AuthButton
4343
action-id="biz_notify_config"
4444
class="w-88"
45+
:disabled="resetSettingLoading"
4546
:loading="updateSettingLoading"
4647
:resource="bizId"
4748
theme="primary"
48-
@click="handleSubmit">
49-
{{ t('提交') }}
49+
@click="handleSave">
50+
{{ t('保存') }}
5051
</AuthButton>
51-
<BkButton
52-
class="ml8 w-88"
53-
:disabled="updateSettingLoading"
54-
@click="handleReset">
55-
{{ t('重置') }}
56-
</BkButton>
52+
<DbPopconfirm
53+
ref="dbPopconfirm"
54+
:confirm-handler="handleReset"
55+
:content="t('重置将会恢复默认设置的内容')"
56+
:title="t('确认重置')">
57+
<AuthButton
58+
v-model:is-auth="isAuth"
59+
action-id="biz_notify_config"
60+
class="ml8 w-88"
61+
:disabled="updateSettingLoading"
62+
:loading="resetSettingLoading"
63+
:resource="bizId">
64+
{{ t('重置') }}
65+
</AuthButton>
66+
</DbPopconfirm>
5767
</template>
5868
</SmartAction>
5969
</BkLoading>
@@ -67,10 +77,13 @@
6777
import { getBizSettingList, updateBizSetting } from '@services/source/bizSetting';
6878
import { getAlarmGroupNotifyList } from '@services/source/monitorNoticeGroup';
6979
70-
import { InputMessageTypes, MessageTypes } from '@common/const'
80+
import { InputMessageTypes, MessageTipMap, MessageTypes } from '@common/const'
7181
7282
import { messageSuccess } from '@utils';
7383
84+
type AlarmGroupNotify = ServiceReturnType<typeof getAlarmGroupNotifyList>
85+
type TicketNoticeSetting = Record<string, Record<string, boolean | string[]>>
86+
7487
interface DataRow {
7588
status: string;
7689
statusText: string;
@@ -81,9 +94,14 @@
8194
8295
const { t } = useI18n();
8396
97+
const dbPopconfirmRef = useTemplateRef('dbPopconfirm')
98+
8499
const dataList = ref<DataRow[]>([]);
100+
const isAuth = ref(false);
85101
86102
const bizId = window.PROJECT_CONFIG.BIZ_ID
103+
const DefaultMessageTypeList = [MessageTypes.MAIL, MessageTypes.RTX]
104+
const NoticeTicketTypeList = Object.entries(TicketModel.statusTextMap).filter(([status]) => ![TicketModel.STATUS_RUNNING, TicketModel.STATUS_TIMER].includes(status))
87105
88106
const columns = computed(() => {
89107
const baseColumns = [
@@ -100,8 +118,27 @@
100118
},
101119
];
102120
103-
const nofityColumns = (alarmGroupNotifyList.value || []).filter((item) => item.is_active).map(item => {
121+
// input 类型的放最后
122+
const activeTypeMap = (alarmGroupNotifyList.value || []).reduce<{
123+
checkbox: AlarmGroupNotify,
124+
input: AlarmGroupNotify,
125+
}>((prevMap, item) => {
126+
if (item.is_active) {
127+
if (InputMessageTypes.includes(item.type)) {
128+
Object.assign(prevMap.input, prevMap.input.concat(item))
129+
} else {
130+
Object.assign(prevMap.checkbox, prevMap.checkbox.concat(item))
131+
}
132+
}
133+
return prevMap;
134+
}, {
135+
checkbox: [],
136+
input: []
137+
})
138+
139+
const nofityColumns = [...activeTypeMap.checkbox, ...activeTypeMap.input].map(item => {
104140
const isInputType = InputMessageTypes.includes(item.type)
141+
const messageTip = MessageTipMap[item.type]
105142
return {
106143
field: item.type,
107144
minWidth: isInputType ? 320 : 120,
@@ -116,6 +153,16 @@
116153
class="ml-4">
117154
{ item.label }
118155
</span>
156+
{
157+
messageTip && (
158+
<db-icon
159+
class="message-type-head-tip ml-4"
160+
v-bk-tooltips={{
161+
content: messageTip
162+
}}
163+
type="attention" />
164+
)
165+
}
119166
</div>
120167
),
121168
render: ({ data } : { data: DataRow }) => {
@@ -146,9 +193,24 @@
146193
manual: true,
147194
onSuccess: () => {
148195
messageSuccess(t('保存成功'));
196+
getData()
197+
},
198+
});
199+
200+
const { loading: resetSettingLoading, run: runResetBizSetting } = useRequest(updateBizSetting, {
201+
manual: true,
202+
onSuccess: () => {
203+
messageSuccess(t('重置成功'));
204+
getData()
149205
},
150206
});
151207
208+
watch(isAuth, () => {
209+
if (isAuth.value) {
210+
dbPopconfirmRef.value?.updateTriggerTarget()
211+
}
212+
})
213+
152214
watch([bizSetting, alarmGroupNotifyList], () => {
153215
if (bizSetting.value && alarmGroupNotifyList.value) {
154216
const activeTypeMap = alarmGroupNotifyList.value.reduce<{
@@ -175,33 +237,31 @@
175237
const isBizSettingEmpty = _.isEmpty(bizSetting.value) || _.isEmpty(bizSetting.value.NOTIFY_CONFIG)
176238
const list: DataRow[] = []
177239
178-
Object.entries(TicketModel.statusTextMap).forEach(([status, statusText]) => {
179-
if (![TicketModel.STATUS_RUNNING, TicketModel.STATUS_TIMER].includes(status)) {
180-
const initSetting = _.cloneDeep(activeTypeMap)
181-
if (isBizSettingEmpty) {
182-
[MessageTypes.MAIL, MessageTypes.RTX].forEach(type => {
183-
if (initSetting.checkbox[type] !== undefined) {
184-
initSetting.checkbox[type] = true;
185-
}
186-
});
187-
} else {
188-
const statusBizSetting = bizSetting.value!.NOTIFY_CONFIG[status]
189-
Object.keys(initSetting.checkbox).forEach(initSettingKey => {
190-
initSetting.checkbox[initSettingKey] = statusBizSetting[initSettingKey] || false
191-
})
192-
Object.keys(initSetting.input).forEach(initSettingKey => {
193-
initSetting.input[initSettingKey] = (statusBizSetting[initSettingKey] || []).join(',')
194-
})
195-
}
196-
197-
list.push({
198-
status,
199-
statusText,
200-
noticeMember: status === TicketModel.STATUS_APPROVE ? [t('审批人')] : [t('提单人'), t('协助人')],
201-
checkbox: initSetting.checkbox,
202-
input: initSetting.input
240+
NoticeTicketTypeList.forEach(([status, statusText]) => {
241+
const initSetting = _.cloneDeep(activeTypeMap)
242+
if (isBizSettingEmpty) {
243+
DefaultMessageTypeList.forEach(type => {
244+
if (initSetting.checkbox[type] !== undefined) {
245+
initSetting.checkbox[type] = true;
246+
}
247+
});
248+
} else {
249+
const statusBizSetting = bizSetting.value!.NOTIFY_CONFIG[status]
250+
Object.keys(initSetting.checkbox).forEach(initSettingKey => {
251+
initSetting.checkbox[initSettingKey] = statusBizSetting[initSettingKey] || false
252+
})
253+
Object.keys(initSetting.input).forEach(initSettingKey => {
254+
initSetting.input[initSettingKey] = (statusBizSetting[initSettingKey] || []).join(',')
203255
})
204256
}
257+
258+
list.push({
259+
status,
260+
statusText,
261+
noticeMember: status === TicketModel.STATUS_APPROVE ? [t('审批人')] : [t('提单人'), t('协助人')],
262+
checkbox: initSetting.checkbox,
263+
input: initSetting.input
264+
})
205265
})
206266
dataList.value = list
207267
}
@@ -221,11 +281,11 @@
221281
})
222282
}
223283
224-
const handleSubmit = () => {
284+
const handleSave = () => {
225285
runUpdateBizSetting({
226286
bk_biz_id: bizId,
227287
key: 'NOTIFY_CONFIG',
228-
value: dataList.value.reduce<Record<string, Record<string, boolean | string[]>>>((prevMap, dataItem) => {
288+
value: dataList.value.reduce<TicketNoticeSetting>((prevMap, dataItem) => {
229289
const checkboxMap = Object.entries(dataItem.checkbox).reduce<Record<string, boolean>>((prevMap, [key, value])=> {
230290
if (value) {
231291
return Object.assign({}, prevMap, { [key]: value })
@@ -249,7 +309,15 @@
249309
};
250310
251311
const handleReset = () => {
252-
getData()
312+
runResetBizSetting({
313+
bk_biz_id: bizId,
314+
key: 'NOTIFY_CONFIG',
315+
value: NoticeTicketTypeList.reduce<TicketNoticeSetting>((prevSettingMap, [status]) => Object.assign({}, prevSettingMap, {
316+
[status]: DefaultMessageTypeList.reduce<Record<string, boolean>>((prevValueMap, type) => Object.assign({}, prevValueMap, {
317+
[type]: true
318+
}), {})
319+
}), {})
320+
})
253321
};
254322
255323
// 初始化查询
@@ -283,6 +351,11 @@
283351
.message-type-head {
284352
display: flex;
285353
align-items: center;
354+
355+
.message-type-head-tip {
356+
font-size: 14px;
357+
color: #63656e;
358+
}
286359
}
287360
}
288361
}

0 commit comments

Comments
 (0)