feat(frontend): internal WBS workspace preview page #18
@@ -0,0 +1,168 @@
|
||||
import { ref } from 'vue';
|
||||
import { KsStatusTag } from '@/shared/ui/components';
|
||||
const selectedId = ref('UI-001');
|
||||
const items = [
|
||||
{ id: 'UI-001', title: '공유 컴포넌트 카탈로그와 상태 프리뷰', owner: 'FE Platform', state: 'IN_PROGRESS' },
|
||||
{ id: 'UI-002', title: 'WBS 실행 화면 및 요구사항 추적', owner: 'Delivery', state: 'IN_PROGRESS' },
|
||||
{ id: 'DATA-001', title: 'DB 스키마 Read Model/API 계약', owner: 'Data Platform', state: 'DECISION_REQUIRED' },
|
||||
{ id: 'OPS-001', title: 'Playwright 시각·상태행렬 검증', owner: 'QA', state: 'IN_PROGRESS' },
|
||||
];
|
||||
const __VLS_ctx = {
|
||||
...{},
|
||||
...{},
|
||||
};
|
||||
let __VLS_components;
|
||||
let __VLS_intrinsics;
|
||||
let __VLS_directives;
|
||||
/** @type {__VLS_StyleScopedClasses['page-header']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['summary-grid']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['summary-grid']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['summary-grid']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['list']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['workspace']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['summary-grid']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['page-header']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.section, __VLS_intrinsics.section)({
|
||||
...{ class: "page" },
|
||||
'aria-labelledby': "wbs-title",
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['page']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.header, __VLS_intrinsics.header)({
|
||||
...{ class: "page-header" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['page-header']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({
|
||||
...{ class: "eyebrow" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['eyebrow']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.h1, __VLS_intrinsics.h1)({
|
||||
id: "wbs-title",
|
||||
});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({});
|
||||
let __VLS_0;
|
||||
/** @ts-ignore @type { | typeof __VLS_components.KsStatusTag} */
|
||||
KsStatusTag;
|
||||
// @ts-ignore
|
||||
const __VLS_1 = __VLS_asFunctionalComponent1(__VLS_0, new __VLS_0({
|
||||
value: "AUTOMATION OFF",
|
||||
severity: "warning",
|
||||
}));
|
||||
const __VLS_2 = __VLS_1({
|
||||
value: "AUTOMATION OFF",
|
||||
severity: "warning",
|
||||
}, ...__VLS_functionalComponentArgsRest(__VLS_1));
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
|
||||
...{ class: "summary-grid" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['summary-grid']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
|
||||
...{ class: "ks-card" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
|
||||
...{ class: "ks-card" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
|
||||
...{ class: "ks-card" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.strong, __VLS_intrinsics.strong)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.div, __VLS_intrinsics.div)({
|
||||
...{ class: "workspace" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['workspace']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.section, __VLS_intrinsics.section)({
|
||||
...{ class: "ks-card list" },
|
||||
'aria-labelledby': "wbs-list-title",
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['list']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.h2, __VLS_intrinsics.h2)({
|
||||
id: "wbs-list-title",
|
||||
});
|
||||
for (const [item] of __VLS_vFor((__VLS_ctx.items))) {
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.button, __VLS_intrinsics.button)({
|
||||
...{ onClick: (...[$event]) => {
|
||||
return (__VLS_ctx.selectedId = item.id);
|
||||
// @ts-ignore
|
||||
[items, selectedId,];
|
||||
} },
|
||||
key: (item.id),
|
||||
...{ class: "wbs-row" },
|
||||
...{ class: ({ selected: __VLS_ctx.selectedId === item.id }) },
|
||||
type: "button",
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['wbs-row']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['selected']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.span, __VLS_intrinsics.span)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.b, __VLS_intrinsics.b)({});
|
||||
(item.id);
|
||||
(item.title);
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.small, __VLS_intrinsics.small)({});
|
||||
(item.owner);
|
||||
let __VLS_5;
|
||||
/** @ts-ignore @type { | typeof __VLS_components.KsStatusTag} */
|
||||
KsStatusTag;
|
||||
// @ts-ignore
|
||||
const __VLS_6 = __VLS_asFunctionalComponent1(__VLS_5, new __VLS_5({
|
||||
value: (item.state),
|
||||
severity: (item.state === 'DONE' ? 'success' : item.state === 'DECISION_REQUIRED' ? 'danger' : 'info'),
|
||||
}));
|
||||
const __VLS_7 = __VLS_6({
|
||||
value: (item.state),
|
||||
severity: (item.state === 'DONE' ? 'success' : item.state === 'DECISION_REQUIRED' ? 'danger' : 'info'),
|
||||
}, ...__VLS_functionalComponentArgsRest(__VLS_6));
|
||||
// @ts-ignore
|
||||
[selectedId,];
|
||||
}
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.section, __VLS_intrinsics.section)({
|
||||
...{ class: "ks-card detail" },
|
||||
'aria-labelledby': "wbs-detail-title",
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['ks-card']} */ ;
|
||||
/** @type {__VLS_StyleScopedClasses['detail']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.h2, __VLS_intrinsics.h2)({
|
||||
id: "wbs-detail-title",
|
||||
});
|
||||
if (__VLS_ctx.selectedId === 'DATA-001') {
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({
|
||||
...{ class: "warning" },
|
||||
});
|
||||
/** @type {__VLS_StyleScopedClasses['warning']} */ ;
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dl, __VLS_intrinsics.dl)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dt, __VLS_intrinsics.dt)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dd, __VLS_intrinsics.dd)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dt, __VLS_intrinsics.dt)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dd, __VLS_intrinsics.dd)({});
|
||||
}
|
||||
else {
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.p, __VLS_intrinsics.p)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dl, __VLS_intrinsics.dl)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dt, __VLS_intrinsics.dt)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dd, __VLS_intrinsics.dd)({});
|
||||
(__VLS_ctx.selectedId);
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dt, __VLS_intrinsics.dt)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dd, __VLS_intrinsics.dd)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dt, __VLS_intrinsics.dt)({});
|
||||
__VLS_asFunctionalElement1(__VLS_intrinsics.dd, __VLS_intrinsics.dd)({});
|
||||
}
|
||||
// @ts-ignore
|
||||
[selectedId, selectedId,];
|
||||
const __VLS_export = (await import('vue')).defineComponent({});
|
||||
export default {};
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user