质检管理功能开发

This commit is contained in:
BianLzhaoMin 2024-12-09 17:21:46 +08:00
parent acc00f3887
commit 0277edbe2d
5 changed files with 687 additions and 2 deletions

4
env/.env.dev vendored
View File

@ -8,9 +8,9 @@ VITE_API_URL = '/proxyApi'
# VITE_proxyTarget = 'http://10.40.92.74:8080' #盛旭
# VITE_proxyTarget = 'http://192.168.2.246:28080' # 马帅
# VITE_proxyTarget = 'http://192.168.2.127:28080' # 梁超
VITE_proxyTarget = 'http://192.168.2.127:28080' # 梁超
# VITE_proxyTarget = 'http://36.33.26.201:17788/proxyApi' # 测试服务
VITE_proxyTarget = 'http://192.168.0.244:28580' # 测试服务
# VITE_proxyTarget = 'http://192.168.0.244:28580' # 测试服务
# VITE_proxyTarget = 'http://192.168.2.129:18080' # 马帅j
# VITE_proxyTarget = 'http://10.40.92.185:9206' # 赵福海 ( 设备类型)

View File

@ -0,0 +1,22 @@
import { get, post } from '../../index'
// 获取关联装备
export const getAssociationListApi = (data: any = {}) => {
return get('/material-mall/dev/associationList', data)
}
// 新增质检数据
export const addQualityDataApi = (data: any = {}) => {
return post('/material-mall/ma_qc/add', data)
}
// 获取质检列表
export const getQualityListApi = (data: any = {}) => {
return get('/material-mall/ma_qc/list', data)
}
// 获取质检列表 -- 详情
export const getQualityDetailsApi = (data: any = {}) => {
return get('/material-mall/ma_qc/qcList', data)
}
// 获取质检列表 -- 详情
export const qualityDeleteByIdApi = (data: any = {}) => {
return post('/material-mall/ma_qc/deleteById', data)
}

View File

@ -257,6 +257,17 @@ const routes: Array<RouteRecordRaw> = [
isLogin: true
},
},
{
path: '/quality-manage',
name: 'quality-manage',
component: () => import('views/user/lessor/quality-manage/index.vue'),
meta: {
title: '质检管理',
keepAlive: true,
AuthFlag: false,
isLogin: true
},
},
{
path: '/sourcingNeed',
name: 'sourcingNeed',

View File

@ -68,6 +68,7 @@ const allList = [
{ title: '接单管理', name: 'accept-orders', permission: ['1'] },
{ title: '退租管理', name: 'rent-termination', permission: ['1'] },
{ title: '结算管理', name: 'settlement-manage', permission: ['1'] },
{ title: '质检管理', name: 'quality-manage', permission: ['1'] },
{ title: '需求管理', name: 'sourcingNeed', permission: ['2'] },
{ title: '订单管理', name: 'orderManagement', permission: ['2'] },
]

View File

@ -0,0 +1,651 @@
<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="deviceCode">
<el-input
clearable
style="width: 100%"
placeholder="请输入装备编码"
v-model="searchParams.deviceCode"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item prop="">
<el-input clearable style="width: 100%" placeholder="请输入质检次数" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item prop="leaseStatus">
<el-date-picker
v-model="qcTime"
type="daterange"
style="width: 100%"
range-separator="-"
value-format="YYYY-MM-DD"
start-placeholder="最新质检开始日期"
end-placeholder="最新质检结束日期"
/>
</el-form-item>
</el-col>
<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-item>
<el-button @click="getLeaseListData" type="primary" class="primary-lease"
>查询</el-button
>
<el-button @click="onReset" type="primary" class="primary-lease">重置</el-button>
<el-button
@click="
() => {
isRepublish = true
dialogTitle = '质检新增'
addOrEditDialogVisible = true
}
"
type="primary"
class="primary-lease"
>
新建
</el-button>
</el-form-item>
</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="qcTime" label="最新质检日期" />
<el-table-column align="center" prop="createBy" label="上传人" width="120" />
<el-table-column align="center" prop="createTime" 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.id, 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="dialogTitle == '质检新增' ? '40%' : '60%'"
align-center
@close="onClose"
destroy-on-close
:title="dialogTitle"
v-model="addOrEditDialogVisible"
>
<template v-if="dialogTitle == '质检新增'">
<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"
>
<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="质检名称" prop="qcName">
<el-input
v-model="addOrEditForm.qcName"
placeholder="请输入质检名称"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="质检员" prop="qcUser">
<el-input
clearable
placeholder="请输入质检员"
v-model="addOrEditForm.qcUser"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="质检日期" prop="qcTime">
<el-date-picker
clearable
type="date"
style="width: 100%"
value-format="YYYY-MM-DD"
v-model="addOrEditForm.qcTime"
placeholder="请选择质检日期"
/>
</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">
<UploadComponentNew
:maxSize="2"
:max-limit="1"
width="100px"
height="100px"
:multiple="true"
:autoUpload="true"
:minLimit="addOrEditForm.fileInfoList.length"
:actionUrl="uploadUrl"
listType="picture-card"
@onFileChange="onFileChange"
:acceptTypeList="['.jpg', '.png']"
>
<template v-slot:default>
<el-icon size="48" color="#aaa"><Plus /></el-icon>
</template>
</UploadComponentNew>
</el-form-item>
</el-col>
</el-row>
</el-form>
</template>
<template #footer v-if="dialogTitle == '质检新增'">
<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>
<template v-if="dialogTitle == '质检记录'">
<el-row style="padding-bottom: 20px">
<el-col :span="6">
<span> 装备编号 </span>
<span>{{ qualityDetails.deviceCode }}</span>
</el-col>
<el-col :span="6">
<span> 装备名称 </span>
<span>{{ qualityDetails.deviceName }}</span>
</el-col>
</el-row>
<el-form
:inline="true"
size="default"
label-width="0"
ref="searchFormRefInDialog"
:model="searchParamsInDialog"
>
<el-row>
<el-col :span="6">
<el-form-item prop="qcCode">
<el-input
clearable
style="width: 100%"
placeholder="请输入质检编码"
v-model="searchParamsInDialog.qcCode"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-date-picker
v-model="qcTime_1"
type="daterange"
style="width: 100%"
range-separator="-"
value-format="YYYY-MM-DD"
start-placeholder="质检开始日期"
end-placeholder="质检结束日期"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-date-picker
v-model="createTime_1"
type="daterange"
style="width: 100%"
range-separator="-"
value-format="YYYY-MM-DD"
start-placeholder="上传开始日期"
end-placeholder="上传结束日期"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-button
@click="getLeaseListDataInDialog"
type="primary"
class="primary-lease"
>查询</el-button
>
<el-button
@click="onResetInDialog"
type="primary"
class="primary-lease"
>重置</el-button
>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table
border
:data="qualityDetailsList"
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="qcCode" label="维修保养编码" />
<el-table-column align="center" prop="qcName" label="维修保养名称" />
<el-table-column align="center" prop="qcTime" label="维修保养日期" />
<el-table-column align="center" prop="createBy" label="上传人" width="120" />
<el-table-column align="center" prop="createTime" label="上传时间" />
<el-table-column align="center" label="附件">
<template #default="{ row }">
<el-image
style="width: 60px; height: 60px"
:src="row.url"
:zoom-rate="1.2"
:max-scale="7"
:min-scale="0.2"
:preview-src-list="[row.url]"
:initial-index="0"
fit="cover"
:z-index="9999999999"
:preview-teleported="true"
/>
</template>
</el-table-column>
</el-table>
<PagingComponent
:total="totalInDialog"
:size="searchParamsInDialog.pageSize"
:page="searchParamsInDialog.pageNum"
@getListChange="getLeaseListDataInDialog"
v-model:page-num="searchParamsInDialog.pageNum"
v-model:page-size="searchParamsInDialog.pageSize"
/>
</template>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import PagingComponent from 'components/PagingComponent/index.vue'
import UploadComponentNew from 'components/uploadComponentNew/index.vue'
import {
addQualityDataApi,
getQualityListApi,
getQualityDetailsApi,
qualityDeleteByIdApi,
getAssociationListApi,
} from 'http/api/quality-manage'
import { InfoFilled } from '@element-plus/icons-vue'
import { ElMessage } from 'element-plus'
const total = ref(0)
const totalInDialog = ref(0)
const qcTime = ref([])
const createTime = ref([])
const qcTime_1 = ref([])
const createTime_1 = ref([])
const isRepublish = ref(true)
const qualityLis = ref<any>([])
const dialogTitle = ref('新增')
const searchFormRef = ref<any>(null)
const searchFormRefInDialog = ref<any>(null)
const addOrEditFormRef = ref<any>(null)
const addOrEditDialogVisible = ref(false)
const associationList = ref<any>([])
const qualityDetailsList = ref<any>([])
const qualityDetails = ref<any>({})
const uploadUrl = import.meta.env.VITE_API_URL + '/file/upload'
const searchParams = reactive({
deviceCode: '',
qcStartTime: '',
qcEndTime: '',
createStartTime: '',
createEndTime: '',
pageSize: 10,
pageNum: 1,
})
const searchParamsInDialog = reactive({
id: '',
qcCode: '',
qcStartTime: '',
qcEndTime: '',
createStartTime: '',
createEndTime: '',
pageSize: 10,
pageNum: 1,
})
const addOrEditForm = ref<any>({
maId: '',
qcName: '',
qcUser: '',
qcTime: '',
fileInfoList: [],
fileInfoTempList: [],
})
const addOrEditFormRules = reactive({
maId: [{ required: true, message: '请选择关联装备', trigger: 'change' }],
qcName: [{ required: true, message: '请输入质检名称', trigger: 'blur' }],
qcUser: [{ required: true, message: '请输入质检员', trigger: 'change' }],
qcTime: [{ required: true, message: '请选择质检日期', trigger: 'change' }],
fileInfoList: [{ required: true, message: '请上传质检附件', trigger: 'blur' }],
})
const disabledDate = (date: any) => {
const today = new Date()
//
return date.getTime() < today.getTime()
}
//
const getLeaseListData = async () => {
if (qcTime.value.length > 0) {
searchParams.qcStartTime = qcTime.value[0]
searchParams.qcEndTime = qcTime.value[1]
}
if (createTime.value.length > 0) {
searchParams.createStartTime = createTime.value[0]
searchParams.createEndTime = createTime.value[1]
}
const { data: res }: any = await getQualityListApi(searchParams)
qualityLis.value = res.rows
total.value = res.total
}
//
const getAssociationListData = async () => {
const res: any = await getAssociationListApi()
associationList.value = res.data
}
//
const onReset = () => {
qcTime.value = []
createTime.value = []
searchParams.qcStartTime = ''
searchParams.qcEndTime = ''
searchParams.createStartTime = ''
searchParams.createEndTime = ''
searchParams.pageNum = 1
searchParams.pageSize = 10
searchFormRef.value.resetFields()
getLeaseListData()
}
const onResetInDialog = () => {
qcTime_1.value = []
createTime_1.value = []
searchParamsInDialog.qcStartTime = ''
searchParamsInDialog.qcEndTime = ''
searchParamsInDialog.createStartTime = ''
searchParamsInDialog.createEndTime = ''
searchParamsInDialog.pageNum = 1
searchParamsInDialog.pageSize = 10
searchFormRefInDialog.value.resetFields()
getLeaseListDataInDialog()
}
//
const onDelete = async (id: any, maId: any) => {
const res: any = await qualityDeleteByIdApi({ id, 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 res: any = await addQualityDataApi(addOrEditForm.value)
if (res.code === 200) {
ElMessage({
type: 'success',
message: '提交成功',
})
addOrEditDialogVisible.value = false
getLeaseListData()
}
}
})
}
//
const onViewQualityRecord = (row: any) => {
qualityDetails.value = row
searchParamsInDialog.id = row.id
getLeaseListDataInDialog()
dialogTitle.value = '质检记录'
addOrEditDialogVisible.value = true
}
const getLeaseListDataInDialog = async () => {
if (qcTime_1.value.length > 0) {
searchParamsInDialog.qcStartTime = qcTime.value[0]
searchParamsInDialog.qcEndTime = qcTime.value[1]
}
if (createTime_1.value.length > 0) {
searchParamsInDialog.createStartTime = createTime.value[0]
searchParamsInDialog.createEndTime = createTime.value[1]
}
const { data: res }: any = await getQualityDetailsApi(searchParamsInDialog)
qualityDetailsList.value = res.rows
}
//
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 = () => {
if (dialogTitle.value !== '质检记录') {
addOrEditFormRef.value.resetFields()
}
}
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>