me/mime-chat
Watch
1
0
Fork
You've already forked mime-chat
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add input item to UI index

Browse source
This commit is contained in:
riqo 2020-10-25 11:22:23 -05:00
commit 0a3bf4ca42
3 changed files with 125 additions and 137 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/components/UI/UIDetails/messageItem.vue
View file

@ -72,10 +72,11 @@ import { defineComponent, computed, onMounted, ref, reactive } from 'vue';
const contentTag = ref(`content${msgID.value}`); const contentTag = ref(`content${msgID.value}`);
let bubble: any; let bubble: any;
let content: any; let content: any;
console.log(props)
const textFill = computed(() => { const textFill = computed(() => {
switch (props.item.modifier) { switch (props.item.modifier) {
case "ai": case "ai" || "sf":
return "#fff"; return "#fff";
default: default:
return "#000"; return "#000";

18
src/components/UI/index.vue
View file

@ -84,18 +84,13 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, inject, onMounted, reactive } from "vue"; import { defineComponent, inject, onMounted, reactive } from "vue";
import MessageItem from './UIDetails/messageItem.vue'; import MessageItem from './UIDetails/messageItem.vue';
import Messages from "./UIDetails/messages"; import InputItem from "@/components/UI/UIDetails/inputItem.vue";
export default defineComponent({ import Messages from "./UIDetails/messages";
export default defineComponent({
name: 'UIindex', name: 'UIindex',
components: { MessageItem }, components: { MessageItem, InputItem },
setup() { setup() {
interface ProtectedRef {
readonly el: SVGElement | HTMLElement;
reference: any;
height: number | null;
}
const anime: object | any = inject('animejs'); const anime: object | any = inject('animejs');
const timeline: typeof anime = anime.timeline({ loop: true }); const timeline: typeof anime = anime.timeline({ loop: true });
const renderArr: Message[] = reactive([]) const renderArr: Message[] = reactive([])
@ -186,7 +181,6 @@ import { defineComponent, inject, onMounted, reactive } from "vue";
runAnim(); runAnim();
}); });
return { return {
// timeline,
renderArr, renderArr,
msgOffset, msgOffset,
beforeEnter, beforeEnter,
@ -194,7 +188,7 @@ import { defineComponent, inject, onMounted, reactive } from "vue";
leave leave
} }
}, },
}); });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

21
src/views/home/index.vue
View file

@ -1,25 +1,18 @@
<template> <template>
<!-- <UIindex /> <UIindex />
<Microphone /> -->
<InputItem />
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, inject } from 'vue'; import { defineComponent, inject } from 'vue';
// import UIindex from "@/components/UI/index.vue"; import UIindex from "@/components/UI/index.vue";
// import Microphone from "@/components/microphone/index.vue"; // import Microphone from "@/components/microphone/index.vue";
import InputItem from "@/components/UI/UIDetails/inputItem.vue";
export default defineComponent({ export default defineComponent({
name: "HomeIndex", name: "HomeIndex",
components: { InputItem }, components: { UIindex },
setup() { setup() {
const emitter: any = inject("mitt"); const emitter: any = inject("mitt");
emitter.on('newSelfMessage', (payload: any) => console.log('foo', payload) ) emitter.on('newSelfMessage', (payload: any) => console.log('foo', payload) )
} }
}); });
</script> </script>
<style></style>