Untitled
unknown
plain_text
4 years ago
6.2 kB
4
Indexable
<template> <!-- TradingVueJs 101 (example from 'Getting Started' ) --> <div fluid style="background-color:white; height:100vh;"> <v-row no-gutters style=""> <v-col cols="3"> <div class="ma-4"> <div style="border:1px gray solid; border-radius:25px; background-color:#f3f6fb;"> <div class="float-center pa-4" > <v-avatar size="100"> <img src="https://sprofile.line-scdn.net/0hD-l2aK_7GwJBSwwkocJlfTEbGGhiOkIQZHoEYnJCQWF4fghQa3hUYCdOFmd9LFgAaHhTZn1LRGVNWGxkXx3nNkZ7RTV4fFlUaCpQ4w" alt="" > </v-avatar> <p class="pt-2 ma-0" style="font-size:2vw;"> หุ้นเบรค </p> <p class="ma-0"> 1:1 </p> </div> </div> </div> <div style="clear:both;"></div> <div class="text-center pa-4" > <p>Select Mode</p> <v-btn to="chat" outlined medium elevation="" color="">1:1</v-btn> <v-btn to="/" class="ml-2" outlined medium elevation="" color="">Settings</v-btn> </div> </v-col> <v-col cols="1"></v-col> <v-col md="4" sm="8" xs="12"> <v-card style="margin-top:5%;" class="" elevation="" max-width="" > <div style="margin-left:10%; margin-right:10%;"> <h1 class="pt-4"> Boon </h1> <p style=" cursor:pointer;" class="text-left pl-4 pt-10 float-left"> New Symbol </p> <div style="clear:both;"></div> <v-text-field :disabled="loading" :loading="loading" label="" append-icon="" v-model="symbol" outlined color></v-text-field> <v-btn @click="updateMessage" :loading="loading" class="mt-1" x-large block color="primary" dark>Submit</v-btn> <div class="pt-10"></div> </div> </v-card> </v-col> <v-col cols="3"> <div style="height:100%;" class="mr-8"> <div class="" style="margin-top:8%;"> <v-card style="height:400px; overflow:auto; margin-left:10%;"> <div hover v-for="x in items" :key="x.msg" class="pb-4" > <div class="float-left" style="width:30%;" > <v-avatar class="mt-6" size="50"> <img :src="x.url" alt="" > </v-avatar> </div> <div style="" class="float-left" > <p class="text-left mt-8" style=""> {{x.name}} </p> </div> <div style="clear:both;"></div> </div> </v-card> </div> </div> </v-col> </v-row> </div> </template> <script> import firebase from 'firebase' import axios from 'axios' export default { async mounted () { firebase.auth().onAuthStateChanged((user) => { if (user) { // ... } else { this.$router.push({name: 'login'}) // User is signed out // ... } }); const ref = firebase.firestore().collection('stock').orderBy('name', 'asc').get() this.items = await ref.then(x => x.docs.map(y => y.data())) console.log(this.items) }, name: 'app', methods: { async check () { // http://127.0.0.1:5000/ // https://main-qtct3sspsa-em.a.run.app/checkStock let bodyFormData = new FormData(); bodyFormData.append('symbol', this.symbol) const data = await axios.post("https://main-qtct3sspsa-em.a.run.app/handler", { data: bodyFormData }, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } } ) if (data) { console.log("dd") } else { alert('ไม่มีหุ้นตัวนี้') } }, async updateMessage () { this.loading = true if (!this.symbol) {return} const ref = firebase.firestore().collection('stock').doc(this.symbol) await ref.set({message: this.msg, name: this.symbol, url: ''}) await this.check() this.loading = false }, choose () { this.toggle = true }, addNew() { this.toggle = false }, onResize () { this.width = window.innerWidth this.height = window.innerHeight } }, beforeDestroy() { window.removeEventListener('resize', this.onResize) }, data() { return { loading: false, toggle: true, symbol: '', msg: '', items: [ ], select: '' } } } </script>
Editor is loading...