el-plus-crud 0.0.74 → 0.0.76

package/lib/components/el-plus-form/components/ElPlusFormUpbtn.vue

@@ -1,145 +1,146 @@
-<template>
-  <div class="el-button el-plus-form-up-btn">
-    <el-upload class="upload-demo" style="display: flex" v-bind="attrs" :disabled="isLoading || disabled" v-model="currentValue">
-      <el-button type="primary" :icon="Upload" :loading="isLoading"> {{ btnShowText }}</el-button>
-      <template #file>
-        <div></div>
-      </template>
-    </el-upload>
-  </div>
-</template>
-<script lang="ts">
-export default {
-  name: 'ElPlusFormUpbtn',
-  inheritAttrs: false,
-  typeName: 'upbtn',
-  customOptions: {}
-}
-</script>
-<script lang="ts" setup>
-import { ref, computed, onBeforeMount, useAttrs, watch } from 'vue'
-import { Upload } from '@element-plus/icons-vue'
-import { ElMessage, ElMessageBox, UploadRawFile } from 'element-plus'
-import { getAttrs } from '../mixins'
-import { IBtnBack } from 'types/formList'
-
-const props = defineProps<{
-  field?: string
-  rowIndex?: number
-  loading?: boolean
-  desc: { [key: string]: any }
-  formData?: { [key: string]: any }
-  disabled?: boolean
-}>()
-
-const isLoading = ref(!!props.loading)
-const currentValue = ref([] as any[])
-const attrs = ref({} as any)
-const isInit = ref(false)
-
-const uploadAttr = {
-  name: 'file',
-  showFileList: false,
-  listType: 'text',
-  accept: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel',
-  beforeUpload: async (file: UploadRawFile) => {
-    isLoading.value = true
-    let confirmText = props.desc?.confirm || ''
-    if (confirmText && typeof props.desc?.confirm === 'function') {
-      confirmText = props.desc.confirm()
-    }
-    if (confirmText) {
-      return new Promise((resolve) => {
-        ElMessageBox.confirm(confirmText, '提示', {
-          type: 'warning'
-        })
-          .then(() => resolve(true))
-          .catch(() => {
-            resolve(false)
-            isLoading.value = false
-          })
-      })
-    } else {
-      return handelBeforeUpload(file)
-    }
-  },
-  onError: () => {
-    ElMessage.error('文件上传出错，请检查文件格式及内容是否正确！')
-    isLoading.value = false
-  }
-}
-
-const btnShowText = computed(() => {
-  if (props.desc.btnLabel) {
-    if (typeof props.desc.btnLabel === 'function') {
-      return props.desc.btnLabel(props.formData)
-    }
-    return props.desc.btnLabel
-  }
-  if (props.desc.label) {
-    if (typeof props.desc.label === 'function') {
-      return props.desc.label(props.formData)
-    }
-    return props.desc.label
-  }
-  return ''
-})
-
-/**
- * 文件上传前的处理
- * @param file
- */
-function handelBeforeUpload(file: UploadRawFile) {
-  isLoading.value = true
-  const suffix = file.name.substring(file.name.lastIndexOf('.'))
-  // 校验文件类型
-  if ((props.desc.attrs.accept || ['.xlsx', '.xls']).indexOf(suffix) < 0) {
-    ElMessage.warning(`请上传后缀为${(props.desc.attrs.accept || ['.xlsx', '.xls']).join(',')}格式的文件!`)
-    isLoading.value = false
-    return false
-  }
-  // 校验文件大小
-  if (file.size > 20 * 1024 * 1024) {
-    ElMessage.warning('超出文件大小限制(最大为20M)!')
-    isLoading.value = false
-    return false
-  }
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve(true)
-    }, 1000)
-  })
-}
-
-watch(
-  () => props.loading,
-  (data) => {
-    isLoading.value = data
-  },
-  { immediate: true }
-)
-
-onBeforeMount(async () => {
-  attrs.value = await getAttrs(props, { ...uploadAttr, ...useAttrs() })
-  attrs.value.onSuccess = (response: any) => {
-    if (props.desc?.on?.success) {
-      props.desc.on.success({
-        row: response,
-        callBack: () => {
-          setTimeout(() => (isLoading.value = false), 500)
-        },
-        field: props.field,
-        rowIndex: props.rowIndex
-      } as IBtnBack)
-    }
-  }
-  isInit.value = true
-})
-</script>
-<style lang="scss" scoped>
-.el-plus-form-up-btn {
-  display: flex;
-  flex-direction: column;
-  padding: 0;
-}
-</style>
+<template>
+  <div class="el-button el-plus-form-up-btn">
+    <el-upload class="upload-demo" style="display: flex" v-bind="attrs" :disabled="isLoading || disabled" v-model="currentValue">
+      <el-button type="primary" :icon="Upload" :loading="isLoading"> {{ btnShowText }}</el-button>
+      <template #file>
+        <div></div>
+      </template>
+    </el-upload>
+  </div>
+</template>
+<script lang="ts">
+export default {
+  name: 'ElPlusFormUpbtn',
+  inheritAttrs: false,
+  typeName: 'upbtn',
+  customOptions: {}
+}
+</script>
+<script lang="ts" setup>
+import { ref, computed, onBeforeMount, useAttrs, watch } from 'vue'
+import { Upload } from '@element-plus/icons-vue'
+import { ElMessage, ElMessageBox, UploadRawFile } from 'element-plus'
+import { getAttrs } from '../mixins'
+import { IBtnBack } from 'types'
+
+const props = defineProps<{
+  field?: string
+  rowIndex?: number
+  loading?: boolean
+  desc: { [key: string]: any }
+  formData?: { [key: string]: any }
+  disabled?: boolean
+}>()
+
+const isLoading = ref(!!props.loading)
+const currentValue = ref([] as any[])
+const attrs = ref({} as any)
+const isInit = ref(false)
+
+const uploadAttr = {
+  name: 'file',
+  showFileList: false,
+  listType: 'text',
+  accept: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel',
+  beforeUpload: async (file: UploadRawFile) => {
+    isLoading.value = true
+    let confirmText = props.desc?.confirm || ''
+    if (confirmText && typeof props.desc?.confirm === 'function') {
+      confirmText = props.desc.confirm()
+    }
+    if (confirmText) {
+      return new Promise((resolve) => {
+        ElMessageBox.confirm(confirmText, '提示', {
+          type: 'warning'
+        })
+          .then(() => resolve(true))
+          .catch(() => {
+            resolve(false)
+            isLoading.value = false
+          })
+      })
+    } else {
+      return handelBeforeUpload(file)
+    }
+  },
+  onError: () => {
+    ElMessage.error('文件上传出错，请检查文件格式及内容是否正确！')
+    isLoading.value = false
+  }
+}
+
+const btnShowText = computed(() => {
+  if (props.desc.btnLabel) {
+    if (typeof props.desc.btnLabel === 'function') {
+      return props.desc.btnLabel(props.formData)
+    }
+    return props.desc.btnLabel
+  }
+  if (props.desc.label) {
+    if (typeof props.desc.label === 'function') {
+      return props.desc.label(props.formData)
+    }
+    return props.desc.label
+  }
+  return ''
+})
+
+/**
+ * 文件上传前的处理
+ * @param file
+ */
+function handelBeforeUpload(file: UploadRawFile) {
+  isLoading.value = true
+  const suffix = file.name.substring(file.name.lastIndexOf('.'))
+  // 校验文件类型
+  if ((props.desc.attrs.accept || ['.xlsx', '.xls']).indexOf(suffix) < 0) {
+    ElMessage.warning(`请上传后缀为${(props.desc.attrs.accept || ['.xlsx', '.xls']).join(',')}格式的文件!`)
+    isLoading.value = false
+    return false
+  }
+  // 校验文件大小
+  if (file.size > 20 * 1024 * 1024) {
+    ElMessage.warning('超出文件大小限制(最大为20M)!')
+    isLoading.value = false
+    return false
+  }
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(true)
+    }, 1000)
+  })
+}
+
+watch(
+  () => props.loading,
+  (data) => {
+    isLoading.value = data
+  },
+  { immediate: true }
+)
+
+onBeforeMount(async () => {
+  attrs.value = await getAttrs(props, { ...uploadAttr, ...useAttrs() })
+  attrs.value.onSuccess = (response: any) => {
+    if (props.desc?.on?.success) {
+      props.desc.on.success({
+        row: response,
+        callBack: () => {
+          setTimeout(() => (isLoading.value = false), 500)
+        },
+        field: props.field,
+        rowIndex: props.rowIndex
+      } as IBtnBack)
+    }
+  }
+  isInit.value = true
+})
+</script>
+<style lang="scss" scoped>
+.el-plus-form-up-btn {
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+}
+</style>
+types