Improve page and post detail views
This commit is contained in:
64
CHDataManagement/Views/Posts/LocalizedPostDetailView.swift
Normal file
64
CHDataManagement/Views/Posts/LocalizedPostDetailView.swift
Normal file
@ -0,0 +1,64 @@
|
||||
import SwiftUI
|
||||
|
||||
struct LocalizedPostDetailView: View {
|
||||
|
||||
@ObservedObject
|
||||
private var item: LocalizedPost
|
||||
|
||||
init(post: LocalizedPost, showImagePicker: Bool = false) {
|
||||
self.item = post
|
||||
self.showImagePicker = showImagePicker
|
||||
}
|
||||
|
||||
@State
|
||||
private var showImagePicker = false
|
||||
|
||||
var body: some View {
|
||||
VStack(alignment: .leading) {
|
||||
Text("Link Preview Title")
|
||||
.font(.headline)
|
||||
OptionalTextField("", text: $item.linkPreviewTitle,
|
||||
prompt: item.title)
|
||||
.textFieldStyle(.roundedBorder)
|
||||
.padding(.bottom)
|
||||
|
||||
HStack {
|
||||
Text("Link Preview Image")
|
||||
.font(.headline)
|
||||
IconButton(symbol: .squareAndPencilCircleFill,
|
||||
size: 22,
|
||||
color: .blue) {
|
||||
showImagePicker = true
|
||||
}
|
||||
|
||||
IconButton(symbol: .trashCircleFill,
|
||||
size: 22,
|
||||
color: .red) {
|
||||
item.linkPreviewImage = nil
|
||||
}
|
||||
Spacer()
|
||||
}
|
||||
|
||||
.buttonStyle(.plain)
|
||||
if let image = item.linkPreviewImage {
|
||||
image.imageToDisplay
|
||||
.resizable()
|
||||
.aspectRatio(contentMode: .fit)
|
||||
.frame(maxWidth: 400, maxHeight: 300)
|
||||
.cornerRadius(8)
|
||||
}
|
||||
|
||||
Text("Link Preview Description")
|
||||
.font(.headline)
|
||||
.padding(.top)
|
||||
OptionalDescriptionField(text: $item.linkPreviewDescription)
|
||||
.textFieldStyle(.roundedBorder)
|
||||
.padding(.bottom)
|
||||
}
|
||||
.sheet(isPresented: $showImagePicker) {
|
||||
ImagePickerView(showImagePicker: $showImagePicker) { image in
|
||||
item.linkPreviewImage = image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -34,115 +34,64 @@ struct PostDetailView: View {
|
||||
private var language
|
||||
|
||||
@ObservedObject
|
||||
var post: Post
|
||||
|
||||
@State
|
||||
private var showPagePicker = false
|
||||
private var item: Post
|
||||
|
||||
init(post: Post) {
|
||||
self.post = post
|
||||
}
|
||||
|
||||
private var linkedPageText: String {
|
||||
if let page = post.linkedPage {
|
||||
return page.localized(in: language).title
|
||||
}
|
||||
return "Add"
|
||||
self.item = post
|
||||
}
|
||||
|
||||
var body: some View {
|
||||
ScrollView {
|
||||
VStack(alignment: .leading) {
|
||||
Text("Post data")
|
||||
Text("ID")
|
||||
.font(.headline)
|
||||
DetailListItem {
|
||||
Text("ID")
|
||||
.foregroundStyle(.primary)
|
||||
TextField("ID", text: $post.id)
|
||||
.multilineTextAlignment(.trailing)
|
||||
}
|
||||
DetailListItem {
|
||||
TextField("", text: $item.id)
|
||||
.textFieldStyle(.roundedBorder)
|
||||
.padding(.bottom)
|
||||
|
||||
HStack {
|
||||
Text("Draft")
|
||||
.font(.headline)
|
||||
Spacer()
|
||||
Toggle(isOn: $post.isDraft) {
|
||||
Text("")
|
||||
}.toggleStyle(.switch)
|
||||
Toggle("", isOn: $item.isDraft)
|
||||
.toggleStyle(.switch)
|
||||
}
|
||||
DetailListItem {
|
||||
.padding(.bottom)
|
||||
|
||||
HStack {
|
||||
Text("Start")
|
||||
.font(.headline)
|
||||
Spacer()
|
||||
DatePicker("", selection: $post.startDate, displayedComponents: .date)
|
||||
DatePicker("", selection: $item.startDate, displayedComponents: .date)
|
||||
.datePickerStyle(.compact)
|
||||
.padding(.bottom)
|
||||
}
|
||||
DetailListItem {
|
||||
Text("End")
|
||||
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
Text("Has end date")
|
||||
.font(.headline)
|
||||
Spacer()
|
||||
Toggle(isOn: $post.hasEndDate) {
|
||||
Text("")
|
||||
}.toggleStyle(.switch)
|
||||
DatePicker("", selection: $post.endDate, displayedComponents: .date)
|
||||
.datePickerStyle(.compact)
|
||||
.disabled(!post.hasEndDate)
|
||||
Toggle("", isOn: $item.hasEndDate)
|
||||
.toggleStyle(.switch)
|
||||
.padding(.bottom)
|
||||
}
|
||||
DetailListItem {
|
||||
Text("Linked page")
|
||||
Spacer()
|
||||
Button(action: { showPagePicker = true }) {
|
||||
Text(linkedPageText)
|
||||
|
||||
if item.hasEndDate {
|
||||
HStack(alignment: .firstTextBaseline) {
|
||||
Text("End date")
|
||||
.font(.headline)
|
||||
Spacer()
|
||||
DatePicker("", selection: $item.endDate, displayedComponents: .date)
|
||||
.datePickerStyle(.compact)
|
||||
.padding(.bottom)
|
||||
}
|
||||
.buttonStyle(.plain)
|
||||
.foregroundStyle(.blue)
|
||||
}
|
||||
LocalizedPostDetailView(post: post.localized(in: language))
|
||||
|
||||
LocalizedPostDetailView(post: item.localized(in: language))
|
||||
|
||||
}
|
||||
.padding()
|
||||
}
|
||||
.sheet(isPresented: $showPagePicker) {
|
||||
PagePickerView(
|
||||
showPagePicker: $showPagePicker,
|
||||
selectedPage: $post.linkedPage)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
struct LocalizedPostDetailView: View {
|
||||
|
||||
@ObservedObject
|
||||
var post: LocalizedPost
|
||||
|
||||
@State
|
||||
private var showImagePicker = false
|
||||
|
||||
var body: some View {
|
||||
VStack(alignment: .leading) {
|
||||
Text("Link Preview")
|
||||
.font(.headline)
|
||||
DetailListItem {
|
||||
Text("Title")
|
||||
Spacer()
|
||||
OptionalTextField("", text: $post.linkPreviewTitle)
|
||||
}
|
||||
DetailListItem {
|
||||
Text("Image")
|
||||
Spacer()
|
||||
Button(action: { showImagePicker = true }) {
|
||||
Text(post.linkPreviewImage?.id ?? "Select")
|
||||
}
|
||||
.buttonStyle(.plain)
|
||||
.foregroundStyle(.blue)
|
||||
}
|
||||
DetailListItem {
|
||||
Text("Description")
|
||||
Spacer()
|
||||
OptionalTextField("", text: $post.linkPreviewDescription)
|
||||
}
|
||||
}
|
||||
.sheet(isPresented: $showImagePicker) {
|
||||
ImagePickerView(showImagePicker: $showImagePicker) { image in
|
||||
post.linkPreviewImage = image
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user