代码优化
This commit is contained in:
parent
794720124d
commit
0f04e449aa
|
|
@ -9,6 +9,8 @@ declare module 'vue' {
|
|||
export interface GlobalComponents {
|
||||
Breadcrumb: typeof import('./src/components/Breadcrumb/index.vue')['default']
|
||||
ElBadge: typeof import('element-plus/es')['ElBadge']
|
||||
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']
|
||||
|
|
@ -22,6 +24,7 @@ declare module 'vue' {
|
|||
ElEmpty: typeof import('element-plus/es')['ElEmpty']
|
||||
ElForm: typeof import('element-plus/es')['ElForm']
|
||||
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
||||
ElHeader: typeof import('element-plus/es')['ElHeader']
|
||||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||
ElImage: typeof import('element-plus/es')['ElImage']
|
||||
ElInput: typeof import('element-plus/es')['ElInput']
|
||||
|
|
@ -29,11 +32,17 @@ declare module 'vue' {
|
|||
ElMenu: typeof import('element-plus/es')['ElMenu']
|
||||
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
|
||||
ElOption: typeof import('element-plus/es')['ElOption']
|
||||
ElPageHeader: typeof import('element-plus/es')['ElPageHeader']
|
||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
|
||||
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']
|
||||
ElStep: typeof import('element-plus/es')['ElStep']
|
||||
ElSteps: typeof import('element-plus/es')['ElSteps']
|
||||
ElSwitch: typeof import('element-plus/es')['ElSwitch']
|
||||
ElTable: typeof import('element-plus/es')['ElTable']
|
||||
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
|
||||
ElTag: typeof import('element-plus/es')['ElTag']
|
||||
|
|
|
|||
|
|
@ -291,6 +291,17 @@ const routes: Array<RouteRecordRaw> = [
|
|||
isLogin: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/tag-manage',
|
||||
name: 'tag-manage',
|
||||
component: () => import('views/user/lessor/tag-manage/index.vue'),
|
||||
meta: {
|
||||
title: '标签',
|
||||
keepAlive: true,
|
||||
AuthFlag: false,
|
||||
isLogin: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/sourcingNeed',
|
||||
name: 'sourcingNeed',
|
||||
|
|
|
|||
|
|
@ -2,62 +2,21 @@
|
|||
import Header from 'components/header/index.vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useStore } from '../../store/user'
|
||||
import { mainStore } from '../../store/main'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const spaceTop = ref('')
|
||||
const store = useStore()
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const userInfo: any = computed(() => {
|
||||
return mainStore().userInfo
|
||||
})
|
||||
|
||||
import imgSrc from '@/assets/img/logo.png'
|
||||
|
||||
// 求租按钮
|
||||
// const seekingRentClick = () => {
|
||||
// store.editcurrentMenuItem('baseInfo')
|
||||
// store.editCurrentMenuType(true)
|
||||
// store.editcurrentMenuList([
|
||||
// { title: '基础信息', name: 'baseInfo' },
|
||||
// { title: '订单管理', name: 'orderManagement' },
|
||||
// { title: '子账号管理', name: 'subAccount' },
|
||||
// { title: '业务开通', name: 'business' },
|
||||
// { title: '寻源需求', name: 'sourcingNeed' },
|
||||
// ])
|
||||
// router.push({ name: 'baseInfo' })
|
||||
// }
|
||||
|
||||
// // 承租按钮
|
||||
// const lesseeClick = () => {
|
||||
// store.editcurrentMenuItem('orderManagementCz')
|
||||
// store.editCurrentMenuType(false)
|
||||
// store.editcurrentMenuList([
|
||||
// { title: '订单管理', name: 'orderManagementCz' },
|
||||
// { title: '商品管理', name: 'goodsManagement' },
|
||||
// { title: '商品上下架', name: 'goodsUpdown' },
|
||||
// { title: '机手管理', name: 'operatorManagement' },
|
||||
// { title: '寻源竞价', name: 'sourcingBidding' },
|
||||
// { title: '专区管理', name: 'zoneManag' },
|
||||
// ])
|
||||
// router.push({ name: 'orderManagementCz' })
|
||||
// }
|
||||
|
||||
const handleSelect = (name: any, path: any) => {
|
||||
// store.editcurrentMenuItem(name)
|
||||
|
||||
store.editcurrentMenuItem(name)
|
||||
router.push({
|
||||
name,
|
||||
})
|
||||
}
|
||||
|
||||
const activeseekingRent = computed(() => {
|
||||
return store.currentMenuType
|
||||
})
|
||||
|
||||
const isType: any = computed(() => {
|
||||
return localStorage.getItem('rolesType')
|
||||
})
|
||||
|
|
@ -70,6 +29,7 @@ const allList = [
|
|||
{ title: '结算管理', name: 'settlement-manage', permission: ['1'] },
|
||||
{ title: '质检管理', name: 'quality-manage', permission: ['1'] },
|
||||
{ title: '安全证书管理', name: 'security-certificate', permission: ['1'] },
|
||||
{ title: '标签管理', name: 'tag-manage', permission: ['1'] },
|
||||
{ title: '需求管理', name: 'sourcingNeed', permission: ['2'] },
|
||||
{ title: '订单管理', name: 'orderManagement', permission: ['2'] },
|
||||
{ title: '合同管理', name: 'contract-manage', permission: ['1'] },
|
||||
|
|
@ -84,34 +44,6 @@ const activeItem = computed(() => {
|
|||
router.push({
|
||||
name: activeItem.value,
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
console.log(route, '**********************')
|
||||
})
|
||||
|
||||
// const activeMenuItem = computed(() => {
|
||||
// return store.leaseAndLesseeUserList[0].name
|
||||
// })
|
||||
|
||||
// watch(route, (newVlaue) => {
|
||||
// if (newVlaue.path.indexOf('myuser') === -1) {
|
||||
// store.editcurrentMenuItem('baseInfo')
|
||||
// store.editCurrentMenuType(true)
|
||||
// store.editcurrentMenuList([
|
||||
// // { title: '基础信息', name: 'baseInfo' },
|
||||
// { title: '订单管理', name: 'orderManagement' },
|
||||
// // { title: '子账号管理', name: 'subAccount' },
|
||||
// // { title: '业务开通', name: 'business' },
|
||||
// ])
|
||||
// }
|
||||
// })
|
||||
|
||||
// onMounted(() => {
|
||||
// let divElement: any = document.getElementById('user-container')
|
||||
// let rect = divElement.getBoundingClientRect()
|
||||
// let top = rect.top + 20 + 'px'
|
||||
// spaceTop.value = top
|
||||
// })
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -126,26 +58,6 @@ onMounted(() => {
|
|||
fit="contain"
|
||||
/>
|
||||
</div>
|
||||
<!-- <div class="pic-box">
|
||||
<img v-if="userInfo.logoUrl" :src="userInfo.logoUrl" alt="" />
|
||||
|
||||
<img
|
||||
v-else
|
||||
src="https://zlpt-1259760603.cos.ap-nanjing.myqcloud.com/2023/12/09/815629f192564db98ac55a643b46f853gouwu.png"
|
||||
alt=""
|
||||
/>
|
||||
<span>{{ userInfo.phonenumber || '' }}</span>
|
||||
</div>
|
||||
|
||||
<div class="btn-box">
|
||||
<span @click="seekingRentClick">
|
||||
<a :class="activeseekingRent ? 'active' : ''">承租</a>
|
||||
</span>
|
||||
<span @click="lesseeClick">
|
||||
<a :class="!activeseekingRent ? 'active' : ''">出租</a>
|
||||
</span>
|
||||
</div> -->
|
||||
|
||||
<el-menu
|
||||
class="el-menu-vertical-demo"
|
||||
@select="handleSelect"
|
||||
|
|
@ -166,7 +78,6 @@ onMounted(() => {
|
|||
|
||||
<style lang="scss">
|
||||
.app-container {
|
||||
// background-color: #fff;
|
||||
display: flex;
|
||||
height: calc((100vh - 37px));
|
||||
width: 100%;
|
||||
|
|
@ -174,11 +85,8 @@ onMounted(() => {
|
|||
.left-menu {
|
||||
width: 260px;
|
||||
background-color: #f7f9fa;
|
||||
// border-radius: 5px;
|
||||
// margin-right: 15px;
|
||||
|
||||
.logo-title {
|
||||
// background-color: #1ea193;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
padding: 15px;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,454 @@
|
|||
<template>
|
||||
<!-- 标签管理 -->
|
||||
<div class="app-container-content">
|
||||
<el-form
|
||||
:inline="true"
|
||||
size="default"
|
||||
label-width="0"
|
||||
ref="searchFormRef"
|
||||
:model="searchParams"
|
||||
>
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="code">
|
||||
<el-input
|
||||
clearable
|
||||
style="width: 100%"
|
||||
placeholder="请输入装备编码"
|
||||
v-model.trim="searchParams.code"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="code">
|
||||
<el-input
|
||||
clearable
|
||||
style="width: 100%"
|
||||
placeholder="请输入装备名称"
|
||||
v-model.trim="searchParams.code"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="code">
|
||||
<el-input
|
||||
clearable
|
||||
style="width: 100%"
|
||||
placeholder="请输入上传人"
|
||||
v-model.trim="searchParams.code"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item prop="code">
|
||||
<el-input
|
||||
clearable
|
||||
style="width: 100%"
|
||||
placeholder="请输入归属公司"
|
||||
v-model.trim="searchParams.code"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<el-form-item>
|
||||
<el-date-picker
|
||||
v-model="createTime"
|
||||
type="daterange"
|
||||
style="width: 100%"
|
||||
range-separator="-"
|
||||
value-format="YYYY-MM-DD"
|
||||
start-placeholder="上传开始日期"
|
||||
end-placeholder="上传结束日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<!-- 表格 -->
|
||||
<el-table
|
||||
border
|
||||
:data="qualityLis"
|
||||
show-overflow-tooltip
|
||||
:header-cell-style="{
|
||||
color: '#fff',
|
||||
background: '#00a288',
|
||||
}"
|
||||
>
|
||||
<el-table-column align="center" label="序号" type="index" width="80" />
|
||||
<el-table-column align="center" prop="deviceCode" label="装备编号" />
|
||||
<el-table-column align="center" prop="deviceName" label="装备名称" />
|
||||
<el-table-column align="center" prop="nickName" label="上传人" width="120" />
|
||||
<el-table-column align="center" prop="createTime" label="归属公司" />
|
||||
<el-table-column align="center" prop="updateTime" label="装备数量" />
|
||||
<el-table-column align="center" prop="updateTime" label="上传时间" />
|
||||
<el-table-column align="center" label="二维码标签" :width="220">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
size="small"
|
||||
type="primary"
|
||||
class="primary-lease"
|
||||
@click="onViewQualityRecord(row)"
|
||||
>
|
||||
查看
|
||||
</el-button>
|
||||
<el-popconfirm
|
||||
width="220"
|
||||
:icon="InfoFilled"
|
||||
icon-color="#626AEF"
|
||||
title="确定删除该项需求吗?"
|
||||
@confirm="onDelete(row.maId)"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button size="small" type="danger"> 删除 </el-button>
|
||||
</template>
|
||||
<template #actions="{ confirm }">
|
||||
<el-button type="primary" class="primary-lease" size="small"
|
||||
>取消</el-button
|
||||
>
|
||||
<el-button
|
||||
class="primary-lease"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="confirm()"
|
||||
>
|
||||
确定
|
||||
</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<PagingComponent
|
||||
:total="total"
|
||||
:size="searchParams.pageSize"
|
||||
:page="searchParams.pageNum"
|
||||
@getListChange="getLeaseListData"
|
||||
v-model:page-num="searchParams.pageNum"
|
||||
v-model:page-size="searchParams.pageSize"
|
||||
/>
|
||||
<!-- 新增修改对话框 -->
|
||||
<el-dialog
|
||||
width="40%"
|
||||
align-center
|
||||
@close="onClose"
|
||||
destroy-on-close
|
||||
:title="dialogTitle"
|
||||
v-model="addOrEditDialogVisible"
|
||||
>
|
||||
<el-form
|
||||
label-width="auto"
|
||||
label-position="right"
|
||||
ref="addOrEditFormRef"
|
||||
:model="addOrEditForm"
|
||||
:rules="addOrEditFormRules"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="关联装备" style="width: 100%" prop="maId">
|
||||
<el-select
|
||||
clearable
|
||||
style="width: 100%"
|
||||
placeholder="请选择关联装备"
|
||||
v-model="addOrEditForm.maId"
|
||||
@change="onMaIdChange"
|
||||
:disabled="dialogTitle != '证书新增'"
|
||||
>
|
||||
<el-option
|
||||
:key="item.maId"
|
||||
:value="item.maId * 1"
|
||||
:label="item.deviceName"
|
||||
v-for="item in associationList"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="1" style="margin-bottom: 0" class="upload-tip">
|
||||
支持格式:.jpg、.png 单个文件大小不能超过2M,最多可上传1张
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="安全证书附件" prop="fileInfoList">
|
||||
<div style="flex: 1">
|
||||
<UploadComponentNew
|
||||
:maxSize="2"
|
||||
:max-limit="1"
|
||||
width="100%"
|
||||
height="100%"
|
||||
:multiple="true"
|
||||
:autoUpload="true"
|
||||
:minLimit="addOrEditForm.fileInfoList.length"
|
||||
:actionUrl="uploadUrl"
|
||||
listType="text"
|
||||
:justifyContent="`flex-start`"
|
||||
@onFileChange="onFileChange"
|
||||
:acceptTypeList="['.jpg', '.png', '.pdf', '.doc']"
|
||||
>
|
||||
<template v-slot:default>
|
||||
<!-- <el-icon size="48" color="#aaa"><Plus /></el-icon> -->
|
||||
<el-button
|
||||
:icon="UploadFilled"
|
||||
type="primary"
|
||||
class="primary-lease"
|
||||
>上传文件</el-button
|
||||
>
|
||||
</template>
|
||||
</UploadComponentNew>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" class="primary-lease" @click="onCancel"
|
||||
>取消</el-button
|
||||
>
|
||||
<el-button class="primary-lease" type="primary" @click="onSubmit()">
|
||||
提交
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import PagingComponent from 'components/PagingComponent/index.vue'
|
||||
import UploadComponentNew from 'components/uploadComponentNew/index.vue'
|
||||
import {
|
||||
addSafeBookApi,
|
||||
getSafeBookByMaIdListApi,
|
||||
editSafeBookApi,
|
||||
delSafeBookByIdApi,
|
||||
getAssociationListApi,
|
||||
} from 'http/api/security-certificate'
|
||||
import { InfoFilled, UploadFilled } from '@element-plus/icons-vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const total = ref(0)
|
||||
const createTime = ref([])
|
||||
const qualityLis = ref<any>([])
|
||||
const dialogTitle = ref('')
|
||||
const searchFormRef = ref<any>(null)
|
||||
const addOrEditFormRef = ref<any>(null)
|
||||
const addOrEditDialogVisible = ref(false)
|
||||
const associationList = ref<any>([])
|
||||
const uploadUrl = import.meta.env.VITE_API_URL + '/file/upload'
|
||||
|
||||
const searchParams = reactive({
|
||||
code: '',
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
})
|
||||
|
||||
const addOrEditForm = ref<any>({
|
||||
maId: '',
|
||||
fileInfoList: [],
|
||||
fileInfoTempList: [],
|
||||
})
|
||||
|
||||
const addOrEditFormRules = reactive({
|
||||
maId: [{ required: true, message: '请选择关联装备', trigger: 'change' }],
|
||||
fileInfoList: [{ required: true, message: '请上传证书附件', trigger: 'blur' }],
|
||||
})
|
||||
|
||||
// 获取列表
|
||||
const getLeaseListData = async () => {
|
||||
if (createTime.value.length > 0) {
|
||||
searchParams.startTime = createTime.value[0]
|
||||
searchParams.endTime = createTime.value[1]
|
||||
}
|
||||
const { data: res }: any = await getSafeBookByMaIdListApi(searchParams)
|
||||
qualityLis.value = res.rows
|
||||
total.value = res.total
|
||||
}
|
||||
|
||||
// 获取关联装备
|
||||
const getAssociationListData = async () => {
|
||||
const res: any = await getAssociationListApi()
|
||||
associationList.value = res.data
|
||||
}
|
||||
|
||||
const onMaIdChange = (id: any) => {
|
||||
ElMessage.closeAll()
|
||||
try {
|
||||
associationList.value.forEach((e: any) => {
|
||||
if (e.maId == id && e.isSafeBook === 1) {
|
||||
ElMessage({
|
||||
type: 'warning',
|
||||
message: '当前装备证书已上传,不可重复选择!',
|
||||
})
|
||||
addOrEditForm.value.maId = ''
|
||||
throw new Error()
|
||||
}
|
||||
})
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
// 重置
|
||||
const onReset = () => {
|
||||
createTime.value = []
|
||||
searchParams.startTime = ''
|
||||
searchParams.endTime = ''
|
||||
searchParams.pageNum = 1
|
||||
searchParams.pageSize = 10
|
||||
searchFormRef.value.resetFields()
|
||||
getLeaseListData()
|
||||
}
|
||||
|
||||
// 删除
|
||||
const onDelete = async (maId: any) => {
|
||||
const res: any = await delSafeBookByIdApi({ maId })
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '删除成功',
|
||||
})
|
||||
getLeaseListData()
|
||||
}
|
||||
}
|
||||
|
||||
// 提交
|
||||
const onSubmit = () => {
|
||||
addOrEditForm.value.fileInfoList = addOrEditForm.value.fileInfoTempList
|
||||
addOrEditFormRef.value.validate(async (valid: any) => {
|
||||
if (valid) {
|
||||
const SEN_API = dialogTitle.value === '证书修改' ? editSafeBookApi : addSafeBookApi
|
||||
const res: any = await SEN_API(addOrEditForm.value)
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '提交成功',
|
||||
})
|
||||
addOrEditDialogVisible.value = false
|
||||
getLeaseListData()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 编辑
|
||||
const onViewQualityRecord = (row: any) => {
|
||||
addOrEditForm.value.maId = row.maId
|
||||
dialogTitle.value = '证书修改'
|
||||
addOrEditDialogVisible.value = true
|
||||
}
|
||||
|
||||
// 自定义事件
|
||||
const onFileChange = (fileList: any) => {
|
||||
addOrEditForm.value.fileInfoTempList = []
|
||||
const fileListTemp = fileList.map((e: any) => {
|
||||
return {
|
||||
fileName: e.name,
|
||||
fileUrl: e.url,
|
||||
}
|
||||
})
|
||||
|
||||
addOrEditForm.value.fileInfoTempList.push(...fileListTemp)
|
||||
}
|
||||
|
||||
// 取消按钮
|
||||
const onCancel = () => {
|
||||
addOrEditDialogVisible.value = false
|
||||
}
|
||||
const onClose = () => {
|
||||
addOrEditFormRef.value.resetFields()
|
||||
addOrEditForm.value.fileInfoTempList = []
|
||||
addOrEditForm.value.fileInfoList = []
|
||||
addOrEditForm.value.maId = ''
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getLeaseListData()
|
||||
getAssociationListData()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
:deep.upload-tip .el-form-item__label {
|
||||
color: transparent;
|
||||
}
|
||||
.el-pagination {
|
||||
justify-content: flex-end;
|
||||
padding: 5px 0;
|
||||
}
|
||||
:deep.el-pagination.is-background .el-pager li.is-active {
|
||||
background-color: #3cb4a6;
|
||||
}
|
||||
:deep.el-form--inline .el-form-item {
|
||||
margin-right: 6px;
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
.img-list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.img-items {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.mask-img {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.delete-icon {
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
z-index: 9;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.img-items:hover .mask-img {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
.app-container-content {
|
||||
:deep(.el-dialog) {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
margin: 0 !important;
|
||||
position: absolute !important;
|
||||
top: 50% !important;
|
||||
left: 50% !important;
|
||||
transform: translate(-50%, -50%) !important;
|
||||
max-height: 100vh !important;
|
||||
.el-dialog__body {
|
||||
flex: 1;
|
||||
overflow-y: scroll !important;
|
||||
}
|
||||
.dialog-content {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue