likeadmin 打开弹框、修改组件上传地址

打开弹框

index.vue

vue 复制代码
<template>
    <div>
        <el-card class="!border-none" shadow="never">
            <el-button v-perms="['resources.region/add']" type="primary" @click="handleAdd">
                <template #icon>
                    <icon name="el-icon-Plus" />
                </template>
                新增
            </el-button>
        </el-card>        
        <edit-popup
            v-if="showEdit"
            ref="editRef"
            @close="showEdit = false"
        />
    </div>
</template>

<script lang="ts" setup name="regionLists">
// 注意这里的EditPopup是edit-popup的名称,这里改了,上面弹框组件名称也要改
import EditPopup from './edit.vue'

const editRef = shallowRef<InstanceType<typeof EditPopup>>()
// 是否显示编辑框
const showEdit = ref(false)

// 添加
const handleAdd = async () => {
    showEdit.value = true
    await nextTick()
    editRef.value?.open()
}

</script>

edit.vue

vue 复制代码
<template>
    <div class="edit-popup">
        <popup
            ref="popupRef"
            title="测试"
            :async="true"
            width="550px"
        >
            123456
        </popup>
    </div>
</template>

<script lang="ts" setup name="regionEdit">

import Popup from '@/components/popup/index.vue'
const popupRef = shallowRef<InstanceType<typeof Popup>>()


//打开弹窗
const open = () => {
    popupRef.value?.open()
}

defineExpose({
    open
})
</script>

修改 upload 组件上传地址

组件文件路径:项目根目录\admin\src\components\upload\index.vue

修改组件下面两个地方

添加自定义上传过程中进度显示

show-progress 属性,显示上传进度,当上传Excel需要处理数据的时候,处理数据的时间似乎没有计算在内。会立马显示进度100%,然而后端并未处理完毕,会一直显示进度100%,给人BUG的感觉,还不如显示数据处理中...

修改方案:

组件文件路径:项目根目录\admin\src\components\upload\index.vue

然后父组件添加该方法: