diff --git a/code/shaine/javascript/lab06/index.html b/code/shaine/javascript/lab06/index.html new file mode 100644 index 00000000..7242b0e8 --- /dev/null +++ b/code/shaine/javascript/lab06/index.html @@ -0,0 +1,37 @@ + + + + + + + Quotes + + + + + +
+
+

Search Quotes

+
+ + + +
+
+ +
+ +
+
+ + + + + + \ No newline at end of file diff --git a/code/shaine/javascript/lab06/script.js b/code/shaine/javascript/lab06/script.js new file mode 100644 index 00000000..0b91e195 --- /dev/null +++ b/code/shaine/javascript/lab06/script.js @@ -0,0 +1,65 @@ +const app = Vue.createApp({ + data() { + return { + query: null, + data: [], + select: "", + selections: ['Keyword','Author', 'Tag'], + option: "", + } + + }, + methods: { + async getData(){ + + if (this.select === 'Author'){ + this.option = '&type=author'; + } + else if (this.select === 'Tag'){ + this.option = '&type=tag'; + } + // console.log(this.select) + // console.log(this.option) + await axios.get(('https://favqs.com/api/quotes/?filter='+ + this.query + + this.option), { + + headers: { + 'Authorization': 'Token token="dfd15da739458b8342b029922062323d"' + } + }) + .then((response)=>{ + this.data = response.data.quotes + console.log(this.data) + }) + .catch((error)=>{ + console.log(error) + }) + // this.$refs.aQuery.reset(); + }, + async startData(){ + await axios.get(('https://favqs.com/api/quotes/'), { + + headers: { + 'Authorization': 'Token token="dfd15da739458b8342b029922062323d"' + } + }) + .then((response)=>{ + this.data = response.data.quotes + console.log(this.data) + }) + .catch((error)=>{ + console.log(error) + }) + }, + + }, + beforeMount(){ + this.startData(); + }, + + }) + + + +app.mount('#app') \ No newline at end of file