From 65cd51daa89115ad4c0732234111ac7dc1d4c62e Mon Sep 17 00:00:00 2001
From: winkidney <winkidney@gmail.com>
Date: Tue, 11 Feb 2020 15:36:35 +0800
Subject: [PATCH] Feature: Add UI to handle visible-option for single Pin

---
 pinry-spa/src/components/Pins.vue                 |  1 +
 .../src/components/pin_edit/PinCreateModal.vue    | 15 ++++++++++++---
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/pinry-spa/src/components/Pins.vue b/pinry-spa/src/components/Pins.vue
index de0c7ea..990b880 100644
--- a/pinry-spa/src/components/Pins.vue
+++ b/pinry-spa/src/components/Pins.vue
@@ -90,6 +90,7 @@ function createImageItem(pin) {
   image.url = pinHandler.escapeUrl(pin.image.thumbnail.image);
   image.id = pin.id;
   image.owner_id = pin.submitter.id;
+  image.private = pin.private;
   image.description = pin.description;
   image.tags = pin.tags;
   image.author = pin.submitter.username;
diff --git a/pinry-spa/src/components/pin_edit/PinCreateModal.vue b/pinry-spa/src/components/pin_edit/PinCreateModal.vue
index 4b27bf7..0abfaa9 100644
--- a/pinry-spa/src/components/pin_edit/PinCreateModal.vue
+++ b/pinry-spa/src/components/pin_edit/PinCreateModal.vue
@@ -27,6 +27,13 @@
                 >
                 </b-input>
               </b-field>
+              <b-field label="Privacy Option"
+                       :type="pinModel.form.private.type"
+                       :message="pinModel.form.private.error">
+                <b-checkbox v-model="pinModel.form.private.value">
+                    {{ pinModel.form.private.value?"only visible to yourself":"visible to everyone" }}
+                </b-checkbox>
+              </b-field>
               <b-field label="Image Referer"
                        :type="pinModel.form.referer.type"
                        :message="pinModel.form.referer.error">
@@ -107,7 +114,7 @@ function isURLBlank(url) {
   return url !== null && url === '';
 }
 
-const fields = ['url', 'referer', 'description', 'tags'];
+const fields = ['url', 'referer', 'description', 'tags', 'private'];
 
 export default {
   name: 'PinCreateModal',
@@ -160,11 +167,13 @@ export default {
       this.pinModel.form.referer.value = this.existedPin.referer;
       this.pinModel.form.description.value = this.existedPin.description;
       this.pinModel.form.tags.value = this.existedPin.tags;
+      this.pinModel.form.private.value = this.existedPin.private;
     }
     if (this.fromUrl) {
       this.pinModel.form.url.value = this.fromUrl.url;
       this.pinModel.form.referer.value = this.fromUrl.referer;
       this.pinModel.form.description.value = this.fromUrl.description;
+      this.pinModel.form.private.value = false;
     }
   },
   methods: {
@@ -216,7 +225,7 @@ export default {
     savePin() {
       const self = this;
       const data = this.pinModel.asDataByFields(
-        ['referer', 'description', 'tags'],
+        ['referer', 'description', 'tags', 'private'],
       );
       const promise = API.Pin.updateById(this.existedPin.id, data);
       promise.then(
@@ -239,7 +248,7 @@ export default {
         promise = API.Pin.createFromURL(data);
       } else {
         const data = this.pinModel.asDataByFields(
-          ['referer', 'description', 'tags'],
+          ['referer', 'description', 'tags', 'private'],
         );
         data.image_by_id = this.formUpload.imageId;
         promise = API.Pin.createFromUploaded(data);