diff --git a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.html b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.html index 67f5ebb..ccbd174 100644 --- a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.html +++ b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.html @@ -1,32 +1,41 @@
-
+
-

+
-
+
- +
- - + +
- +
+
- +
-
- Подробнее -
+
+ + + Подробнее + +
+
+
+
+ 
{{getFields(member)|json}}
+
- + +
diff --git a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.scss b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.scss index e5d4877..90de881 100644 --- a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.scss +++ b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.scss @@ -4,7 +4,7 @@ width: 100%; max-width: 900px; .add { - padding: 16px 12px; + padding: 16px ; display: flex; justify-content: space-between; width: 100%; @@ -64,6 +64,7 @@ } .image { + cursor: pointer; // background: url("/assets/images/view-man.svg") center no-repeat; img { width: 273px; @@ -91,28 +92,46 @@ } .link{ font-size: 20px; - display: block; + display: inline-block; + &.tel::before{ + content: ''; + width: 24px; + height: 24px; + display: inline-block; + vertical-align: -3px; + margin-right: 4px; + background: url('~src/assets/images/icons/phone_blue_24dp.svg') center no-repeat; + } + &.mail::before{ + content: ''; + width: 24px; + height: 24px; + display: inline-block; + vertical-align: -5px; + margin-right: 4px; + background: url('~src/assets/images/icons/mail_blue_24dp.svg') center no-repeat; + } + + } .doc{ width: 100%; display: flex; - overflow: hidden; - text-overflow:ellipsis; .doc-icon{ flex-basis: 60px; align-items: flex-start; flex-shrink: 0; height: 60px; background: center no-repeat; - background-image: url('~src/assets/images/icons/document/document_pdf_60dp.svg'); + background-image: url('~src/assets/images/icons/document/document_60dp.svg'); background-size: contain; } .doc-link{ flex-shrink: 0; flex-grow: 0; - flex-basis: 100%; + flex-basis: 200px; white-space: nowrap; overflow: hidden; text-overflow:ellipsis; @@ -127,4 +146,37 @@ } } } -} + + .full-screen{ + position: fixed; + top:0; + z-index: 200; + left: 0; + background-color: rgba(45, 45, 45, 0.63); + width: 100vw; + height: 100vh; + object-fit: contain; + cursor: pointer; + } + .modal{ + position: fixed; + top:0; + z-index: 200; + left: 0; + background-color: rgba(45, 45, 45, 0.63); + width: 100vw; + height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + div{ + background-color: #fff; + width: 50vw; + min-width: 400px; + border-radius: 12px; + padding: 0 24px; + } + } + } + diff --git a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.ts b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.ts index da10129..e040d50 100644 --- a/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.ts +++ b/src/app/_modules/pages/sections/types/basic/member/list/member-section-list.component.ts @@ -12,6 +12,9 @@ export class MemberSectionListComponent { @Input() editMode: boolean; @Input() page: any; + public showImage = false; + public showDescription = false; + constructor( private formsService: FormsService, private router: Router, @@ -56,7 +59,8 @@ export class MemberSectionListComponent { } iconUrl(name:string){ - return `url(/assets/images/icons/document/${name.toUpperCase()}.svg)` + + if (name)return ICON_TYPE[name] && `url(/assets/images/icons/document/${ICON_TYPE[name]}.svg)` } get modelType() { @@ -74,4 +78,24 @@ export class MemberSectionListComponent { getLink(id: any) { return this.router.url + '?id=' + id; } + + photo(member) { + console.log(member) + console.log(this.getFields(member)) + console.log(this.getFields(member)['member-image'].links.open) + return this.getFields(member)['member-image'].links.open + } +} + + +const ICON_TYPE:any={ + docx:'DOC', + doc:'DOC', + xl:'XLS', + xls:'XLS', + ppt:'PPT', + pptx:'PPT', + jpg:'JPG', + jpeg:'JPG', + pdf:'PDF' } diff --git a/src/assets/images/icons/document/document_60dp.svg b/src/assets/images/icons/document/document_60dp.svg new file mode 100644 index 0000000..b0e563a --- /dev/null +++ b/src/assets/images/icons/document/document_60dp.svg @@ -0,0 +1,20 @@ + + + + background + + + + Layer 1 + + + + + + + + + + FILE + + \ No newline at end of file diff --git a/src/assets/images/icons/mail_orange_24dp.svg b/src/assets/images/icons/mail_blue_24dp.svg similarity index 90% rename from src/assets/images/icons/mail_orange_24dp.svg rename to src/assets/images/icons/mail_blue_24dp.svg index c1877f6..a33d91a 100644 --- a/src/assets/images/icons/mail_orange_24dp.svg +++ b/src/assets/images/icons/mail_blue_24dp.svg @@ -1,6 +1,6 @@ - + diff --git a/src/assets/images/icons/phone_orange_24dp.svg b/src/assets/images/icons/phone_blue_24dp.svg similarity index 96% rename from src/assets/images/icons/phone_orange_24dp.svg rename to src/assets/images/icons/phone_blue_24dp.svg index 8746520..a9a3ad7 100644 --- a/src/assets/images/icons/phone_orange_24dp.svg +++ b/src/assets/images/icons/phone_blue_24dp.svg @@ -3,7 +3,7 @@ - +