zianxin/biz-pc-cloud-zax
1
0 Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

增加多个图片上传组件

Browse Source
This commit is contained in:
ctw committed 2024-12-24 17:03:23 +08:00
1 parent 56673efb64
commit 1c32f3a632
7 files changed
+484 -195
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.env
+1 -1
View File
@@ -14,7 +14,7 @@ VITE_PUBLIC_PATH = /
VITE_API_URL = /api
# ADMIN 服务地址
VITE_ADMIN_PROXY_PATH = http://localhost:9999
VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/
# 前端加密密钥
VITE_PWD_ENC_KEY='pigxpigxpigxpigx'
.env.development
+1 -1
View File
@@ -8,7 +8,7 @@ VITE_OPEN = true
ENV = 'development'
# ADMIN 服务地址
VITE_ADMIN_PROXY_PATH = http://localhost:9999
VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/
# 代码生成服务地址
VITE_GEN_PROXY_PATH = http://localhost:5003
src/components/Upload/Image.vue
+4 -4
View File
@@ -71,8 +71,8 @@ interface UploadFileProps {
width?: string; // 组件宽度 ==> 非必传（默认为 150px）
borderRadius?: string; // 组件边框圆角 ==> 非必传（默认为 8px）
iconSize?: number;
dir?: string; // 文件目录
listType:string;
dir?: string; // 文件目录
listType: string;
}
// 接受父组件参数
@@ -86,8 +86,8 @@ const props = withDefaults(defineProps<UploadFileProps>(), {
height: '150px',
width: '150px',
borderRadius: '8px',
dir: '',
listType:''
dir: '',
listType: '',
});
// 生成组件唯一id
src/components/Upload/Images.vue
+296
View File
@@ -0,0 +1,296 @@
<template>
<div class="upload-box">
<el-upload
ref="elUploadRef"
list-type="picture-card"
:class="['upload', self_disabled ? 'disabled' : '', drag ? 'no-border' : '']"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="uploadSuccess"
:before-upload="beforeUpload"
:on-error="uploadError"
:http-request="handleHttpUpload"
multiple
:drag="drag"
:disabled="self_disabled"
:accept="fileType.join(',')"
>
<div class="upload-empty">
<slot name="empty">
<el-icon><Plus /></el-icon>
<!-- <span>请上传图片</span> -->
</slot>
</div>
</el-upload>
<div class="el-upload__tip">
<slot name="tip"></slot>
</div>
<el-dialog v-model="dialogVisible">
<img w-full :src="dialogImageUrl" alt="Preview Image" />
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { ref, watch } from 'vue';
import { ElUpload, ElDialog, UploadRequestOptions, ElNotification, UploadFile, UploadProps, formContextKey } from 'element-plus';
import request from '/@/utils/request';
interface UploadFileProps {
imageUrls?: string; // 图片地址 ==> 必传
uploadFileUrl?: string; // 上传图片的 api 方法，一般项目上传都是同一个 api 方法，在组件里直接引入即可 ==> 非必传
drag?: boolean; // 是否支持拖拽上传 ==> 非必传（默认为 true）
disabled?: boolean; // 是否禁用上传组件 ==> 非必传（默认为 false）
fileSize?: number; // 图片大小限制 ==> 非必传（默认为 5M）
fileType?: string[]; // 图片类型限制 ==> 非必传（默认为 ["image/jpeg", "image/png", "image/gif"]）
height?: string; // 组件高度 ==> 非必传（默认为 150px）
width?: string; // 组件宽度 ==> 非必传（默认为 150px）
borderRadius?: string; // 组件边框圆角 ==> 非必传（默认为 8px）
}
const props = withDefaults(defineProps<UploadFileProps>(), {
imageUrls: '',
uploadFileUrl: '/admin/sys-file/upload',
drag: true,
disabled: false,
fileSize: 5,
fileType: () => ['image/jpeg', 'image/png', 'image/gif'],
height: '150px',
width: '150px',
borderRadius: '8px',
});
interface UploadEmits {
(e: 'update:imageUrls', value: string): void;
}
const emit = defineEmits<UploadEmits>();
const dialogImageUrl = ref('');
const dialogVisible = ref(false);
const elUploadRef = ref();
// 获取 el-form 组件上下文
const formContext = inject(formContextKey, void 0);
// 上传
const handleHttpUpload = async (options: UploadRequestOptions) => {
let formData = new FormData();
formData.append('file', options.file);
try {
const res = await request({
url: props.uploadFileUrl,
method: 'post',
headers: {
'Content-Type': 'multipart/form-data',
},
data: formData,
});
if (res.code == 0) {
return res;
}
} catch (error) {
options.onError(error as any);
}
};
// 移除
const handleRemove = (uploadFile: any, uploadFiles: any[]) => {
const urls = uploadFiles.map((item) => item.response.data.url).join(',');
emit('update:imageUrls', urls);
};
// 预览
const handlePictureCardPreview = (uploadFile: any) => {
dialogImageUrl.value = 'http://123.156.230.15:8089/api' + uploadFile.response.data.url;
dialogVisible.value = true;
};
// 判断是否禁用上传和删除
const self_disabled = computed(() => {
return props.disabled || formContext?.disabled;
});
watch(
() => props.imageUrls,
(newValue) => {
console.log(newValue);
if (!newValue) elUploadRef.value.clearFiles();
}
);
/**
* @description 文件上传之前判断
* @param rawFile 选择的文件
* */
const beforeUpload: UploadProps['beforeUpload'] = (rawFile) => {
const imgSize = rawFile.size / 1024 / 1024 < props.fileSize;
const imgType = props.fileType.includes(rawFile.type as File.ImageMimeType);
if (!imgType)
ElNotification({
title: '温馨提示',
message: '上传图片不符合所需的格式！',
type: 'warning',
});
if (!imgSize)
setTimeout(() => {
ElNotification({
title: '温馨提示',
message: `上传图片大小不能超过 ${props.fileSize}M！`,
type: 'warning',
});
}, 0);
return imgType && imgSize;
};
/**
* @description 图片上传成功
* */
const uploadSuccess = (response: any, uploadFile: UploadFile, uploadFiles: any) => {
const urls = uploadFiles.map((item: any) => item.response.data.url).join(',');
emit('update:imageUrls', urls);
ElNotification({
title: '温馨提示',
message: '图片上传成功！',
type: 'success',
});
};
/**
* @description 图片上传错误
* */
const uploadError = () => {
ElNotification({
title: '温馨提示',
message: '图片上传失败，请您重新上传！',
type: 'error',
});
};
</script>
<style scoped lang="scss">
.is-error {
.upload {
:deep(.el-upload),
:deep(.el-upload-dragger) {
border: 1px dashed var(--el-color-danger) !important;
&:hover {
border-color: var(--el-color-primary) !important;
}
}
}
}
:deep(.disabled) {
.el-upload,
.el-upload-dragger {
cursor: not-allowed !important;
background: var(--el-disabled-bg-color);
border: 1px dashed var(--el-border-color-darker) !important;
&:hover {
border: 1px dashed var(--el-border-color-darker) !important;
}
}
}
.upload-box {
overflow: hidden;
.no-border {
:deep(.el-upload) {
border: none !important;
}
}
:deep(.upload) {
.el-upload {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: v-bind(width);
height: v-bind(height);
overflow: hidden;
border: 1px dashed var(--el-border-color-darker);
border-radius: v-bind(borderRadius);
transition: var(--el-transition-duration-fast);
&:hover {
border-color: var(--el-color-primary);
.upload-handle {
opacity: 1;
}
}
.el-upload-dragger {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
padding: 0;
overflow: hidden;
background-color: transparent;
border: 1px dashed var(--el-border-color-darker);
border-radius: v-bind(borderRadius);
&:hover {
border: 1px dashed var(--el-color-primary);
}
}
.el-upload-dragger.is-dragover {
background-color: var(--el-color-primary-light-9);
border: 2px dashed var(--el-color-primary) !important;
}
.upload-image {
width: 100%;
height: 100%;
object-fit: contain;
}
.upload-empty {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 12px;
line-height: 30px;
color: var(--el-color-info);
.el-icon {
font-size: 28px;
color: var(--el-text-color-secondary);
}
}
.upload-handle {
position: absolute;
top: 0;
right: 0;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
cursor: pointer;
background: rgb(0 0 0 / 60%);
opacity: 0;
transition: var(--el-transition-duration-fast);
.handle-icon {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0 6%;
color: aliceblue;
.el-icon {
margin-bottom: 40%;
font-size: 130%;
line-height: 130%;
}
span {
font-size: 85%;
line-height: 85%;
}
}
}
}
}
.el-upload__tip {
line-height: 18px;
text-align: center;
}
}
</style>
src/components/index.ts
+33 -32
View File
@@ -4,6 +4,7 @@ import DictTag from '/@/components/DictTag/index.vue';
import UploadExcel from '/@/components/Upload/Excel.vue';
import UploadFile from '/@/components/Upload/index.vue';
import UploadImg from '/@/components/Upload/Image.vue';
import UploadImgs from '/@/components/Upload/Images.vue';
import DelWrap from '/@/components/DelWrap/index.vue';
import Editor from '/@/components/Editor/index.vue';
import Tip from '/@/components/Tip/index.vue';
@@ -12,12 +13,12 @@ import SvgIcon from '/@/components/SvgIcon/index.vue';
// 第三方组件
import ElementPlus from 'element-plus';
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import * as ElementPlusIconsVue from '@element-plus/icons-vue';
import 'element-plus/dist/index.css';
import {Pane, Splitpanes} from 'splitpanes';
import { Pane, Splitpanes } from 'splitpanes';
import 'splitpanes/dist/splitpanes.css';
// 日历组件
import {setupCalendar} from 'v-calendar';
import { setupCalendar } from 'v-calendar';
// @ts-ignore 引入VForm3库
import VForm3 from 'form-designer-plus'; //
import 'form-designer-plus/dist/designer.style.css'; //引入VForm3样式
@@ -25,36 +26,36 @@ import 'form-designer-plus/dist/designer.style.css'; //引入VForm3样式
import vue3TreeOrg from 'vue3-tree-org';
import 'vue3-tree-org/lib/vue3-tree-org.css';
// 导入声明
import {App} from "vue";
import { App } from 'vue';
export default {
install(app: App) {
app.component('DictTag', DictTag);
app.component('Pagination', Pagination);
app.component('RightToolbar', RightToolbar);
app.component('uploadExcel', UploadExcel);
app.component('UploadFile', UploadFile);
app.component('UploadImg', UploadImg);
app.component('Editor', Editor);
app.component('Tip', Tip);
app.component('DelWrap', DelWrap);
app.component('TagList', TagList);
app.component('SvgIcon', SvgIcon);
install(app: App) {
app.component('DictTag', DictTag);
app.component('Pagination', Pagination);
app.component('RightToolbar', RightToolbar);
app.component('uploadExcel', UploadExcel);
app.component('UploadFile', UploadFile);
app.component('UploadImg', UploadImg);
app.component('UploadImgs', UploadImgs);
app.component('Editor', Editor);
app.component('Tip', Tip);
app.component('DelWrap', DelWrap);
app.component('TagList', TagList);
app.component('SvgIcon', SvgIcon);
// 导入全部的elmenet-plus的图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
// 兼容性
app.component(`ele-${key}`, component)
}
// 导入布局插件
app.component('Splitpanes', Splitpanes);
app.component('Pane', Pane);
app.use(ElementPlus) // ELEMENT 组件
app.use(setupCalendar, {}) // 日历组件
app.use(VForm3) // 表单设计
app.use(vue3TreeOrg) // 组织架构组件
}
}
// 导入全部的elmenet-plus的图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component);
// 兼容性
app.component(`ele-${key}`, component);
}
// 导入布局插件
app.component('Splitpanes', Splitpanes);
app.component('Pane', Pane);
app.use(ElementPlus); // ELEMENT 组件
app.use(setupCalendar, {}); // 日历组件
app.use(VForm3); // 表单设计
app.use(vue3TreeOrg); // 组织架构组件
},
};
src/views/canteen/canteenSpu/form.vue
+148 -156
View File
@@ -1,184 +1,176 @@
<template>
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
:close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="商品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入商品名称"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品分类" prop="categoryId">
<el-select v-model="form.categoryId" placeholder="请选择商品分类">
<el-option
placeholder="请选择商品分类"
v-for="item in categoryList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
<!-- <el-option v-for="categoryList" :key="item.value" :label="item.label"-->
<!-- :value="item.value"></el-option>-->
</el-select>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品封面图" prop="picUrl">
<upload-img v-model:imageUrl="form.picUrl"></upload-img>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品简介" prop="introduction">
<el-input type="textarea" v-model="form.introduction" placeholder="请输入商品简介"/>
</el-form-item>
</el-col>
<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
<el-row :gutter="24">
<el-col :span="12" class="mb20">
<el-form-item label="商品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入商品名称" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品分类" prop="categoryId">
<el-select v-model="form.categoryId" placeholder="请选择商品分类">
<el-option placeholder="请选择商品分类" v-for="item in categoryList" :key="item.id" :label="item.name" :value="item.id"> </el-option>
<!-- <el-option v-for="categoryList" :key="item.value" :label="item.label"-->
<!-- :value="item.value"></el-option>-->
</el-select>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品封面图" prop="picUrl">
<upload-img v-model:imageUrl="form.picUrl"></upload-img>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品简介" prop="introduction">
<el-input type="textarea" v-model="form.introduction" placeholder="请输入商品简介" />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品轮播图" prop="sliderPicUrls">
<upload-imgs v-model:imageUrls="form.sliderPicUrls"></upload-imgs>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品轮播图" prop="sliderPicUrls">
<upload-img listType="picture-card" v-model:imageUrl="form.sliderPicUrls"></upload-img>
<!-- <upload-file v-model:imageUrl="form.sliderPicUrls"></upload-file>-->
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入排序" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入排序"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }} </el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品价格" prop="price">
<el-input v-model="form.price" placeholder="请输入商品价格" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品价格" prop="price">
<el-input v-model="form.price" placeholder="请输入商品价格"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="市场价" prop="marketPrice">
<el-input v-model="form.marketPrice" placeholder="请输入市场价" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="市场价" prop="marketPrice">
<el-input v-model="form.marketPrice" placeholder="请输入市场价"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="库存" prop="stock">
<el-input v-model="form.stock" placeholder="请输入库存" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="库存" prop="stock">
<el-input v-model="form.stock" placeholder="请输入库存"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="赠送积分" prop="giveIntegral">
<el-input v-model="form.giveIntegral" placeholder="请输入赠送积分" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="赠送积分" prop="giveIntegral">
<el-input v-model="form.giveIntegral" placeholder="请输入赠送积分"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="虚拟销量" prop="virtualSalesCount">
<el-input v-model="form.virtualSalesCount" placeholder="请输入虚拟销量" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="虚拟销量" prop="virtualSalesCount">
<el-input v-model="form.virtualSalesCount" placeholder="请输入虚拟销量"/>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品详情" prop="description">
<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情"></editor>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品详情" prop="description">
<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情"></editor>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
</span>
</template>
</el-dialog>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts" name="CanteenSpuDialog">
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import { getObj, addObj, putObj } from '/@/api/canteen/canteenSpu'
import {getAllSimple} from "/@/api/canteen/canteenCategory";
import { useMessage } from '/@/hooks/message';
import { getObj, addObj, putObj } from '/@/api/canteen/canteenSpu';
import { getAllSimple } from '/@/api/canteen/canteenCategory';
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
// 定义变量内容
const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
const visible = ref(false);
const loading = ref(false);
// 定义字典
const { spu_status } = useDict('spu_status')
const { spu_status } = useDict('spu_status');
// 提交表单数据
const form = reactive({
id:'',
name: '',
introduction: '',
description: '',
categoryId: '',
picUrl: '',
sliderPicUrls: '',
sort: '',
status: '0',
price: '',
marketPrice: '',
costPrice: '',
stock: '',
giveIntegral: '',
salesCount: '',
virtualSalesCount: '',
browseCount: '',
merchantId: '',
deptId: '',
id: '',
name: '',
introduction: '',
description: '',
categoryId: '',
picUrl: '',
sliderPicUrls: '',
sort: '',
status: '0',
price: '',
marketPrice: '',
costPrice: '',
stock: '',
giveIntegral: '',
salesCount: '',
virtualSalesCount: '',
browseCount: '',
merchantId: '',
deptId: '',
});
// 定义校验规则
const dataRules = ref({
name: [{required: true, message: '商品名称不能为空', trigger: 'blur'}],
picUrl: [{required: true, message: '商品封面图不能为空', trigger: 'blur'}],
sort: [{ validator: rule.number, trigger: 'blur' }],
price: [{ validator: rule.number, trigger: 'blur' }],
marketPrice: [{ validator: rule.number, trigger: 'blur' }],
costPrice: [{ validator: rule.number, trigger: 'blur' }],
stock: [{ validator: rule.number, trigger: 'blur' }],
giveIntegral: [{ validator: rule.number, trigger: 'blur' }],
salesCount: [{ validator: rule.number, trigger: 'blur' }],
virtualSalesCount: [{ validator: rule.number, trigger: 'blur' }],
})
name: [{ required: true, message: '商品名称不能为空', trigger: 'blur' }],
picUrl: [{ required: true, message: '商品封面图不能为空', trigger: 'blur' }],
sort: [{ validator: rule.number, trigger: 'blur' }],
price: [{ validator: rule.number, trigger: 'blur' }],
marketPrice: [{ validator: rule.number, trigger: 'blur' }],
costPrice: [{ validator: rule.number, trigger: 'blur' }],
stock: [{ validator: rule.number, trigger: 'blur' }],
giveIntegral: [{ validator: rule.number, trigger: 'blur' }],
salesCount: [{ validator: rule.number, trigger: 'blur' }],
virtualSalesCount: [{ validator: rule.number, trigger: 'blur' }],
});
// 打开弹窗
const openDialog = (id: string) => {
visible.value = true
form.id = ''
visible.value = true;
form.id = '';
// 重置表单数据
// 重置表单数据
nextTick(() => {
dataFormRef.value?.resetFields();
});
// 获取canteenSpu信息
if (id) {
form.id = id
getcanteenSpuData(id)
}
// 获取canteenSpu信息
if (id) {
form.id = id;
getcanteenSpuData(id);
}
};
// 提交
const onSubmit = async () => {
console.log(form);
const valid = await dataFormRef.value.validate().catch(() => {});
if (!valid) return false;
try {
loading.value = true;
loading.value = true;
form.id ? await putObj(form) : await addObj(form);
useMessage().success(form.id ? '修改成功' : '添加成功');
visible.value = false;
@@ -186,32 +178,32 @@ const onSubmit = async () => {
} catch (err: any) {
useMessage().error(err.msg);
} finally {
loading.value = false;
}
loading.value = false;
}
};
// 初始化表单数据
const getcanteenSpuData = (id: string) => {
// 获取数据
loading.value = true
getObj(id).then((res: any) => {
Object.assign(form, res.data)
}).finally(() => {
loading.value = false
})
// 获取数据
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data);
})
.finally(() => {
loading.value = false;
});
};
const categoryList = ref([]) // 商品分类树
const categoryList = ref([]); // 商品分类树
onMounted(async () => {
const params={
systemType: 2
}
const data =await getAllSimple(params);
categoryList.value=data.data
})
const params = {
systemType: 2,
};
const data = await getAllSimple(params);
categoryList.value = data.data;
});
// 暴露变量
defineExpose({
openDialog
openDialog,
});
</script>
tsconfig.json
+1 -1
View File
@@ -69,6 +69,6 @@
"skipLibCheck": true /* Skip type checking of declaration files. */,
"forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
},
"include": ["src/**/*.ts", "src/**/*.vue", "src/**/*.tsx", "src/**/*.d.ts", "auto-imports.d.ts"], // **Represents any directory, and * represents any file. Indicates that all files in the src directory will be compiled
"include": ["src/**/*.ts", "src/**/*.vue", "src/**/*.tsx", "src/**/*.d.ts", "src/types/**/*.d.ts", "auto-imports.d.ts"], // **Represents any directory, and * represents any file. Indicates that all files in the src directory will be compiled
"exclude": ["node_modules", "dist"] // Indicates the file directory that does not need to be compiled
}