1

src/components/common/fileUpload.vue

+<template>
+  <div>
+    <template v-if="!data.isShowEdit">
+      <q-input filled bg-color="myInput" @focus="data.isShowEdit=true" label="请输入跟进记录" />
+    </template>
+    <template v-else>
+      <div class="editer_input">
+        <q-input v-model="text" style="50px" maxlength="1000" type="textarea" placeholder="请填写跟进记录" />
+        <!-- <div></div> -->
+        <div class="file_Space">
+          <div style="display:flex;align-items:center;">
+            <div>
+                <a-upload v-model:file-list="data.imageList" name="file" :multiple="true"
+                action="https://www.mocky.io/v2/5cc8019d300000980a055e76" @change="handleChange">
+                <i style="font-size:25px;cursor:pointer;" class="iconfont icon-picture"></i>
+                </a-upload>
+            </div>
+            <div style="margin-left:8px;">
+                <a-upload v-model:file-list="data.fileList" name="file" :multiple="true"
+                action="https://www.mocky.io/v2/5cc8019d300000980a055e76" @change="handleChange">
+                <i style="font-size:20px;cursor:pointer;" class="iconfont icon-paperclip"></i>
+                </a-upload>
+            </div>
+          </div>
+          <div>
+            <q-btn color="myInput" text-color="#000" size="sm" @click="data.isShowEdit=false" label="取消" />
+            <q-btn color="primary" style="margin-left:10px;" size="sm" label="确定" />
+          </div>
+        </div>
+      </div>
+    </template>
+  </div>
+</template>
+<script lang="ts">
+  import {
+    ref,
+    reactive,
+    onMounted
+  } from 'vue'
+  import message from '@/utils/message'
+  import customer2 from '@/api/customer2'
+  export default {
+    setup(props, ctx) {
+      interface dataParam {
+        [key: string]: any
+      }
+      const data = reactive < dataParam > ({
+        isShowEdit: false,
+        fileList: [],
+        imageList: []
+      })
+      onMounted(() => {
+
+      })
+      return {
+        data
+      }
+    }
+  }
+
+</script>
+<style lang="scss">
+  .editer_input {
+    padding: 5px 0;
+  }
+
+  .myInput {
+    background-color: #f6f6f6 !important;
+  }
+
+  .file_Space {
+    display: flex;
+    justify-content: space-between;
+    margin-top:10px;
+    align-items: center;
+  }
+  .q-field__control{
+    background-color: #f6f6f6!important;
+  }
+  .q-field--filled .q-field__control:hover:before{
+    opacity: 0;
+  }
+</style>