From 21d0d6201526f59d77a882cf4433fbc619bb525f Mon Sep 17 00:00:00 2001
From: LockingReal <1191515088@qq.com>
Date: Sat, 12 Nov 2022 22:51:47 +0800
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F:=20=E2=99=BB=EF=B8=8F:=20?=
 =?UTF-8?q?=E2=99=BB=EF=B8=8F:=20=E9=87=8D=E6=9E=84upload=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E8=B7=9F=E9=9A=8Fform=E7=BB=84=E4=BB=B6=E6=8F=90?=
 =?UTF-8?q?=E4=BA=A4,=E8=A1=A5=E5=85=85=E5=9C=A8=E6=96=87=E6=A1=A3?=
 =?UTF-8?q?=E7=9A=84=E7=A4=BA=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/src/component/upload/index.vue  | 39 +++++++++++++++++--
 .../src/document/zh-CN/components/form.md     |  6 ++-
 2 files changed, 41 insertions(+), 4 deletions(-)

diff --git a/package/component/src/component/upload/index.vue b/package/component/src/component/upload/index.vue
index 320a2dc9..7085fc65 100644
--- a/package/component/src/component/upload/index.vue
+++ b/package/component/src/component/upload/index.vue
@@ -17,6 +17,7 @@ import {
   ref,
   useSlots,
   withDefaults,
+  watch,
 } from "vue";
 import { templateRef } from "@vueuse/core";
 import { LayLayer } from "@layui/layer-vue";
@@ -70,6 +71,7 @@ export interface UploadProps {
   cutOptions?: CutOptions;
   text?: string;
   dragText?: string;
+  modelValue?: any;
 }
 
 const getCutDownResult = () => {
@@ -83,6 +85,11 @@ const getCutDownResult = () => {
       Object.assign({ currentTimeStamp, cutResult: imgData, orginal: orgInfo })
     );
     let newFile = dataURLtoFile(imgData);
+    if (isInFormItem.value) {
+      emit("update:modelValue", [newFile]);
+      clearLightCutEffect();
+      return;
+    }
     commonUploadTransaction([newFile]);
     nextTick(() => clearAllCutEffect());
   } else {
@@ -104,6 +111,13 @@ const clearAllCutEffect = () => {
   _cropper = null;
 };
 
+const clearLightCutEffect = () => {
+  activeUploadFiles.value = [];
+  activeUploadFilesImgs.value = [];
+  innerCutVisible.value = false;
+  _cropper = null;
+};
+
 const { t } = useI18n();
 const text = computed(() => {
   return props.text ? props.text : t("upload.text");
@@ -148,6 +162,7 @@ const props = withDefaults(defineProps<UploadProps>(), {
   disabledPreview: false,
   cut: false,
   cutOptions: void 0,
+  modelValue: null,
 });
 
 const slot = useSlots();
@@ -160,8 +175,21 @@ const emit = defineEmits([
   "error",
   "cutdone",
   "cutcancel",
+  "update:modelValue",
 ]);
 
+const isInFormItem = computed(() => context?.parent?.type.name === 'LayFormItem');
+
+watch(
+  () => props.modelValue,
+  () => {
+    if (!props.modelValue) {
+      clearAllCutEffect();
+    }
+  }
+);
+
+
 const isDragEnter = ref(false);
 const activeUploadFiles = ref<any[]>([]);
 const activeUploadFilesImgs = ref<any[]>([]);
@@ -219,7 +247,7 @@ const localUploadTransaction = (option: localUploadTransaction) => {
 
 const dataURLtoFile = (dataurl: string) => {
   let arr: any[] = dataurl.split(",");
-  let mime: string = "";
+  let mime = "";
   if (arr.length > 0) {
     mime = arr[0].match(/:(.*?);/)[1];
   }
@@ -323,12 +351,13 @@ const uploadChange = (e: any) => {
   }
   let arm1 =
     props.cut &&
-    props.acceptMime.indexOf("image") != -1 &&
+    (props.acceptMime.indexOf("image") != -1 || isInFormItem.value) &&
     props.multiple == false;
   let arm2 =
     props.cut &&
-    props.acceptMime.indexOf("image") != -1 &&
+    (props.acceptMime.indexOf("image") != -1 || isInFormItem.value) &&
     props.multiple == true;
+  
   if (arm1) {
     innerCutVisible.value = true;
     setTimeout(() => {
@@ -347,6 +376,10 @@ const uploadChange = (e: any) => {
     if (arm2) {
       console.warn(cannotSupportCutMsg.value);
     }
+    if (isInFormItem.value) {
+      emit("update:modelValue", _files);
+      return;
+    }
     commonUploadTransaction(_files);
   }
 };
diff --git a/package/document-component/src/document/zh-CN/components/form.md b/package/document-component/src/document/zh-CN/components/form.md
index d7b76983..42f14407 100644
--- a/package/document-component/src/document/zh-CN/components/form.md
+++ b/package/document-component/src/document/zh-CN/components/form.md
@@ -173,6 +173,9 @@ export default {
     <lay-form-item label="描述" prop="desc">
       <lay-textarea placeholder="请输入描述" v-model="validateModel.desc"></lay-textarea>
     </lay-form-item>
+    <lay-form-item label="文件" prop="file">
+      <lay-upload v-model="validateModel.file" :cut="true"/>
+    </lay-form-item>
     <lay-form-item>
       <lay-button @click="validate">提交</lay-button>
       <lay-button @click="clearValidate">清除校验</lay-button>
@@ -192,7 +195,8 @@ export default {
         username: "",
         password: "",
         specialty: "1",
-        hobbys: ""
+        hobbys: "",
+        file: null,
     })
 
     const layFormRef = ref(null);