mt-fe-group/yudao-dev
12
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update 保养记录

Browse Source
This commit is contained in:
lb 2024-02-04 16:30:14 +08:00
parent 71aab2df9a
commit d0a4dc527f
3 changed files with 663 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/mixins/lb/basicPageMixin.js
View File

@ -138,7 +138,7 @@ export default {
}
},
handleEmitFun(val) {
console.log('emit unf', val);
console.log('[basicPageMixin handleEmitFun]', val);
switch (val.action) {
// 查看详情
case 'show-detail':

421
src/views/specialEquipment/maintain/Record--detail.vue Normal file
View File

@ -0,0 +1,421 @@
<!--
filename: PlanConfig--addContent.vue
author: liubin
date: 2024-02-04 09:40:04
description:
-->
<template>
<el-drawer
:visible="visible"
:show-close="false"
:wrapper-closable="false"
class="drawer"
custom-class="mes-drawer"
size="60%"
@closed="$emit('destroy')">
<SmallTitle slot="title">
{{
mode.includes('detail')
? '详情'
: mode.includes('edit')
? '编辑'
: '新增'
}}
</SmallTitle>
<div class="drawer-body flex">
<div class="drawer-body__content">
<section>
<SmallTitle>保养信息</SmallTitle>
<div class="form-part" style="margin-bottom: 32px">
<el-skeleton v-if="!showForm" animated />
<el-form
v-else
ref="form"
:model="form"
label-position="top"
v-loading="formLoading">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="计划保养人员" prop="planMaintainWorker">
<span>{{ form.planMaintainWorker }}</span>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="实际保养人员" prop="maintainWorker">
<span>{{ form.maintainWorker }}</span>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</section>
<section>
<SmallTitle>保养详情</SmallTitle>
<div style="margin-top: 12px; position: relative">
<!-- <div
v-if="!mode.includes('detail')"
style="position: absolute; top: -40px; right: 0">
<el-button @click="handleAddDetail" type="text">
<i class="el-icon-plus"></i>
添加详情
</el-button>
</div> -->
<base-table
v-loading="detailLoading"
:table-props="detailTableProps"
:page="detailTableQuery.pageNo || 1"
:limit="detailTableQuery.pageSize || 10"
:table-data="detailList"
@emitFun="handleDetailTableAction">
<!-- <method-btn
slot="handleBtn"
label="操作"
width="100"
:method-list="detailTableBtns"
@clickBtn="handleDetailTableBtnClicked" /> -->
</base-table>
<!-- 分页组件 -->
<pagination
v-show="detailTotal > 0"
:total="detailTotal"
:page.sync="detailTableQuery.pageNo"
:limit.sync="detailTableQuery.pageSize"
@pagination="refreshDetailList" />
</div>
</section>
</div>
</div>
<div class="drawer-body__footer">
<el-button style="" @click="cancel">取消</el-button>
<el-button v-if="mode == 'detail'" type="primary" @click="toggleEdit">
编辑
</el-button>
<el-button v-else type="primary" @click="confirm">保存</el-button>
</div>
<!-- 属性对话框 -->
<base-dialog
dialogTitle="保养详情"
:dialogVisible="detailAddVisible"
width="35%"
:append-to-body="true"
custom-class="baseDialog"
@close="closeDetailForm"
@cancel="closeDetailForm"
@confirm="submitDetailForm">
<DialogForm
v-if="detailAddVisible"
ref="detailForm"
v-model="detailForm"
:rows="detailRows" />
</base-dialog>
</el-drawer>
</template>
<script>
import DialogForm from '@/components/DialogForm';
const SmallTitle = {
name: 'SmallTitle',
props: ['size'],
components: {},
data() {
return {};
},
methods: {},
render: function (h) {
return h(
'span',
{
class: 'small-title',
style: {
fontSize: '18px',
lineHeight:
this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px',
fontWeight: 500,
fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif',
},
},
this.$slots.default
);
},
};
export default {
name: 'PlanConfig--addContent',
components: { SmallTitle, DialogForm },
props: ['maintainData'],
data() {
return {
visible: false,
mode: 'edit',
showForm: false,
form: {
id: null,
maintainWorker: null,
planMaintainWorker: null,
},
formLoading: false,
equipmentOptions: [],
detailList: [],
detailAddVisible: false,
detailPageProps: ['equipmentName', 'program'],
detailForm: {
planId: null,
equipmentId: null,
program: '',
maintenanceDes: '',
remark: '',
},
detailRows: [
[
{
select: true,
label: '设备',
prop: 'equipmentId',
options: [],
rules: [
{ required: true, message: '设备不能为空', trigger: 'blur' },
],
},
],
[
{
input: true,
label: '保养项目',
prop: 'program',
rules: [
{ required: true, message: '保养项目不能为空', trigger: 'blur' },
],
},
],
[
{
input: true,
label: '保养描述',
prop: 'maintenanceDes',
rules: [
{ required: true, message: '包养描述不能为空', trigger: 'blur' },
],
},
],
],
detailLoading: false,
detailTableProps: [
{ prop: 'equipmentName', label: '设备名称' },
{ prop: 'program', label: '保养项目' },
{ prop: 'remark', label: '备注' },
],
detailTableQuery: {
pageNo: 1,
pageSize: 10,
},
detailTableBtns: [
{
type: 'edit',
btnName: '编辑',
},
{
type: 'delete',
btnName: '删除',
},
],
detailTotal: 0,
detailList: [],
equipmentList: [],
};
},
computed: {},
mounted() {
this.loadEquipments();
},
methods: {
show({ planMaintainWorker, id, maintainWorker }) {
this.form = Object.assign(
{},
{
planMaintainWorker,
id,
maintainWorker,
}
);
this.$nextTick(() => {
this.refreshDetailList();
});
this.visible = true;
this.showForm = true;
},
cancel() {
this.visible = false;
setTimeout(() => {
this.$emit('closed');
}, 500);
},
confirm() {
this.cancel();
},
toggleEdit() {
this.mode == 'edit' ? 'detail' : 'edit';
},
async loadEquipments() {
// TODO: 很有可能此处要改成动态刷新/获取/加载设备列表，当总的特殊设备数量大于100的时候...
const res = await this.$axios('/base/core-equipment/page', {
params: {
pageNo: 1,
pageSize: 100,
special: true,
},
});
this.equipmentList = res.data?.list || [];
this.detailRows[0][0].options = (res.data?.list || []).map((item) => ({
label: item.name,
value: item.id,
}));
},
closeDetailForm() {
this.detailAddVisible = false;
},
async submitDetailForm() {
// validation
this.$refs.detailForm.validate(async (valid) => {
if (!valid) return;
const res = await this.$axios[this.detailForm.id ? 'put' : 'post'](
`/base/equipment-maintain-plan-det/${
this.detailForm.id ? 'update' : 'create'
}`,
{
...this.detailForm,
planId: this.form.id,
}
);
if (res.code == 0) {
this.detailAddVisible = false;
this.$message.success('添加成功');
this.refreshDetailList();
} else {
this.detailAddVisible = false;
this.$message.error('出错');
}
});
},
async refreshDetailList() {
this.detailLoading = true;
if (!this.form.id)
return this.$message.info('没有找到保养计划相关信息...');
const res = await this.$axios('/base/equipment-maintain-plan-det/page', {
params: {
pageNo: this.detailTableQuery.pageNo,
pageSize: this.detailTableQuery.pageSize,
planId: this.form.id,
},
});
this.detailList = res.data?.list || [];
this.detailTotal = res.data?.total || 0;
this.detailLoading = false;
},
//
handleDetailTableAction() {},
handleDetailTableBtnClicked({ data, type }) {
switch (type) {
case 'edit':
const { id, equipmentId, planId, program, maintenanceDes, remark } =
data;
this.detailAddVisible = true;
this.$nextTick(() => {
this.detailForm = Object.assign(
{},
{
id,
equipmentId,
planId,
program,
maintenanceDes,
remark,
}
);
});
break;
case 'delete':
if (!data.id) return;
this.$confirm('确认移除该详情吗？', '提示', {
confirmButtonText: '确 认',
cancelButtonText: '取 消',
})
.then(async () => {
const res = await this.$axios.delete(
'/base/equipment-maintain-plan-det/delete',
{
params: {
id: data.id,
},
}
);
if (res.code == 0) {
this.$message.success('删除成功!');
this.refreshDetailList();
}
})
.catch(console.error);
break;
case 'detail':
this.handleDetail(data);
break;
default:
this.handleTableActions({ data, type });
}
},
handleAddDetail() {
this.detailAddVisible = true;
},
},
};
</script>
<style scoped>
.drawer >>> .el-drawer {
border-radius: 8px 0 0 8px;
}
.drawer >>> .el-drawer__header {
margin: 0;
padding: 32px 32px 24px;
border-bottom: 1px solid #dcdfe6;
margin-bottom: 0px;
}
.small-title::before {
content: '';
display: inline-block;
vertical-align: top;
width: 4px;
height: 22px;
border-radius: 1px;
margin-right: 8px;
background-color: #0b58ff;
}
.drawer-body {
display: flex;
flex-direction: column;
height: calc(100% - 72px);
}
.drawer-body__content {
flex: 1;
/* background: #eee; */
padding: 20px 30px;
overflow-y: auto;
}
.drawer-body__footer {
display: flex;
justify-content: flex-end;
padding: 18px;
}
</style>

377
src/views/specialEquipment/maintain/Record.vue
View File

@ -11,7 +11,6 @@
<SearchBar
:formConfigs="searchBarFormConfig"
ref="search-bar"
:is-fold="true"
@select-changed="handleSearchBarChange"
@headBtnClick="handleSearchBarBtnClick" />
@ -22,13 +21,13 @@
:limit="queryParams.pageSize"
:table-data="list"
@emitFun="handleEmitFun">
<method-btn
<!-- <method-btn
v-if="tableBtn.length"
slot="handleBtn"
label="操作"
:width="120"
:method-list="tableBtn"
@clickBtn="handleTableBtnClick" />
@clickBtn="handleTableBtnClick" /> -->
</base-table>
<!-- 分页组件 -->
@ -60,6 +59,11 @@
</el-col>
</el-row>
</base-dialog>
<RecordDetail
v-if="recordDetailVisible"
ref="recordDetailDrawer"
@closed="recordDetailVisible = false" />
</div>
</template>
@ -72,21 +76,47 @@ import {
deleteEqMaintainLog,
exportMaintainLogExcel,
} from '@/api/equipment/base/maintain/record';
import RecordDetail from './Record--detail.vue';
const timeFilter = (val) => moment(val).format('yyyy-MM-DD HH:mm:ss');
const btn = {
name: 'tableBtn',
props: ['injectData'],
data() {
return {};
},
methods: {
handleClick() {
this.$emit('emitData', {
action: this.injectData.label,
value: this.injectData,
});
},
},
render: function (h) {
return (
<el-button type="text" onClick={this.handleClick}>
{this.injectData.name}
</el-button>
);
},
};
export default {
name: 'SpecialEquipmentMaintainRecord',
components: { DialogForm },
components: { DialogForm, RecordDetail },
mixins: [basicPageMixin],
data() {
return {
recordDetailVisible: false,
searchBarKeys: [
'maintainPlanId',
'startTime',
'relatePlan',
'equipmentId',
'specialType',
'special',
// 'relatePlan',
// 'equipmentId',
// 'specialType',
],
tableBtn: [
this.$auth.hasPermi('equipment:maintain-record:update')
@ -122,99 +152,146 @@ export default {
width: 110,
showOverflowtooltip: true,
},
{
prop: 'planName',
label: '保养计划名称',
width: 110,
showOverflowtooltip: true,
},
{
prop: 'departmentName',
label: '部门',
width: 110,
showOverflowtooltip: true,
},
{
prop: 'lineName',
label: '产线名',
width: 110,
showOverflowtooltip: true,
},
{
prop: 'planStartTime',
label: '计划开始时间',
filter: timeFilter,
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: 'planEndTime',
label: '计划结束时间',
filter: timeFilter,
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: 'startTime',
label: '开始时间',
label: '实际开始时间',
filter: timeFilter,
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: 'endTime',
label: '结束时间',
label: '实际结束时间',
filter: timeFilter,
minWidth: 150,
showOverflowtooltip: true,
},
{
prop: 'equipmentCategory',
label: '设备大类',
prop: 'relatePlan',
label: '保养计划类型',
minWidth: 100,
showOverflowtooltip: true,
filter: (val) =>
val != null ? ['-', '安全设备', '消防设备', '特种设备'][val] : '-',
val != null ? ['-', '计划型', '非计划型'][val] : '-',
},
{
prop: 'equipmentName',
label: '设备名称',
minWidth: 100,
showOverflowtooltip: true,
},
{
prop: 'maintainWorker',
label: '保养人员',
minWidth: 100,
showOverflowtooltip: true,
},
{
prop: 'relatePlan',
label: '是否计划保养',
width: 120,
filter: (v) => (v != null ? ['', '是', '否'][v] : ''),
},
{
prop: 'planName',
label: '保养计划名称',
minWidth: 120,
showOverflowtooltip: true,
},
{
prop: 'maintainDuration',
label: '计划保养用时(h)',
minWidth: 130,
showOverflowtooltip: true,
},
{ prop: 'timeUsed', label: '实际保养用时(h)', minWidth: 130 },
{
prop: 'remark',
label: '备注',
minWidth: 100,
showOverflowtooltip: true,
prop: '_detail',
label: '详情',
name: '详情',
minWidth: 60,
subcomponent: btn,
},
// {
// prop: 'equipmentCategory',
// label: '设备大类',
// minWidth: 100,
// showOverflowtooltip: true,
// filter: (val) =>
// val != null ? ['-', '安全设备', '消防设备', '特种设备'][val] : '-',
// },
// {
// prop: 'equipmentName',
// label: '设备名称',
// minWidth: 100,
// showOverflowtooltip: true,
// },
// {
// prop: 'maintainWorker',
// label: '保养人员',
// minWidth: 100,
// showOverflowtooltip: true,
// },
// {
// prop: 'relatePlan',
// label: '是否计划保养',
// width: 120,
// filter: (v) => (v != null ? ['', '是', '否'][v] : ''),
// },
// {
// prop: 'planName',
// label: '保养计划名称',
// minWidth: 120,
// showOverflowtooltip: true,
// },
// {
// prop: 'maintainDuration',
// label: '计划保养用时(h)',
// minWidth: 130,
// showOverflowtooltip: true,
// },
// { prop: 'timeUsed', label: '实际保养用时(h)', minWidth: 130 },
// {
// prop: 'remark',
// label: '备注',
// minWidth: 100,
// showOverflowtooltip: true,
// },
],
searchBarFormConfig: [
// {
// type: 'select',
// label: '设备大类',
// placeholder: '请选择设备大类',
// param: 'specialType',
// onchange: true,
// selectOptions: [
// { id: 1, name: '安全设备' },
// { id: 2, name: '消防设备' },
// { id: 3, name: '特种设备' },
// ],
// filterable: true,
// defaultSelect: null
// },
// {
// type: 'select',
// label: '设备',
// placeholder: '请选择设备',
// param: 'equipmentId',
// defaultSelect: null
// },
{
type: 'select',
label: '设备大类',
placeholder: '请选择设备大类',
param: 'specialType',
onchange: true,
selectOptions: [
{ id: 1, name: '安全设备' },
{ id: 2, name: '消防设备' },
{ id: 3, name: '特种设备' },
],
filterable: true,
defaultSelect: null
},
{
type: 'select',
label: '设备',
placeholder: '请选择设备',
param: 'equipmentId',
defaultSelect: null
},
{
type: 'select',
label: '计划名称',
placeholder: '请选择计划名称',
label: '保养计划名称',
placeholder: '请选择保养计划名称',
param: 'maintainPlanId',
defaultSelect: null
defaultSelect: null,
},
// 开始结束时间
{
type: 'datePicker',
label: '保养开始时间',
label: '实际开始时间',
dateType: 'daterange', // datetimerange
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd HH:mm:ss',
@ -223,19 +300,19 @@ export default {
endPlaceholder: '结束日期',
defaultTime: ['00:00:00', '23:59:59'],
param: 'startTime',
defaultSelect: null
defaultSelect: null,
// width: 350,
},
{
type: 'select',
label: '是否计划保养',
selectOptions: [
{ name: '是', id: 1 },
{ name: '否', id: 2 },
],
defaultSelect: null,
param: 'relatePlan',
},
// {
// type: 'select',
// label: '是否计划保养',
// selectOptions: [
// { name: '是', id: 1 },
// { name: '否', id: 2 },
// ],
// defaultSelect: null,
// param: 'relatePlan',
// },
{
type: 'button',
btnName: '查询',
@ -254,15 +331,15 @@ export default {
plain: true,
color: 'primary',
},
{
type: this.$auth.hasPermi('equipment:maintain-record:create')
? 'button'
: '',
btnName: '新增',
name: 'add',
plain: true,
color: 'success',
},
// {
// type: this.$auth.hasPermi('equipment:maintain-record:create')
// ? 'button'
// : '',
// btnName: '新增',
// name: 'add',
// plain: true,
// color: 'success',
// },
],
rows: [
[
@ -422,12 +499,11 @@ export default {
pageNo: 1,
pageSize: 10,
maintainPlanId: null,
maintainPlanId: null,
startTime: null,
relatePlan: null,
equipmentId: null,
// relatePlan: null,
// equipmentId: null,
special: true,
specialType: null,
// specialType: null,
},
// 表单参数
form: {},
@ -438,32 +514,47 @@ export default {
},
created() {
this.initSearchBar();
if (this.$route.query) {
this.queryParams.specialType =
this.$route.query?.specialType ?? undefined;
this.queryParams.equipmentId =
this.$route.query?.equipmentId ?? undefined;
this.queryParams.maintainPlanId =
this.$route.query?.maintainPlanId ?? undefined;
this.queryParams.relatePlan = this.$route.query?.relatePlan ?? undefined;
this.queryParams.startTime = this.$route.query?.createTime ?? undefined;
this.searchBarFormConfig[0].defaultSelect =
this.$route.query.specialType ?? undefined;
this.searchBarFormConfig[1].defaultSelect =
this.$route.query.equipmentId ?? undefined;
this.searchBarFormConfig[2].defaultSelect =
this.$route.query.maintainPlanId ?? undefined;
this.searchBarFormConfig[3].defaultSelect =
this.$route.query?.createTime ?? undefined;
this.searchBarFormConfig[4].defaultSelect =
Number(this.$route.query.relatePlan) ?? undefined;
}
// if (this.$route.query) {
// this.queryParams.specialType =
// this.$route.query?.specialType ?? undefined;
// this.queryParams.equipmentId =
// this.$route.query?.equipmentId ?? undefined;
// this.queryParams.maintainPlanId =
// this.$route.query?.maintainPlanId ?? undefined;
// this.queryParams.relatePlan = this.$route.query?.relatePlan ?? undefined;
// this.queryParams.startTime = this.$route.query?.createTime ?? undefined;
// this.searchBarFormConfig[0].defaultSelect =
// this.$route.query.specialType ?? undefined;
// this.searchBarFormConfig[1].defaultSelect =
// this.$route.query.equipmentId ?? undefined;
// this.searchBarFormConfig[2].defaultSelect =
// this.$route.query.maintainPlanId ?? undefined;
// this.searchBarFormConfig[3].defaultSelect =
// this.$route.query?.createTime ?? undefined;
// this.searchBarFormConfig[4].defaultSelect =
// Number(this.$route.query.relatePlan) ?? undefined;
// }
this.getList();
if (this.$route.query.addRecord) {
this.handleAdd();
}
// if (this.$route.query.addRecord) {
// this.handleAdd();
// }
},
methods: {
handleEmitFun({ action, value }) {
switch (action) {
case '详情':
this.recordDetailVisible = true;
this.$nextTick(() => {
this.$refs.recordDetailDrawer.show({
id: value.id,
planMaintainWorker: value.planMaintainWorker,
maintainWorker: value.maintainWorker,
});
});
break;
}
},
handleSearchBarChange({ param, value }) {
if ('specialType' === param) {
if (!value) {
@ -475,28 +566,29 @@ export default {
);
}
},
setSearchBarEquipmentList(eqList) {
this.$set(
this.searchBarFormConfig[1],
'selectOptions',
eqList.map((item) => ({
name: item.name,
id: item.id,
}))
);
},
// setSearchBarEquipmentList(eqList) {
// this.$set(
// this.searchBarFormConfig[1],
// 'selectOptions',
// eqList.map((item) => ({
// name: item.name,
// id: item.id,
// }))
// );
// },
initSearchBar() {
this.http('/base/core-equipment/listAll', 'get').then(({ data }) => {
this.allSpecialEquipments = data.filter((item) => item.special);
this.setSearchBarEquipmentList(data.filter((item) => item.special));
});
// this.http('/base/core-equipment/listAll', 'get').then(({ data }) => {
// this.allSpecialEquipments = data.filter((item) => item.special);
// this.setSearchBarEquipmentList(data.filter((item) => item.special));
// });
this.http('/base/equipment-maintain-plan/page', 'get', {
pageNo: 1,
pageSize: 100,
special: true,
}).then(({ data }) => {
this.$set(
this.searchBarFormConfig[2],
this.searchBarFormConfig[0],
// this.searchBarFormConfig[2],
'selectOptions',
(data?.list || []).map((item) => ({
name: item.name,
@ -509,8 +601,21 @@ export default {
getList() {
this.loading = true;
// 执行查询
this.recv(this.queryParams).then((response) => {
this.list = response.data.list;
this.recv({ ...this.queryParams, special: true }).then((response) => {
this.list = [
{
id: 213,
maintainOrderNumber: 123,
planName: 'hhh',
departmentName: 'asdf',
lineName: 456,
planStartTime: '2024-01-01',
planEndTime: '2024-01-01',
startTime: '2024-01-01',
endTime: '2024-01-01',
relatePlan: 1,
},
]; // response.data.list;
this.total = response.data.total;
this.loading = false;
});