web/satellite: title removed from header component (#2749)
This commit is contained in:
parent
fc4c675ffa
commit
6290d8c645
@ -3,7 +3,6 @@
|
||||
|
||||
<template>
|
||||
<div class="header-container">
|
||||
<h1>{{title}}</h1>
|
||||
<div class="header-container__wrapper">
|
||||
<div class="header-container__buttons-area">
|
||||
<slot></slot>
|
||||
@ -32,8 +31,6 @@
|
||||
private readonly placeHolder: string;
|
||||
@Prop({default: () => { return ''; }})
|
||||
private readonly search: searchCallback;
|
||||
@Prop({default: ''})
|
||||
private readonly title;
|
||||
|
||||
public $refs!: {
|
||||
search: SearchComponent & ClearSearch;
|
||||
@ -49,13 +46,6 @@
|
||||
.header-container {
|
||||
width: 100%;
|
||||
|
||||
h1 {
|
||||
font-family: 'font_bold';
|
||||
font-size: 32px;
|
||||
line-height: 39px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
width: 100%;
|
||||
height: 85px;
|
||||
|
@ -3,23 +3,26 @@
|
||||
|
||||
<template>
|
||||
<div class="team-header-container">
|
||||
<HeaderComponent ref="headerComponent" placeHolder="Team Members" :search="processSearchQuery" title="Project Members">
|
||||
<div class="header-default-state" v-if="headerState === 0">
|
||||
<span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
|
||||
<Button class="button" label="+Add" width="122px" height="48px" :onPress="onAddUsersClick"/>
|
||||
</div>
|
||||
<div class="header-selected-members" v-if="headerState === 1 && !isDeleteClicked">
|
||||
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onFirstDeleteClick"/>
|
||||
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
|
||||
</div>
|
||||
<div class="header-after-delete-click" v-if="headerState === 1 && isDeleteClicked">
|
||||
<span>Are you sure you want to delete {{selectedProjectMembers}} {{userCountTitle}}</span>
|
||||
<div class="header-after-delete-click__button-area">
|
||||
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onDelete"/>
|
||||
<h1>Project Members</h1>
|
||||
<div class="team-header-container__wrapper">
|
||||
<HeaderComponent ref="headerComponent" placeHolder="Team Members" :search="processSearchQuery">
|
||||
<div class="header-default-state" v-if="headerState === 0">
|
||||
<span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
|
||||
<Button class="button" label="+Add" width="122px" height="48px" :onPress="onAddUsersClick"/>
|
||||
</div>
|
||||
<div class="header-selected-members" v-if="headerState === 1 && !isDeleteClicked">
|
||||
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onFirstDeleteClick"/>
|
||||
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
|
||||
</div>
|
||||
</div>
|
||||
</HeaderComponent>
|
||||
<div class="header-after-delete-click" v-if="headerState === 1 && isDeleteClicked">
|
||||
<span>Are you sure you want to delete {{selectedProjectMembers}} {{userCountTitle}}</span>
|
||||
<div class="header-after-delete-click__button-area">
|
||||
<Button class="button deletion" label="Delete" width="122px" height="48px" :onPress="onDelete"/>
|
||||
<Button class="button" label="Cancel" width="122px" height="48px" isWhite="true" :onPress="onClearSelection"/>
|
||||
</div>
|
||||
</div>
|
||||
</HeaderComponent>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -107,6 +110,13 @@
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
h1 {
|
||||
font-family: 'font_bold';
|
||||
font-size: 32px;
|
||||
line-height: 39px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.header-default-state,
|
||||
.header-after-delete-click {
|
||||
display: flex;
|
||||
@ -140,7 +150,7 @@
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
.team-header-container {
|
||||
.team-header-container__wrapper {
|
||||
margin-bottom: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -17,7 +17,6 @@ describe('HeaderComponent.vue', () => {
|
||||
|
||||
expect(wrapper.vm.$props.placeHolder).toMatch('');
|
||||
expect(wrapper.vm.$props.search).toMatch('');
|
||||
expect(wrapper.vm.$props.title).toMatch('');
|
||||
});
|
||||
|
||||
it('function clearSearch works correctly', () => {
|
||||
|
@ -2,7 +2,6 @@
|
||||
|
||||
exports[`HeaderComponent.vue renders correctly 1`] = `
|
||||
<div class="header-container">
|
||||
<h1></h1>
|
||||
<div class="header-container__wrapper">
|
||||
<div class="header-container__buttons-area"></div>
|
||||
<searchcomponent-stub placeholder="" search=""></searchcomponent-stub>
|
||||
|
@ -2,12 +2,15 @@
|
||||
|
||||
exports[`HeaderArea.vue renders correctly 1`] = `
|
||||
<div class="team-header-container">
|
||||
<headercomponent-stub placeholder="Team Members" search="function () { [native code] }" title="Project Members">
|
||||
<div class="header-default-state"><span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
|
||||
<button-stub label="+Add" width="122px" height="48px" onpress="function () { [native code] }" class="button"></button-stub>
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
</headercomponent-stub>
|
||||
<h1>Project Members</h1>
|
||||
<div class="team-header-container__wrapper">
|
||||
<headercomponent-stub placeholder="Team Members" search="function () { [native code] }">
|
||||
<div class="header-default-state"><span>The only project role currently available is Admin, which gives <b>full access</b> to the project.</span>
|
||||
<button-stub label="+Add" width="122px" height="48px" onpress="function () { [native code] }" class="button"></button-stub>
|
||||
</div>
|
||||
<!---->
|
||||
<!---->
|
||||
</headercomponent-stub>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
Loading…
Reference in New Issue
Block a user