提交

src/view/mmg/index.vue

@@ -1,10 +1,17 @@
 <template>
   <div class="mmg">
     <div class="input-with-select">
-      <el-input  size="large" v-model="input2" style="width: 100%" placeholder="请输入关键字">
-        <template #append><div @click="submit">提交</div></template>
+      <el-input
+        size="large"
+        v-model="input2"
+        type="textarea"
+        style="width: 100%"
+        placeholder="请输入关键字"
+        :autosize="{ minRows: 4, maxRows: 8 }"
+      >
       </el-input>
     </div>
+    <el-button :loading="load" type="primary" @click="submit" class="append">提交</el-button>
   </div>
 </template>
 <script setup>
@@ -18,18 +25,27 @@
  */
 import { submitworld } from '@/api/2023';
 import { ref } from 'vue';
-import { ElInput, ElMessage } from 'element-plus';
-import "element-plus/theme-chalk/base.css";
+import { ElInput, ElMessage, ElButton } from 'element-plus';
+import 'element-plus/theme-chalk/base.css';
+import 'element-plus/theme-chalk/el-button.css';
 import 'element-plus/theme-chalk/el-input.css';
 import 'element-plus/theme-chalk/el-message.css';
 
 const input2 = ref('');
+const load = ref(false);
 const submit = () => {
-    if(!input2.value) return ElMessage('请输入关键词')
-  const T = input2.value.replace(/\s+/g, '\n');
-  submitworld({ words: T }).then(r => {
-    ElMessage(r)
-  });
+  if (!input2.value) return ElMessage('请输入关键词');
+  load.value = true;
+  submitworld({ words: input2.value })
+    .then(r => {
+      ElMessage(r);
+      input2.value = "";
+      load.value = false;
+    })
+    .catch(e => {
+      ElMessage(e);
+      load.value = false;
+    });
 };
 </script>
 <style lang="scss">
@@ -38,17 +54,19 @@ const submit = () => {
   height: 100vh;
   padding-top: 30vh;
 
-  .input-with-select {
+  .input-with-select,
+  .append {
     width: 60%;
     margin: 0 auto;
     display: block;
     overflow: hidden;
   }
 
-  .el-input-group__append {
+  .append {
     background-color: #0078d4;
     color: #fff;
     cursor: pointer;
+    margin-top: 3vh;
   }
 }
 </style>