bonus
/
Zlpt_Portal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

个人中心装备列表

This commit is contained in:
zzyuan 2024-11-27 10:06:24 +08:00
parent aa10058a5a
commit d9f198a400
3 changed files with 253 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
auto-imports.d.ts vendored
View File

@ -82,6 +82,6 @@ declare global {
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
import('vue')
}

15
components.d.ts vendored
View File

@ -8,11 +8,17 @@ export {}
declare module 'vue' {
export interface GlobalComponents {
Breadcrumb: typeof import('./src/components/Breadcrumb/index.vue')['default']
ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
ElButton: typeof import('element-plus/es')['ElButton']
ElCarousel: typeof import('element-plus/es')['ElCarousel']
ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDialog: typeof import('element-plus/es')['ElDialog']
ElForm: typeof import('element-plus/es')['ElForm']
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon']
@ -20,8 +26,17 @@ declare module 'vue' {
ElInput: typeof import('element-plus/es')['ElInput']
ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElProgress: typeof import('element-plus/es')['ElProgress']
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
ElTag: typeof import('element-plus/es')['ElTag']
ElUpload: typeof import('element-plus/es')['ElUpload']
EquipCard: typeof import('./src/components/equipCard.vue')['default']
EquipCardHall: typeof import('./src/components/equipCardHall/index.vue')['default']
EquipCardNew: typeof import('./src/components/equipCardNew/index.vue')['default']

246
src/views/user/goodsManagement/index.vue
View File

@ -9,6 +9,7 @@
import { useStore } from 'store/user'
const store = useStore()
import { mainStore } from 'store/main'
const store2 = mainStore()
import {
getEquipmentListApi,getEquipmentTypeApi,getCompanyListApi
} from 'http/api/usercenter/goodsmang'
@ -153,11 +154,11 @@
person: '',
personPhone: '',
deviceWeight: '',
})
})
//编码类型禁止修改数目
const countDisabled = ref(false)
const dialogTypeCascader = ref()
const countDisabled = ref(false)
//装备类目-change
const dialogTypeCascader = ref()
const dialogTypeChange = () => {
const deviceTypeList = dialogTypeCascader.value.getCheckedNodes()
console.log(deviceTypeList)
@ -170,8 +171,8 @@
equipmentDeploymentParams.value.deviceCount=1
countDisabled.value=true
}
}
//获取下拉数据
}
//获取所属公司下拉数据
const getCompanyList = async () => {
const res: any = await getCompanyListApi()
console.log(res, '列表数据**--**')
@ -545,6 +546,125 @@
})
}
const mainFileList: any = ref([])//主展示
const detailsFileList: any = ref([])//详情展示
const insurancePdf: any = ref([])//合格证
const examinationPdf: any = ref([])//检测证明
//图片查看弹窗
const dialogVisible: any = ref(false)
const dialogImageUrl = ref('')
//上传
const upload: any = ref({
// 设置上传的请求头部
headers: { Authorization: "Bearer " + store2.token },
// 上传的地址
url: import.meta.env.VITE_API_URL + "/file/upload",
})
// 文件上传前处理-上传大小
const beforeUpload = (file: any) => {
if (file.size / 1024 / 1024 > 2) {
ElMessage({
type: 'error',
message: '上传文件大小不能超过2M!'
})
// this.$message.error({ message: `上传文件大小不能超过2M!`,});
return false;
}
}
// 文件上传失败
const uploadError = () => {
ElMessage({
type: 'error',
message: '上传文件失败!'
})
// this.$message.error({message: `上传文件失败!`});
}
// 文件上传成功处理
const handleFileSuccess = (response: any) => {
if (response.code == 200) {
let obj = {
// modelId:this.maId,
fileName: response.data.name.split("/")[4],
fileUrl: response.data.url
};
console.log(obj);
mainFileList.value.push(obj)
ElMessage({
type: 'success',
message: '上传成功！'
})
console.log(mainFileList.value)
}
}
// 文件上传成功处理
const handleFileSuccess2 = (response: any) => {
if (response.code == 200) {
let obj = {
// modelId:this.maId,
fileName: response.data.name.split("/")[4],
fileUrl: response.data.url
};
console.log(obj);
detailsFileList.value.push(obj)
ElMessage({
type: 'success',
message: '上传成功！'
})
console.log(detailsFileList.value)
}
}
// 文件上传成功处理
const handleFileSuccess3 = (response: any) => {
if (response.code == 200) {
let obj = {
// modelId:this.maId,
fileName: response.data.name.split("/")[4],
fileUrl: response.data.url
};
console.log(obj);
insurancePdf.value.push(obj)
ElMessage({
type: 'success',
message: '上传成功！'
})
console.log(insurancePdf.value)
}
}
// 文件上传成功处理
const handleFileSuccess4 = (response: any) => {
if (response.code == 200) {
let obj = {
// modelId:this.maId,
fileName: response.data.name.split("/")[4],
fileUrl: response.data.url
};
console.log(obj);
examinationPdf.value.push(obj)
ElMessage({
type: 'success',
message: '上传成功！'
})
console.log(examinationPdf.value)
}
}
//文件下载
const handleDownload = (file: any) => {
const windowName = file.name;
window.open(file.fileUrl, windowName);
}
//文件查看
const picturePreview = (file: any) => {
dialogImageUrl.value = file.fileUrl;
dialogVisible.value = true;
}
//文件查看
const handleRemove = (list: any,index: Number) => {
list.splice(index,1)
}
/* 关闭对话框 */
const handleClose = (done: () => void) => {
ruleFormRef.value.resetFields()
@ -702,14 +822,14 @@
<el-form-item label="装备单位：" prop="unitName">
<el-input
autocomplete="off"
style="width: 350px"
style="width: 350px" maxlength="20"
v-model="equipmentDeploymentParams.unitName"
clearable />
</el-form-item>
<el-form-item label="装备品牌" prop="brand">
<el-input
v-model="equipmentDeploymentParams.brand"
autocomplete="off"
autocomplete="off" maxlength="20"
style="width: 350px"
clearable />
</el-form-item>
@ -718,7 +838,7 @@
<el-form-item label="装备编号" prop="code">
<el-input
autocomplete="off"
style="width: 350px"
style="width: 350px" maxlength="40"
v-model="equipmentDeploymentParams.code"
clearable />
</el-form-item>
@ -869,7 +989,106 @@
<template v-else>暂无图片</template>
</template>
</el-form-item> -->
</el-form>
</el-form>
<div class="title">
<span class="title-sign"></span>
<span class="title-text">装备图片</span>
</div>
<div class="uploadBox">
<div class="labelBox">
<div style="margin-left: 20px;">
<span style="color: red;">*</span>
<span style="font-size: 14px;color: #606266;font-weight: 600;">主展示图: </span>
</div>
<div style="margin-left: 20px;">
<el-upload ref="upload" :limit="6" :headers="upload.headers"
:action="upload.url" :show-file-list="false" accept=".png, .jpg, .jpeg"
:on-success="handleFileSuccess" :auto-upload="true"
:before-upload="beforeUpload" :on-error="uploadError"
>
<el-button icon="el-icon-folder-add">上传文件</el-button>
</el-upload>
</div>
<div style="color: #999;font-size: 12px;margin-left: 20px;">支持格式：.jpg .png，单个文件大小不能超过2M</div>
</div>
<div class="imgsBox">
<!-- <div class="imgItem" v-if="mainFileList.length==0">
<div class="icon-list" style="left: 60px;">
<span class="imgItem__icon" >
<i class="el-icon-plus"/>
</span>
</div>
</div> -->
<div class="imgItem" v-for="(item,index) in mainFileList" :key="index">
<img class="picture-card" :src="item.fileUrl" alt="">
<div class="icon-list">
<span class="imgItem__icon hide" @click="handleDownload(item)">
<i class="el-icon-download"/>
</span>
<span class="imgItem__icon hide" @click="picturePreview(item)">
<i class="el-icon-zoom-in"/>
</span>
<span class="imgItem__icon hide" @click="handleRemove(mainFileList,index)">
<i class="el-icon-delete"/>
</span>
</div>
<p class="file-name">{{ item.fileName }}</p>
</div>
</div>
<div class="tipBox">
*注:图片排序为平台展示顺序，不得少于1张，不得多于6张
</div>
</div>
<div class="uploadBox">
<div class="labelBox">
<div style="margin-left: 20px;">
<span style="color: red;">*</span>
<span style="font-size: 14px;color: #606266;font-weight: 600;">详情页展示图: </span>
</div>
<div style="margin-left: 20px;">
<el-upload ref="upload" :limit="6" :headers="upload.headers"
:action="upload.url" :show-file-list="false" accept=".png, .jpg, .jpeg"
:on-success="handleFileSuccess2" :auto-upload="true"
:before-upload="beforeUpload" :on-error="uploadError"
>
<el-button icon="el-icon-folder-add">上传文件</el-button>
</el-upload>
</div>
<div style="color: #999;font-size: 12px;margin-left: 20px;">支持格式：.jpg .png，单个文件大小不能超过2M</div>
</div>
<div class="imgsBox">
<!-- <div class="imgItem" v-if="detailsFileList.length==0">
<div class="icon-list" style="left: 60px;">
<span class="imgItem__icon" >
<i class="el-icon-plus"/>
</span>
</div>
</div> -->
<div class="imgItem" v-for="(item,index) in detailsFileList" :key="index">
<img class="picture-card" :src="item.fileUrl" alt="">
<div class="icon-list">
<span class="imgItem__icon hide" @click="handleDownload(item)">
<i class="el-icon-download"/>
</span>
<span class="imgItem__icon hide" @click="picturePreview(item)">
<i class="el-icon-zoom-in"/>
</span>
<span class="imgItem__icon hide" @click="handleRemove(detailsFileList,index)">
<i class="el-icon-delete"/>
</span>
</div>
<p class="file-name">{{ item.fileName }}</p>
</div>
</div>
<div class="tipBox">
*注:图片排序为平台展示顺序，不得少于1张，不得多于6张
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="closeDialogBtn">关 闭</el-button>
@ -879,6 +1098,15 @@
</span>
</template>
</el-dialog>
<!-- 图片查看弹窗 -->
<el-dialog v-model="dialogVisible" width="500px" height="500px">
<img width="100%" height="500px" :src="dialogImageUrl" />
</el-dialog>
</template>
<style lang="scss" scoped>