From 7acf7ad6948e3e952173a2551ea4a92a8ff56c35 Mon Sep 17 00:00:00 2001 From: suerprisePlus <15810472099@163.com> Date: 星期四, 06 六月 2024 19:36:48 +0800 Subject: [PATCH] 1 --- src/components/Chat/enterBox.vue | 79 +++++++++++++++++++++++++++++---------- 1 files changed, 58 insertions(+), 21 deletions(-) diff --git a/src/components/Chat/enterBox.vue b/src/components/Chat/enterBox.vue index a278e47..9fe3c5a 100644 --- a/src/components/Chat/enterBox.vue +++ b/src/components/Chat/enterBox.vue @@ -1,41 +1,57 @@ <template> <div class="web__msg" @keyup.enter="handleSend"> - <textarea v-model="currentMsg" rows="3" :placeholder="placeholder" class="web__msg-input"></textarea> + <!-- <textarea + v-model="currentMsg" + rows="3" + :placeholder="placeholder" + class="web__msg-input" + ></textarea> + <div class="web__msg-menu"> - <el-button class="web__msg-submit" type="primary" @click="handleSend">鍙戦��</el-button> + <el-button class="web__msg-submit" type="primary" + >鍙戦��</el-button + > + </div> --> + <div class="web_flex_input"> + <el-input v-model="currentMsg" :placeholder="placeholder"></el-input> + </div> + <div class="web_flex_button"> + <el-button @click="handleSend" type="primary"> + <i class="el-icon-s-promotion"></i> + </el-button> </div> </div> </template> <script> export default { - name: 'JwChat_enterbox', + name: "JwChat_enterbox", props: { placeholder: { type: String, - default: '璇疯緭鍏ュ唴瀹�...' + default: "鍛婅瘔鎴戜綘鎯宠鐭ラ亾浠�涔�..." }, value: { - default: '' + default: "" } }, - data () { + data() { return { currentMsg: this.msg - } + }; }, watch: { value: { - handler () { + handler() { this.currentMsg = this.value; }, immediate: true }, currentMsg: { - handler (newval) { + handler(newval) { if (newval) { - const msg = newval.trim() - this.$emit('input', msg) + const msg = newval.trim(); + this.$emit("input", msg); } }, immediate: true @@ -43,21 +59,29 @@ }, methods: { //鐢ㄦ埛涓诲姩鍙戦�� - handleSend () { - this.$emit('submit', this.currentMsg); + handleSend() { + this.$emit("submit", this.currentMsg); this.$nextTick(() => { - this.currentMsg = '' - }) + this.currentMsg = ""; + }); } - }, -} + } +}; </script> <style scoped> .web__msg { - padding: 0 10px; + padding-left: 36px; + padding-right: 22px; height: auto; overflow: hidden; - padding-top: 10px; + height: 100%; + display: flex; +} +.web_flex_input { + flex: 1; +} +.web_flex_button { + margin-left: 16px; } .web__msg--img, .web__msg--video, @@ -120,7 +144,6 @@ font-size: 20px; line-height: 17px; -webkit-appearance: none; - } .web__msg-menu { text-align: right; @@ -131,4 +154,18 @@ cursor: pointer; text-align: center; } -</style> \ No newline at end of file +/deep/.el-input__inner { + background-color: #fff; + border: 1px solid #000000; + background-color: #555555; + box-sizing: border-box; + color: #F2F2F2; + padding-top: 2px; + padding-bottom: 5px; + font-family: "寰蒋闆呴粦", sans-serif; +} +/deep/.el-button--primary { + background-color: #8400ff; + border-color: #8400ff; +} +</style> -- Gitblit v1.9.3