creation and update working

Faithful-Resource-Pack · Jan 18, 2024 · 268e53e · 268e53e
1 parent 9d1e7ab
commit 268e53e
Show file tree

Hide file tree

Showing 6 changed files with 158 additions and 34 deletions.
diff --git a/index.html b/index.html
@@ -3,7 +3,7 @@
 <head>
   <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
   <link href="https://cdn.jsdelivr.net/npm/@mdi/font@6.9.96/css/materialdesignicons.min.css" rel="stylesheet">
-  <link href="https://cdn.jsdelivr.net/npm/vuetify@2.7.1/dist/vuetify.min.css" rel="stylesheet">
+  <link href="https://cdn.jsdelivr.net/npm/vuetify@2.6.14/dist/vuetify.min.css" rel="stylesheet">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
   <meta name="theme-color" content="#272727">
   <link rel="icon" type="image/png" sizes="32x32"   href="https://faithfulpack.net/image/pwa/favicon-32x32.png">

diff --git a/pages/pack/main.js b/pages/pack/main.js
@@ -1,11 +1,13 @@
 /* global axios, Vue */
 
 const PackCreator = () => import("./pack_creator.js");
+const PackRemoveConfirm = () => import("./pack_remove_confirm.js");
 
 export default {
   name: "pack-page",
   components: {
     "pack-creator": PackCreator,
+    "pack-remove-confirm": PackRemoveConfirm
   },
   template: `
     <v-container>
@@ -16,8 +18,13 @@ export default {
         :disableDialog="disableDialog"
         :data="dialogData"
         :add="dialogDataAdd"
-        :tags="packTags">
+        :tags="tags">
       </pack-creator>
+      <pack-remove-confirm
+        :confirm="remove.confirm"
+        :disableDialog="function() { remove.confirm = false; startSearch(); }"
+        :data="remove.data">
+      </pack-remove-confirm>
 
       <v-row no-gutters class="py-0 mb-0" align="center">
         <v-col cols="12" sm="6" class="mt-4 py-sm-0">
@@ -96,8 +103,10 @@ export default {
       dialogOpen: false,
       dialogData: {},
       dialogDataAdd: false,
-      removeConfirm: false,
-      removeData: {},
+      remove: {
+        data: {},
+        confirm: false,
+      },
     };
   },
   methods: {
@@ -145,8 +154,8 @@ export default {
       if (refresh) this.startSearch();
     },
     askRemove(data) {
-      this.removeData = data;
-      this.removeConfirm = true;
+      this.remove.data = data;
+      this.remove.confirm = true;
     },
   },
   computed: {

diff --git a/pages/pack/pack_creator.js b/pages/pack/pack_creator.js
@@ -13,13 +13,14 @@ export default {
         :disableDialog="disableSubmission"
         :data="submissionData"
         :add="submissionAdd"
+        :first="add"
         @submissionFinished="addSubmissionData"
       >
       </submission-creator>
       <v-card>
         <v-card-title class="headline" v-text="dialogTitle"></v-card-title>
         <v-card-text>
-          <v-form ref="form">
+          <v-form ref="form" lazy-validation>
             <v-text-field
               :color="color"
               :hint="add ? $root.lang().database.hints.pack_id_creation : $root.lang().database.hints.pack_id_editing"
@@ -126,7 +127,7 @@ export default {
     },
     disableSubmission() {
       this.submissionOpen = false;
-      this.getSubmission(this.formData.id);
+      if (!this.add) this.getSubmission(this.formData.id);
       this.$forceUpdate();
     },
     validURL(str) {
@@ -142,11 +143,39 @@ export default {
       return pattern.test(str);
     },
     addSubmissionData(data) {
+      if (!this.submissionAdd) return;
       this.formData.submission = data || {};
     },
     send() {
-      console.log("PACK DATA SENT " + JSON.stringify(this.formData, null, 4));
-      this.disableDialog();
+      const data = { ...this.formData };
+
+      // if user doesn't specify id on pack creation, the API will assume it
+      if (this.add) {
+        if (!data.submission.id) delete data.submission.id;
+        if (!data.id) delete data.id;
+      }
+
+      // only add submission property if filled out
+      if (
+        !this.submissionAdd || // if changing submission, already done separately
+        !data.submission ||
+        !Object.keys(data.submission ?? {}).length
+      )
+        delete data.submission;
+
+      const requestPromise = this.submissionAdd || this.add
+        ? axios.post(`${this.$root.apiURL}/packs`, data, this.$root.apiOptions)
+        : axios.put(`${this.$root.apiURL}/packs/${data.id}`, data, this.$root.apiOptions);
+
+      requestPromise
+        .then(() => {
+          this.$root.showSnackBar(this.$root.lang().global.ends_success, "success");
+          this.disableDialog(true);
+        })
+        .catch((err) => {
+          console.error(err);
+          this.$root.showSnackBar(err, "error");
+        });
     },
   },
   computed: {
@@ -163,12 +192,10 @@ export default {
           if (this.add) this.$refs.form.reset();
 
           if (!this.add) {
-            this.formData.id = this.data.id;
-            this.formData.name = this.data.name;
-            this.formData.tags = this.data.tags;
-            this.formData.logo = this.data.logo;
-            this.formData.resolution = this.data.resolution;
-            this.formData.github = this.data.github;
+            for (const [k, v] of Object.entries(this.data)) {
+              if (this.formData[k] === undefined) continue;
+              this.formData[k] = v;
+            }
             this.getSubmission(this.data.id);
           }
         });

diff --git a/pages/pack/pack_remove_confirm.js b/pages/pack/pack_remove_confirm.js
@@ -0,0 +1,66 @@
+/* global axios */
+
+export default {
+  name: "pack-remove-confirm",
+  template: `
+  <v-dialog
+      v-model="confirm"
+      content-class="colored"
+      max-width="600"
+    >
+      <v-card>
+        <v-card-title class="headline">{{ $root.lang().database.titles.confirm_deletion }}</v-card-title>
+        <v-card-text>
+          <v-form ref="form" lazy-validation>
+            <p>{{ $root.lang().database.labels.ask_deletion.replace('%s', data.name).replace('%d', data.id) }}</p>
+          </v-form>
+        </v-card-text>
+        <v-card-actions>
+          <v-spacer></v-spacer>
+          <v-btn
+            color="darken-1"
+            text
+            @click="disableDialog"
+          >
+            {{ $root.lang().global.btn.cancel }}
+          </v-btn>
+          <v-btn
+            color="error darken-1"
+            @click="deletePack"
+          >
+            {{ $root.lang().global.btn.yes }}
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+  `,
+  props: {
+    confirm: {
+      type: Boolean,
+      required: true,
+    },
+    data: {
+      type: Object,
+      required: true,
+    },
+    disableDialog: {
+      type: Function,
+      required: true,
+    },
+  },
+  methods: {
+    deletePack() {
+      axios
+        .delete(`${this.$root.apiURL}/packs/${this.data.id}`, this.$root.apiOptions)
+        .then(() => {
+          this.$root.showSnackBar(this.$root.lang().global.ends_success, "success");
+          this.disableDialog(true);
+        })
+        .catch((error) => {
+          console.error(error);
+          this.$root.showSnackBar(err, "error");
+          this.disableDialog(true);
+        });
+    },
+  },
+};
diff --git a/pages/pack/submission_creator.js b/pages/pack/submission_creator.js
@@ -9,10 +9,10 @@ export default {
       <v-card>
         <v-card-title class="headline" v-text="submissionTitle"></v-card-title>
         <v-card-text>
-          <v-form ref="form" v-model="formValid">
+          <v-form ref="form" v-model="formValid" lazy-validation>
             <v-text-field
               :color="color"
-              v-if="!add"
+              v-if="!first"
               persistent-hint
               :hint="$root.lang().database.hints.pack_id_editing"
               v-model="formData.id"
@@ -29,9 +29,9 @@ export default {
               :label="$root.lang().database.labels.submission_reference">
             </v-select>
             <v-container>
-              <v-row><v-checkbox :color="color" v-model="formData.council_enabled" :label="$root.lang().database.labels.council_enabled">
-              </v-checkbox></v-row>
-              <v-row><v-range></v-range></v-row>
+              <v-row>
+                <v-checkbox :color="color" v-model="formData.council_enabled" :label="$root.lang().database.labels.council_enabled"></v-checkbox>
+              </v-row>
             </v-container>
           </v-form>
         </v-card-text>
@@ -79,6 +79,11 @@ export default {
       required: false,
       default: false,
     },
+    first: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   data() {
     return {
@@ -92,17 +97,37 @@ export default {
           council: "",
           results: "",
         },
-        time_to_council: "",
-        time_to_results: "",
+        time_to_council: 0,
+        time_to_results: 0,
         contributor_role: "",
       },
       packs: [],
     };
   },
   methods: {
     send() {
-      this.$emit("submissionFinished", this.formData);
-      this.disableDialog();
+      if (this.first) {
+        this.$emit("submissionFinished", this.formData);
+        return this.disableDialog();
+      }
+
+      const requestPromise = this.add
+        ? axios.post(`${this.$root.apiURL}/submissions`, this.formData, this.$root.apiOptions)
+        : axios.put(
+            `${this.$root.apiURL}/submissions/${this.formData.id}`,
+            this.formData,
+            this.$root.apiOptions,
+          );
+
+      requestPromise
+        .then(() => {
+          this.$root.showSnackBar(this.$root.lang().global.ends_success, "success");
+          this.disableDialog(true);
+        })
+        .catch((err) => {
+          console.error(err);
+          this.$root.showSnackBar(err, "error");
+        });
     },
   },
   computed: {
@@ -124,14 +149,11 @@ export default {
     dialog(newValue) {
       if (newValue === true) {
         Vue.nextTick(() => {
-          if (!this.add) {
-            this.formData.id = this.data.id;
-            this.formData.reference = this.data.reference;
-            this.formData.channels = this.data.channels;
-            this.formData.council_enabled = this.data.council_enabled;
-            this.formData.time_to_council = this.data.time_to_council;
-            this.formData.time_to_results = this.data.time_to_results;
-            this.formData.contributor_role = this.data.contributor_role;
+          if (!this.first) {
+            for (const [k, v] of Object.entries(this.data)) {
+              if (this.formData[k] === undefined) continue;
+              this.formData[k] = v;
+            }
           } else {
             this.$refs.form.reset();
             if (this.data.id) this.formData.id = this.data.id;

diff --git a/resources/strings/en_US.js b/resources/strings/en_US.js
@@ -178,7 +178,7 @@ export default {
       pack_logo: "Pack logo URL",
       council_enabled: "Enable council",
       submission_reference: "Reference pack",
-      edit_submission: "Edit Submission information",
+      edit_submission: "Edit submission information",
       invalid_url: "This URL is not valid",
       new_submission: "Enable Submissions",
       edit_mc_version: "Modify a Minecraft Version",