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

外租装备管理

This commit is contained in:
lSun 2026-01-23 15:17:38 +08:00
parent 15bf303f66
commit ea70083874
2 changed files with 706 additions and 424 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/http/api/owner-manage/index.ts
View File

@ -29,3 +29,9 @@ export const updateStatus = (data: any = {}) => {
export const getContractSelectList = () => { export const getContractSelectList = () => {
return get('/material-mall/contract/lisTemplate', {}) return get('/material-mall/contract/lisTemplate', {})
} }
//装备名称下拉框获取
export const getCategoryList = (data: any = {}) => {
return get('/material-mall/owner/getCategoryList', data)
}

568
src/views/user/rent-manage/index.vue
View File

@ -1,53 +1,53 @@
<template> <template>
<div class="app-container-content"> <div class='app-container-content'>
<!-- 搜索表单 --> <!-- 搜索表单 -->
<el-form <el-form
:model="queryParams" :model='queryParams'
ref="queryFormRef" ref='queryFormRef'
:inline="true" :inline='true'
size="default" size='default'
label-width="0" label-width='0'
> >
<el-row> <el-row>
<el-col :span="6"> <el-col :span='6'>
<el-form-item prop="maName"> <el-form-item prop='modelId'>
<el-select <el-select
v-model="queryParams.maName" v-model='queryParams.modelId'
placeholder="请选择装备类目" placeholder='请选择装备类目'
style="width: 100%" style='width: 100%'
clearable clearable
filterable filterable
> >
<el-option <el-option
v-for="item in equipmentNameOptions" v-for='item in equipmentNameOptions'
:key="item.value" :key='item.value'
:label="item.label" :label='item.label'
:value="item.value" :value='item.value'
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span='6'>
<el-form-item prop="maModel"> <el-form-item prop='maName'>
<el-input <el-input
v-model.trim="queryParams.maModel" v-model.trim='queryParams.maName'
style="width: 100%" style='width: 100%'
clearable clearable
placeholder="请输入装备名称" placeholder='请输入装备名称'
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span='6'>
<el-form-item> <el-form-item>
<el-button class="primary-lease" type="primary" @click="getContractListData">查询</el-button> <el-button class='primary-lease' type='primary' @click='getContractListData'>查询</el-button>
<el-button class="primary-lease" type="primary" @click="onReset">重置</el-button> <el-button class='primary-lease' type='primary' @click='onReset'>重置</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="18"> <el-col :span='18'>
<el-form-item> <el-form-item>
<el-button class="primary-lease" type="primary" @click="addContract">新增装备</el-button> <el-button class='primary-lease' type='primary' @click='addContract'>新增装备</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -55,131 +55,247 @@
<!-- 表格 --> <!-- 表格 -->
<el-table <el-table
:data="qualityLis" :data='qualityLis'
show-overflow-tooltip show-overflow-tooltip
:header-cell-style="{ background: '#00a288', color: '#fff' }" :header-cell-style="{ background: '#2CBAB2', color: '#fff' }"
> >
<el-table-column align="center" prop="maName" label="装备类目" /> <el-table-column align='center' prop='modelName' label='装备类目' />
<el-table-column align="center" prop="maModel" label="装备名称" /> <el-table-column align='center' prop='maName' label='装备名称' />
<el-table-column align="center" prop="maNum" label="装备数量" /> <el-table-column align='center' prop='maNum' label='装备数量' />
<el-table-column align="center" label="操作" :width="220"> <el-table-column align='center' prop='proCode' label='所属项目' />
<template #default="{ row }"> <el-table-column align='center' prop='rentalCompany' label='出租公司' />
<el-button size="small" type="primary" @click="onContract(row)">编辑</el-button> <el-table-column align='center' prop='leaseTerm' label='租赁时间' />
<el-button size="small" type="danger" @click="onDelete(row.id)">删除</el-button> <el-table-column align='center' prop='returnTime' label='归还时间' />
<el-table-column align='center' prop='actualNumber' label='实际使用台班数' />
<el-table-column align='center' prop='rentalAmount' label='租赁金额' />
<el-table-column align='center' prop='fileList' label='装备图'>
<template #default='{ row }'>
<span
v-if="row.fileList && row.fileList.trim() !== ''"
class='link-text'
@click='previewTableImages(row.fileList)'
style='color:#2CBAB2;cursor:pointer;'
>
已上传
</span>
<span v-else>
未上传
</span>
</template>
</el-table-column>
<el-table-column align='center' label='操作' :width='220'>
<template #default='{ row }'>
<el-button size='small' type='text' @click='onContract(row)'>编辑</el-button>
<el-button size='small' type='text' @click='onDelete(row.id)' style='color: #FF5129;'>删除
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<PagingComponent <PagingComponent
@getList="getContractListData" @getList='getContractListData'
:pageSize="queryParams.pageSize" :pageSize='queryParams.pageSize'
:pageNumber="queryParams.pageNum" :pageNumber='queryParams.pageNum'
:total="total" :total='total'
/> />
<!-- 新增/编辑弹窗 --> <!-- 新增/编辑弹窗 -->
<el-dialog <el-dialog
v-model="dialogVisibleSettlein" v-model='dialogVisibleSettlein'
:title="settleinTitle" :title='settleinTitle'
width="40%" width='40%'
destroy-on-close destroy-on-close
class="centered-dialog" class='centered-dialog'
:close-on-click-modal="false" :close-on-click-modal='false'
@close="onDialogClose" @close='onDialogClose'
> >
<el-form <el-form
label-width="140px" label-width='140px'
ref="addAndEditFormRef" ref='addAndEditFormRef'
label-position="right" label-position='right'
:model="addAndEditForm" :model='addAndEditForm'
:rules="addAndEditFormRules" :rules='addAndEditFormRules'
> >
<el-row :gutter="20"> <el-row :gutter='20'>
<el-col :span="24"> <el-col :span='24'>
<el-form-item label="装备类目：" prop="maNameId"> <el-form-item label='装备类目：' prop='modelId'>
<el-select <el-select
v-model="addAndEditForm.maNameId" v-model='addAndEditForm.modelId'
placeholder="请选择装备类目" placeholder='请选择装备类目'
style="width: 100%" style='width: 100%'
clearable clearable
filterable filterable
> >
<el-option <el-option
v-for="item in equipmentNameOptions" v-for='item in equipmentNameOptions'
:key="item.value" :key='item.value'
:label="item.label" :label='item.label'
:value="item.value" :value='item.value'
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter='20'>
<el-col :span="24"> <el-col :span='24'>
<el-form-item label="装备名称：" prop="maModel"> <el-form-item label='装备名称：' prop='maName'>
<el-input <el-input
v-model="addAndEditForm.maModel" v-model='addAndEditForm.maName'
maxlength="50" maxlength='50'
placeholder="请输入装备名称" placeholder='请输入装备名称'
clearable clearable
style="width: 100%" style='width: 100%'
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter='20'>
<el-col :span="24"> <el-col :span='24'>
<el-form-item label="装备数量：" prop="maNum"> <el-form-item label='装备数量：' prop='maNum'>
<el-input-number <el-input-number
v-model="addAndEditForm.maNum" v-model='addAndEditForm.maNum'
:min="1" :min='1'
placeholder="请输入数量" placeholder='请输入数量'
style="width: 100%" style='width: 100%'
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item prop='proCode' label='所属项目:'>
<el-select
v-model='addAndEditForm.proCode'
placeholder='请选择所属项目'
style='width: 100%;'
>
<el-option
v-for='item in projectList'
:key='item.proCode'
:label='item.proName'
:value='item.proCode'
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item label='出租公司：' prop='rentalCompany'>
<el-input
v-model='addAndEditForm.rentalCompany'
maxlength='50'
placeholder='请输入出租公司'
clearable
style='width: 100%'
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item label='租赁时间' prop='leaseTerm'>
<el-date-picker
v-model='addAndEditForm.leaseTerm'
type='date'
placeholder='请选择租赁时间'
style='width: 100%'
format='YYYY-MM-DD'
value-format='YYYY-MM-DD'
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item label='归还时间' prop='returnTime'>
<el-date-picker
v-model='addAndEditForm.returnTime'
placeholder='请选择归还时间'
type='date'
style='width: 100%'
format='YYYY-MM-DD'
value-format='YYYY-MM-DD'
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item label='实际使用台班数：' prop='actualNumber'>
<el-input-number
v-model='addAndEditForm.actualNumber'
:min='1'
placeholder='请输入实际使用台班数'
style='width: 100%'
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter='20'>
<el-col :span='24'>
<el-form-item label='租赁金额：' prop='rentalAmount'>
<el-input-number
v-model='addAndEditForm.rentalAmount'
:min='1'
placeholder='请输入租赁金额'
style='width: 100%'
/>
</el-form-item>
</el-col>
</el-row>
<!-- 图片一类的处理 --> <!-- 图片一类的处理 -->
<el-row :gutter="20" v-if="!isViewForm"> <el-row :gutter='20' v-if='!isViewForm'>
<el-col :span="24"> <el-col :span='24'>
<el-form-item label="1" style="margin-bottom: 0" class="upload-tip"> <el-form-item label='1' style='margin-bottom: 0' class='upload-tip'>
<div class="tipBox"> <div class='tipBox'>
*注: 支持格式：.jpg、.png 单个文件大小不能超过5M *注: 支持格式：.jpg、.png 单个文件大小不能超过5M
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="20"> <el-row :gutter='20'>
<el-col :span="24"> <el-col :span='24'>
<el-form-item <el-form-item
style="font-weight: bold" style='font-weight: bold'
label="装备图：" label='装备图：'
prop="mainFileList" prop='mainFileList'
> >
<div <div
class="img-list" class='img-list'
v-if="addAndEditForm.mainFileList.length > 0 && !isAdd" v-if='addAndEditForm.mainFileList.length > 0 && !isAdd'
> >
<div <div
v-for="(j, i) in addAndEditForm.mainFileList" v-for='(j, i) in addAndEditForm.mainFileList'
:key="j.fileUrl" :key='j.fileUrl'
class="img-items" class='img-items'
> >
<img :src="j.fileUrl" alt="" /> <img :src='j.fileUrl' alt='' />
<div class="mask-img"> <div class='mask-img'>
<div> <div>
<el-icon <el-icon
class="delete-icon" class='delete-icon'
@click="onDeleteImgInMain(i)" @click='onDeleteImgInMain(i)'
v-if="!isViewForm" v-if='!isViewForm'
> >
<DeleteFilled /> <DeleteFilled />
</el-icon> </el-icon>
<el-icon <el-icon
class="delete-icon" class='delete-icon'
style="margin-left: 10px" style='margin-left: 10px'
@click="onPreviewImg(j.fileUrl)" @click='onPreviewImg(j.fileUrl)'
> >
<ZoomIn /> <ZoomIn />
</el-icon> </el-icon>
@ -188,21 +304,23 @@
</div> </div>
</div> </div>
<UploadComponentNew <UploadComponentNew
v-if="!isViewForm" v-if='!isViewForm'
:maxSize="5" :maxSize='5'
:max-limit="6" :max-limit='6'
width="100px" width='100px'
height="100px" height='100px'
:actionUrl="uploadUrl" :actionUrl='uploadUrl'
:autoUpload="true" :autoUpload='true'
:multiple="true" :multiple='true'
:minLimit="addAndEditForm.mainFileList.length" :minLimit='addAndEditForm.mainFileList.length'
listType="picture-card" listType='picture-card'
:acceptTypeList="['.jpg', '.png']" :acceptTypeList="['.jpg', '.png']"
@onFileChange="onMainFileChange" @onFileChange='onMainFileChange'
> >
<template v-slot:default> <template v-slot:default>
<el-icon size="42" color="#aaa"><Plus /></el-icon> <el-icon size='42' color='#aaa'>
<Plus />
</el-icon>
</template> </template>
</UploadComponentNew> </UploadComponentNew>
</el-form-item> </el-form-item>
@ -210,23 +328,47 @@
</el-row> </el-row>
</el-form> </el-form>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class='dialog-footer'>
<el-button type="primary" class="primary-lease" @click="onCancel">取消</el-button> <el-button type='primary' class='primary-lease' @click='onCancel'
<el-button class="primary-lease" type="primary" @click="onSubmit">提交</el-button> style='background: #FFFFFF;border: 1px solid #CCCCCC;color: #666666;'>取消
</el-button>
<el-button class='primary-lease' type='primary' @click='onSubmit'>提交</el-button>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
<el-dialog
v-model="dialogVisiblePreview"
title="查看装备图片"
width="60%"
>
<div style="display:flex; flex-wrap:wrap; gap:10px;">
<img
v-for="(url, index) in previewImages"
:key="index"
:src="url"
style="width:120px; height:120px; object-fit:cover; cursor:pointer;border: 2px solid #2CBAB2;border-radius: 4px;padding: 2px; "
@click="window.open(url)"
/>
</div>
<template #footer>
<el-button @click="dialogVisiblePreview = false">关闭</el-button>
</template>
</el-dialog>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang='ts'>
import UploadComponentNew from 'components/uploadComponentNew/index.vue' import UploadComponentNew from 'components/uploadComponentNew/index.vue'
import PagingComponent from 'components/PagingComponent/index.vue' import PagingComponent from 'components/PagingComponent/index.vue'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import { ref, reactive, onMounted } from 'vue' import { ref, reactive, onMounted } from 'vue'
import { useStore } from 'store/user' import { useStore } from 'store/user'
const store = useStore() const store = useStore()
import { mainStore } from 'store/main' import { mainStore } from 'store/main'
const store2 = mainStore() const store2 = mainStore()
import { import {
getEquipmentNameList, //装备类目 getEquipmentNameList, //装备类目
@ -234,7 +376,9 @@ import {
addContractApi, //新增 addContractApi, //新增
editContractApi, //修改 editContractApi, //修改
delContractApi, //删除 delContractApi, //删除
getCategoryList, //装备类目
} from 'http/api/owner-manage' } from 'http/api/owner-manage'
import { getProListApi } from '@/http/api/cart'
const uploadUrlTemp = ref('') const uploadUrlTemp = ref('')
const isViewForm = ref(false) const isViewForm = ref(false)
@ -243,22 +387,40 @@ const isAdd = ref(false)
const queryFormRef = ref<any>(null) const queryFormRef = ref<any>(null)
const total = ref(0) const total = ref(0)
const equipmentNameOptions = ref<any[]>([]) const equipmentNameOptions = ref<any[]>([])
const projectList: any = ref([])
const queryParams: any = reactive({ const queryParams: any = reactive({
modelId: '',
maName: '', maName: '',
maModel: '',
type: '1', type: '1',
pageSize: 10, pageSize: 10,
pageNum: 1, pageNum: 1,
}) })
const dialogVisiblePreview = ref(false)
const previewImages = ref<string[]>([])
const previewTableImages = (fileList: string) => {
if (!fileList) return
// 拆成数组
previewImages.value = fileList.split(',')
dialogVisiblePreview.value = true
}
const addAndEditForm = ref<any>({ const addAndEditForm = ref<any>({
id: null, id: null,
maNameId: '', modelId: '',
maType: '', maType: '',
maModel: '', maName: '',
maNum: '', maNum: '',
type: '1', type: '1',
mainFileList: [], // 确保初始化 mainFileList: [], // 确保初始化
mainFileTempList: [] // 临时存储新上传的文件 mainFileTempList: [], // 临时存储新上传的文件
proCode: '',
rentalCompany: '',
leaseTerm: null,
returnTime: null,
actualNumber: '',
rentalAmount: '',
fileList: '',
}) })
const addAndEditFormRef = ref() const addAndEditFormRef = ref()
const mainFileList: any = ref([]) //主展示 const mainFileList: any = ref([]) //主展示
@ -271,6 +433,10 @@ const uploadUrl = import.meta.env.VITE_API_URL + '/file/upload'
const onDeleteImgInMain = (index: any) => { const onDeleteImgInMain = (index: any) => {
addAndEditForm.value.mainFileList.splice(index, 1) addAndEditForm.value.mainFileList.splice(index, 1)
addAndEditForm.value.fileList = addAndEditForm.value.mainFileList
.map(item => item.fileUrl)
.join(',')
} }
const handleUpload = (file: any, fileList: any) => { const handleUpload = (file: any, fileList: any) => {
@ -285,10 +451,13 @@ const handleUpload = (file: any, fileList: any) => {
// 处理上传成功的图片 // 处理上传成功的图片
const onMainFileChange = (fileList: any[]) => { const onMainFileChange = (fileList: any[]) => {
// 将上传的文件信息存储到临时列表 // 将上传的文件信息存储到临时列表
addAndEditForm.value.mainFileTempList = fileList.map(file => ({ /*addAndEditForm.value.mainFileTempList = fileList.map(file => ({
fileName: file.name, // 文件名 fileName: file.name, // 文件名
fileUrl: file.url // 文件URL fileUrl: file.url, // 文件URL
})) }))*/
addAndEditForm.value.fileList = fileList
.map(file => file.url)
.join(',')
} }
// 获取列表 // 获取列表
@ -301,11 +470,11 @@ const getContractListData = async () => {
//获取装备类目 //获取装备类目
const loadEquipmentNameOptions = async () => { const loadEquipmentNameOptions = async () => {
const res: any = await getEquipmentNameList() const res: any = await getCategoryList()
if (res.code === 200) { if (res.code === 200) {
equipmentNameOptions.value = res.data.map(item => ({ equipmentNameOptions.value = res.data.map(item => ({
label: item.name, label: item.equipmentName,
value: item.id value: item.typeId,
})) }))
console.log('下拉选项:', equipmentNameOptions.value) // 调试用 console.log('下拉选项:', equipmentNameOptions.value) // 调试用
} else { } else {
@ -313,10 +482,45 @@ const loadEquipmentNameOptions = async () => {
} }
} }
//获取所属项目
const loadProjectListOptions = async () => {
const res: any = await getProListApi()
if (res.code === 200) {
projectList.value = res.data
console.log('下拉选项:') // 调试用
} else {
ElMessage.error('获取所属项目失败')
}
}
const validateLeaseTime = (_rule: any, value: string, callback: any) => {
const returnTime = addAndEditForm.value.returnTime
if (!value || !returnTime) {
callback()
} else if (new Date(value) > new Date(returnTime)) {
callback(new Error('租赁时间必须早于归还时间'))
} else {
callback()
}
}
const validateReturnTime = (_rule: any, value: string, callback: any) => {
const leaseTerm = addAndEditForm.value.leaseTerm
if (!value || !leaseTerm) {
callback()
} else if (new Date(value) < new Date(leaseTerm)) {
callback(new Error('归还时间必须晚于租赁时间'))
} else {
callback()
}
}
// 重置 // 重置
const onReset = () => { const onReset = () => {
queryParams.maName = '' queryParams.maName = ''
queryParams.maModel = '' queryParams.maName = ''
queryParams.pageNum = 1 queryParams.pageNum = 1
queryParams.pageSize = 10 queryParams.pageSize = 10
queryFormRef.value.resetFields() queryFormRef.value.resetFields()
@ -329,84 +533,122 @@ const addContract = () => {
dialogVisibleSettlein.value = true dialogVisibleSettlein.value = true
addAndEditForm.value.id = null addAndEditForm.value.id = null
isViewForm.value = false isViewForm.value = false
addAndEditForm.value.maNameId = '' addAndEditForm.value.modelId = ''
addAndEditForm.value.maType = '' addAndEditForm.value.maType = ''
addAndEditForm.value.maModel = '' addAndEditForm.value.maName = ''
addAndEditForm.value.maNum = '' addAndEditForm.value.maNum = ''
addAndEditForm.value.mainFileList = [] // 修复：加.value addAndEditForm.value.mainFileList = [] // 修复：加.value
addAndEditForm.value.mainFileTempList = [] // 修复：加.value addAndEditForm.value.mainFileTempList = [] // 修复：加.value
addAndEditForm.value.proCode = ''
addAndEditForm.value.rentalCompany = ''
addAndEditForm.value.leaseTerm = null
addAndEditForm.value.returnTime = null
addAndEditForm.value.actualNumber = ''
addAndEditForm.value.rentalAmount = ''
addAndEditForm.value.fileList = ''
} }
// 编辑装备时加载已有图片 // 编辑装备时加载已有图片
const onContract = (row: any) => { const onContract = (row: any) => {
// 加载已有图片（如果后端返回了图片数据） // 加载已有图片（如果后端返回了图片数据）
if (row.mainFileList) { if (row.fileList) {
addAndEditForm.value.mainFileList = row.mainFileList.map((img: any) => ({ addAndEditForm.value.mainFileList = row.fileList.split(',').map((url: string) => ({
fileName: img.fileName, fileName: url.split('/').pop(),
fileUrl: img.fileUrl fileUrl: url,
})) }))
} else { } else {
addAndEditForm.value.mainFileList = [] addAndEditForm.value.mainFileList = []
} }
addAndEditForm.value.mainFileTempList = [] addAndEditForm.value.mainFileTempList = []
addAndEditForm.value.id = row.id addAndEditForm.value.id = row.id
// 通过装备类目匹配下拉选项，获取对应的id // 通过装备类目匹配下拉选项，获取对应的id
const matchedOption = equipmentNameOptions.value.find(option => option.label === row.maName) const matchedOption = equipmentNameOptions.value.find(option => option.label === row.maName)
if (matchedOption) { if (matchedOption) {
addAndEditForm.value.maNameId = matchedOption.value addAndEditForm.value.modelId = matchedOption.value
} else { } else {
// 如果找不到匹配，尝试使用其他字段 // 如果找不到匹配，尝试使用其他字段
addAndEditForm.value.maNameId = row.maNameId || row.maName_id || row.equipmentId || row.id addAndEditForm.value.modelId = row.modelId || row.maName_id || row.equipmentId || row.id
}
// 通过所属项目下拉选项，获取对应的id
const projectListOption = projectList.value.find(option => option.label === row.maName)
if (projectListOption) {
addAndEditForm.value.proCode = projectListOption.value
} else {
// 如果找不到匹配，尝试使用其他字段
addAndEditForm.value.proCode = row.proCode || row.id
} }
addAndEditForm.value.maType = row.maType addAndEditForm.value.maType = row.maType
addAndEditForm.value.maModel = row.maModel addAndEditForm.value.maName = row.maName
addAndEditForm.value.maNum = row.maNum addAndEditForm.value.maNum = row.maNum
addAndEditForm.value.rentalCompany = row.rentalCompany
addAndEditForm.value.leaseTerm = row.leaseTerm
addAndEditForm.value.returnTime = row.returnTime
addAndEditForm.value.actualNumber = row.actualNumber
addAndEditForm.value.rentalAmount = row.rentalAmount
settleinTitle.value = '外租装备修改' settleinTitle.value = '外租装备修改'
dialogVisibleSettlein.value = true dialogVisibleSettlein.value = true
// 检查是否能找到对应的选项 // 检查是否能找到对应的选项
const foundOption = equipmentNameOptions.value.find(item => item.value === addAndEditForm.value.maNameId) const foundOption = equipmentNameOptions.value.find(item => item.value === addAndEditForm.value.modelId)
console.log('找到的选项:', foundOption) // 调试用 console.log('找到的选项:', foundOption) // 调试用
if (!foundOption) { if (!foundOption) {
console.warn('警告：找不到对应的装备类目选项，maNameId:', addAndEditForm.value.maNameId) console.warn('警告：找不到对应的装备类目选项，modelId:', addAndEditForm.value.modelId)
} }
} }
const onDialogClose = () => { const onDialogClose = () => {
addAndEditFormRef.value.resetFields() addAndEditFormRef.value.resetFields()
addAndEditForm.value.id = null addAndEditForm.value.id = null
addAndEditForm.value.maNameId = '' addAndEditForm.value.modelId = ''
addAndEditForm.value.maType = '' addAndEditForm.value.maType = ''
addAndEditForm.value.maModel = '' addAndEditForm.value.maName = ''
addAndEditForm.value.maNum = '' addAndEditForm.value.maNum = ''
} }
const addAndEditFormRules = reactive({ const addAndEditFormRules = reactive({
maNameId: [{ required: true, message: '请选择装备类目', trigger: 'change' }], modelId: [{ required: true, message: '请选择装备类目', trigger: 'change' }],
maType: [{ required: true, message: '请输入装备分类', trigger: 'blur' }], maType: [{ required: true, message: '请输入装备分类', trigger: 'blur' }],
maModel: [{ required: true, message: '请输入装备名称', trigger: 'blur' }], maName: [{ required: true, message: '请输入装备名称', trigger: 'blur' }],
maNum: [{ required: true, type: 'number', message: '请输入装备数量', trigger: 'blur' }] maNum: [{ required: true, type: 'number', message: '请输入装备数量', trigger: 'blur' }],
proCode: [{ required: true, message: '请选择所属项目', trigger: 'change' }],
rentalCompany: [{ required: true, message: '请输入出租公司', trigger: 'blur' }],
leaseTerm: [
{ required: true, message: '请选择租赁时间', trigger: 'change' },
{ validator: validateLeaseTime, trigger: 'change' },
],
returnTime: [
{ required: true, message: '请选择归还时间', trigger: 'change' },
{ validator: validateReturnTime, trigger: 'change' },
],
actualNumber: [{ required: true, type: 'number', message: '请输入实际使用台班数', trigger: 'blur' }],
rentalAmount: [{ required: true, type: 'number', message: '请输入租赁金额', trigger: 'blur' }],
}) })
const onSubmit = () => { const onSubmit = () => {
addAndEditFormRef.value.validate(async (valid: any) => { addAndEditFormRef.value.validate(async (valid: any) => {
if (valid) { if (valid) {
// 合并临时图片到主图片列表 /*// 合并临时图片到主图片列表
addAndEditForm.value.mainFileList = [ addAndEditForm.value.mainFileList = [
...addAndEditForm.value.mainFileList, ...addAndEditForm.value.mainFileList,
...addAndEditForm.value.mainFileTempList ...addAndEditForm.value.mainFileTempList,
] ]
// 清空临时列表 // 清空临时列表
addAndEditForm.value.mainFileTempList = [] addAndEditForm.value.mainFileTempList = []*/
const SEN_API = settleinTitle.value === '外租装备修改' ? editContractApi : addContractApi const SEN_API = settleinTitle.value === '外租装备修改' ? editContractApi : addContractApi
const res: any = await SEN_API(addAndEditForm.value) const res: any = await SEN_API(addAndEditForm.value)
if (res.code === 200) { if (res.code === 200) {
ElMessage.success('提交成功') ElMessage.success('提交成功')
dialogVisibleSettlein.value = false dialogVisibleSettlein.value = false
getContractListData(); getContractListData()
} else { } else {
ElMessage.error(res.msg || '提交失败') ElMessage.error(res.msg || '提交失败')
} }
@ -425,12 +667,13 @@ const onDelete = async (id: any) => {
const res = await delContractApi({ id }) const res = await delContractApi({ id })
if (res.code === 200) { if (res.code === 200) {
ElMessage.success('删除成功') ElMessage.success('删除成功')
getContractListData(); getContractListData()
} else { } else {
ElMessage.error(res.msg || '删除失败') ElMessage.error(res.msg || '删除失败')
} }
}) })
.catch(() => {}) .catch(() => {
})
} }
// 取消按钮 // 取消按钮
@ -441,11 +684,12 @@ const onCancel = () => {
onMounted(() => { onMounted(() => {
getContractListData() getContractListData()
loadEquipmentNameOptions() loadEquipmentNameOptions()
loadProjectListOptions()
uploadUrlTemp.value = window.location.origin + '/iws/mall-view/contract-template-250224.docx' uploadUrlTemp.value = window.location.origin + '/iws/mall-view/contract-template-250224.docx'
}) })
</script> </script>
<style lang="scss" scoped> <style lang='scss' scoped>
.tipBox { .tipBox {
color: red; color: red;
font-size: 12px; font-size: 12px;
@ -455,32 +699,40 @@ onMounted(() => {
:deep.editor { :deep.editor {
height: 300px; height: 300px;
} }
:deep.upload-tip .el-form-item__label { :deep.upload-tip .el-form-item__label {
color: transparent; color: transparent;
} }
.el-pagination { .el-pagination {
justify-content: flex-end; justify-content: flex-end;
padding: 5px 0; padding: 5px 0;
} }
:deep.el-pagination.is-background .el-pager li.is-active { :deep.el-pagination.is-background .el-pager li.is-active {
background-color: #3cb4a6; background-color: #3cb4a6;
} }
:deep.el-form--inline .el-form-item { :deep.el-form--inline .el-form-item {
margin-right: 6px; margin-right: 6px;
width: 95%; width: 95%;
} }
.img-list { .img-list {
display: flex; display: flex;
align-items: center; align-items: center;
.img-items { .img-items {
width: 120px; width: 120px;
height: 120px; height: 120px;
margin-right: 8px; margin-right: 8px;
position: relative; position: relative;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.mask-img { .mask-img {
visibility: hidden; visibility: hidden;
position: absolute; position: absolute;
@ -493,6 +745,7 @@ onMounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.delete-icon { .delete-icon {
font-size: 20px; font-size: 20px;
cursor: pointer; cursor: pointer;
@ -501,12 +754,15 @@ onMounted(() => {
} }
} }
} }
.img-items:hover .mask-img { .img-items:hover .mask-img {
visibility: visible; visibility: visible;
} }
} }
.app-container-content { .app-container-content {
padding: 20px; padding: 20px;
:deep(.el-dialog) { :deep(.el-dialog) {
display: flex !important; display: flex !important;
flex-direction: column !important; flex-direction: column !important;
@ -516,16 +772,36 @@ onMounted(() => {
left: 50% !important; left: 50% !important;
transform: translate(-50%, -50%) !important; transform: translate(-50%, -50%) !important;
max-height: 100vh !important; max-height: 100vh !important;
.el-dialog__body { .el-dialog__body {
flex: 1; flex: 1;
overflow-y: scroll !important; overflow-y: scroll !important;
} }
.dialog-content { .dialog-content {
padding: 20px; padding: 20px;
} }
} }
} }
:deep(.el-overlay) { :deep(.el-overlay) {
z-index: 99 !important; z-index: 99 !important;
} }
:deep .el-button--danger {
color: #FFF;
background-color: #FF5129;
border-color: #FF5129;
}
:deep .el-button--text {
font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 14px;
color: #2CBAB2;
line-height: 22px;
text-align: left;
font-style: normal;
text-transform: none;
}
</style> </style>