完工配置页面输入

web/src/views/pc/renbao/order/service.vue

 <template>
 <div class="about">
-	人保对接
+	<el-form ref="form" :model="form" label-width="80px">
+		<el-form-item label="活动名称">
+			<el-upload
+				class="avatar-uploader"
+				action="https://jsonplaceholder.typicode.com/posts/"
+				:show-file-list="false"
+				:on-success="handleAvatarSuccess"
+				:before-upload="beforeAvatarUpload">
+				<img v-if="imageUrl" :src="imageUrl" class="avatar">
+				<i v-else class="el-icon-plus avatar-uploader-icon"></i>
+			</el-upload>
+		</el-form-item>
+	</el-form>
 </div>
 </template>
 <script>
@@ -19,6 +31,9 @@ export default {
     },
     data() {
         return {
+            form: {},
+            imageUrl: '',
+
             loading: true,
             orderId: '',
             currentIndex: 0,
@@ -76,6 +91,21 @@ export default {
 
     },
     methods: {
+        handleAvatarSuccess(res, file) {
+            this.imageUrl = URL.createObjectURL(file.raw)
+        },
+        beforeAvatarUpload(file) {
+            const isJPG = file.type === 'image/jpeg'
+            const isLt2M = file.size / 1024 / 1024 < 2
+
+            if (!isJPG) {
+                this.$message.error('上传头像图片只能是 JPG 格式!')
+            }
+            if (!isLt2M) {
+                this.$message.error('上传头像图片大小不能超过 2MB!')
+            }
+            return isJPG && isLt2M
+        },
         foodPageScorll() {
             const foodWrapper = document.getElementsByClassName(
                 'foods-wrapper'
@@ -212,6 +242,33 @@ export default {
 </script>
 <style lang="less" scoped>
 @import '~@/assets/css/func.less';
+.avatar-uploader{
+    /deep/ .el-upload{
+        border: 1px dashed #d9d9d9;
+        border-radius: 6px;
+        cursor: pointer;
+        position: relative;
+        overflow: hidden;
+        &:hover{
+            border-color: #409EFF;
+        }
+    }
+
+  .avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 178px;
+    height: 178px;
+    line-height: 178px;
+    text-align: center;
+  }
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+}
+
 .mint-header{background-color:#3675c1;}
  .goods{
         display:flex;