mirror of
https://gitee.com/hhyykk/ipms-sjy-ui.git
synced 2025-07-14 02:45:06 +08:00
Merge branch 'dev-crm' of https://gitee.com/puhui999/yudao-ui-admin-vue3 into dev
# Conflicts: # src/views/bpm/definition/index.vue # src/views/bpm/model/index.vue # src/views/bpm/processInstance/create/index.vue # src/views/crm/statistics/customer/index.vue
This commit is contained in:
3
src/components/FormCreate/index.ts
Normal file
3
src/components/FormCreate/index.ts
Normal file
@ -0,0 +1,3 @@
|
||||
import MyFormCreate from './src/MyFormCreate.vue'
|
||||
|
||||
export { MyFormCreate }
|
54
src/components/FormCreate/src/MyFormCreate.vue
Normal file
54
src/components/FormCreate/src/MyFormCreate.vue
Normal file
@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<form-create v-bind="attrs">
|
||||
<!-- 保障 form-create 的原始插槽 -->
|
||||
<template v-for="(_, name) in slots" #[name]="slotData">
|
||||
<slot :name="name" v-bind="slotData || {}"></slot>
|
||||
</template>
|
||||
<!-- 使用项目重新封装的文件上传组件实现文件上载 -->
|
||||
<template #type-upload="scope">
|
||||
<!-- {{ logC(scope) }}-->
|
||||
<template v-if="scope.prop.props.uploadType === 'file'">
|
||||
<!-- TODO puhui999: 考虑是否使用属性透传直接把整个 scope.prop.props 传递给组件 -->
|
||||
<UploadFile
|
||||
:disabled="scope.prop.props.disabled"
|
||||
:limit="scope.prop.props.limit"
|
||||
:modelValue="scope.model.value || scope.prop.value"
|
||||
@update:modelValue="(val) => setValue(scope, val)"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="scope.prop.props.uploadType === 'image' && scope.prop.props.limit === 1">
|
||||
<UploadImg
|
||||
:disabled="scope.prop.props.disabled"
|
||||
:modelValue="scope.model.value || scope.prop.value"
|
||||
@update:modelValue="(val) => setValue(scope, val)"
|
||||
/>
|
||||
</template>
|
||||
<template v-if="scope.prop.props.uploadType === 'image' && scope.prop.props.limit > 1">
|
||||
<UploadImgs
|
||||
:disabled="scope.prop.props.disabled"
|
||||
:limit="scope.prop.props.limit"
|
||||
:modelValue="scope.model.value || scope.prop.value"
|
||||
@update:modelValue="(val) => setValue(scope, val)"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</form-create>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
defineOptions({ name: 'MyFormCreate' })
|
||||
const attrs = useAttrs()
|
||||
const slots = useSlots()
|
||||
|
||||
// 测试使用,查看组件 scope 值
|
||||
// const logC = (s) => {
|
||||
// console.log(s)
|
||||
// }
|
||||
|
||||
// 设置表单值
|
||||
const setValue = (scope: any, value: any) => {
|
||||
const obj = {}
|
||||
obj[scope.prop.field] = value
|
||||
scope.api.setValue(obj)
|
||||
}
|
||||
</script>
|
@ -6,7 +6,9 @@
|
||||
:action="uploadUrl"
|
||||
:auto-upload="autoUpload"
|
||||
:before-upload="beforeUpload"
|
||||
:disabled="disabled"
|
||||
:drag="drag"
|
||||
:http-request="httpRequest"
|
||||
:limit="props.limit"
|
||||
:multiple="props.limit > 1"
|
||||
:on-error="excelUploadError"
|
||||
@ -15,15 +17,14 @@
|
||||
:on-remove="handleRemove"
|
||||
:on-success="handleFileSuccess"
|
||||
:show-file-list="true"
|
||||
:http-request="httpRequest"
|
||||
class="upload-file-uploader"
|
||||
name="file"
|
||||
>
|
||||
<el-button type="primary">
|
||||
<el-button v-if="!disabled" type="primary">
|
||||
<Icon icon="ep:upload-filled" />
|
||||
选取文件
|
||||
</el-button>
|
||||
<template v-if="isShowTip" #tip>
|
||||
<template v-if="isShowTip && !disabled" #tip>
|
||||
<div style="font-size: 8px">
|
||||
大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
|
||||
</div>
|
||||
@ -54,7 +55,8 @@ const props = defineProps({
|
||||
limit: propTypes.number.def(5), // 数量限制
|
||||
autoUpload: propTypes.bool.def(true), // 自动上传
|
||||
drag: propTypes.bool.def(false), // 拖拽上传
|
||||
isShowTip: propTypes.bool.def(true) // 是否显示提示
|
||||
isShowTip: propTypes.bool.def(true), // 是否显示提示
|
||||
disabled: propTypes.bool.def(false) // 是否禁用上传组件 ==> 非必传(默认为 false)
|
||||
})
|
||||
|
||||
// ========== 上传相关 ==========
|
||||
|
@ -6,17 +6,18 @@
|
||||
:action="uploadUrl"
|
||||
:before-upload="beforeUpload"
|
||||
:class="['upload', drag ? 'no-border' : '']"
|
||||
:disabled="disabled"
|
||||
:drag="drag"
|
||||
:http-request="httpRequest"
|
||||
:multiple="false"
|
||||
:on-error="uploadError"
|
||||
:on-success="uploadSuccess"
|
||||
:show-file-list="false"
|
||||
:http-request="httpRequest"
|
||||
>
|
||||
<template v-if="modelValue">
|
||||
<img :src="modelValue" class="upload-image" />
|
||||
<div class="upload-handle" @click.stop>
|
||||
<div class="handle-icon" @click="editImg" v-if="!disabled">
|
||||
<div v-if="!disabled" class="handle-icon" @click="editImg">
|
||||
<Icon icon="ep:edit" />
|
||||
<span v-if="showBtnText">{{ t('action.edit') }}</span>
|
||||
</div>
|
||||
@ -77,10 +78,8 @@ const props = defineProps({
|
||||
height: propTypes.string.def('150px'), // 组件高度 ==> 非必传(默认为 150px)
|
||||
width: propTypes.string.def('150px'), // 组件宽度 ==> 非必传(默认为 150px)
|
||||
borderradius: propTypes.string.def('8px'), // 组件边框圆角 ==> 非必传(默认为 8px)
|
||||
// 是否显示删除按钮
|
||||
showDelete: propTypes.bool.def(true),
|
||||
// 是否显示按钮文字
|
||||
showBtnText: propTypes.bool.def(true)
|
||||
showDelete: propTypes.bool.def(true), // 是否显示删除按钮
|
||||
showBtnText: propTypes.bool.def(true) // 是否显示按钮文字
|
||||
})
|
||||
const { t } = useI18n() // 国际化
|
||||
const message = useMessage() // 消息弹窗
|
||||
|
@ -6,13 +6,14 @@
|
||||
:action="uploadUrl"
|
||||
:before-upload="beforeUpload"
|
||||
:class="['upload', drag ? 'no-border' : '']"
|
||||
:disabled="disabled"
|
||||
:drag="drag"
|
||||
:http-request="httpRequest"
|
||||
:limit="limit"
|
||||
:multiple="true"
|
||||
:on-error="uploadError"
|
||||
:on-exceed="handleExceed"
|
||||
:on-success="uploadSuccess"
|
||||
:http-request="httpRequest"
|
||||
list-type="picture-card"
|
||||
>
|
||||
<div class="upload-empty">
|
||||
|
Reference in New Issue
Block a user