'init'
This commit is contained in:
114
src/views/EquipmentManager/Analysis/EditForm.vue
Normal file
114
src/views/EquipmentManager/Analysis/EditForm.vue
Normal file
@@ -0,0 +1,114 @@
|
||||
<!--
|
||||
* @Date: 2021-01-11 09:24:41
|
||||
* @LastEditors: guo
|
||||
* @LastEditTime: 2021-02-25 16:04:49
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\StatusSetting\EditForm.vue
|
||||
* @Description: 子页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" title="修改设备状态" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="120px">
|
||||
<el-form-item label="设备状态" prop="status">
|
||||
<el-select v-model="formData.status" placeholder="请选择下拉选择设备状态" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in statusOptions"
|
||||
:key="index"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editStatusSetting } from '@/api/equipment/index'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
status: undefined,
|
||||
oldStatus: null,
|
||||
id: null
|
||||
},
|
||||
rules: {
|
||||
status: [{
|
||||
required: true,
|
||||
message: '请选择下拉选择设备状态',
|
||||
trigger: 'change'
|
||||
}]
|
||||
},
|
||||
statusOptions: [{
|
||||
'label': 'productive',
|
||||
'value': 0
|
||||
}, {
|
||||
'label': 'standby',
|
||||
'value': 1
|
||||
}, {
|
||||
'label': 'unscheduled downtime',
|
||||
'value': 2
|
||||
}, {
|
||||
'label': 'scheduled downtime',
|
||||
'value': 3
|
||||
}, {
|
||||
'label': 'engineering',
|
||||
'value': 4
|
||||
}, {
|
||||
'label': 'non-scheduled',
|
||||
'value': 5
|
||||
}]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.id = this.targetInfo.id
|
||||
this.formData.oldStatus = this.targetInfo.status
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editStatusSetting({
|
||||
...this.formData,
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改状态成功!'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
156
src/views/EquipmentManager/Analysis/index.vue
Normal file
156
src/views/EquipmentManager/Analysis/index.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2022-07-25 10:32:06
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\Analysis\index.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="usermanager-container">
|
||||
<div class="method-btn-area">
|
||||
<el-input v-model="listQuery.keywords" placeholder="设备编码或名称" style="width: 200px;" clearable />
|
||||
<el-button type="primary" @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, status: curStatus}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const colorTable = {
|
||||
'0': 'rgb(155,187,89)',
|
||||
'1': 'rgb(255,255,0)',
|
||||
'2': 'rgb(192,80,77)',
|
||||
'3': 'rgb(247,150,70)',
|
||||
'4': 'rgb(79,129,189)',
|
||||
'5': 'rgb(0,0,0)'
|
||||
}
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'code',
|
||||
label: '设备编号',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: '设备名称',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'status',
|
||||
label: '设备类型',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'color',
|
||||
label: '车间',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'color',
|
||||
label: '工作时间累计',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'color',
|
||||
label: '维修次数',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'color',
|
||||
label: '保养次数',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: '备注',
|
||||
align: 'center'
|
||||
}]
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getStatusSettingList } from '@/api/equipment'
|
||||
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: {
|
||||
Pagination,
|
||||
BaseTable,
|
||||
MethodBtn,
|
||||
EditForm
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
curStatus: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
keywords: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
this.curStatus = raw.data.status
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
const res = await getStatusSettingList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records.map(item => {
|
||||
return {
|
||||
...item,
|
||||
color: colorTable[item.status]
|
||||
}
|
||||
}) : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.usermanager-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
160
src/views/EquipmentManager/BOMManager/AddForm.vue
Normal file
160
src/views/EquipmentManager/BOMManager/AddForm.vue
Normal file
@@ -0,0 +1,160 @@
|
||||
<!--
|
||||
* @Date: 2021-01-12 09:37:27
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-13 15:58:12
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\AddForm.vue
|
||||
* @Description: 物料BOM添加弹窗页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.bom.addDialogTitle')" class="dialog" width="45%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<el-row :gutter="20">
|
||||
<!-- 设备类型名称 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.equipmentName')" prop="equipmentTypeId">
|
||||
<el-select v-model="formData.equipmentTypeId" :placeholder="$t('module.equipmentManager.bom.placeholderequipmentName')" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 设备配方名称 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.name')" prop="name">
|
||||
<el-input v-model="formData.name" :placeholder="$t('module.equipmentManager.bom.name')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<!-- 设备配方编码 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.code')" prop="code">
|
||||
<el-input v-model="formData.code" :placeholder="$t('module.equipmentManager.bom.code')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 备注 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.bom.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 激活状态 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
<!-- :loading="waiting" -->
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addBOM } from '@/api/equipment/bom'
|
||||
import { getDictDeviceTypePage, getDictBom } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: [],
|
||||
data() {
|
||||
return {
|
||||
waiting: false,
|
||||
formData: {
|
||||
equipmentTypeId: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentTypeId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderEquipmentType'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
code: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
name: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
device: [],
|
||||
bom: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
// this.waiting = true
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) {
|
||||
// this.waiting = false
|
||||
return
|
||||
}
|
||||
this.dict.bom.map(item => {
|
||||
if (item.code === this.formData.code) {
|
||||
this.formData.name = item.name
|
||||
}
|
||||
})
|
||||
const result = await addBOM(this.formData)
|
||||
// this.waiting = false
|
||||
console.log(1)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDeviceTypePage({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const res = await getDictBom({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.bom = res
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
359
src/views/EquipmentManager/BOMManager/EditForm.vue
Normal file
359
src/views/EquipmentManager/BOMManager/EditForm.vue
Normal file
@@ -0,0 +1,359 @@
|
||||
<!--
|
||||
* @Date: 2021-01-12 09:37:27
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-14 16:42:29
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\EditForm.vue
|
||||
* @Description: 物料BOM编辑弹窗页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-drawer v-bind="$attrs" :title="readonly ? $t('module.equipmentManager.bom.detailDialogTitle') : $t('module.equipmentManager.bom.editDialogTitle')" :show-close="false" :wrapper-closable="true" class="drawer" size="60%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<span slot="title">
|
||||
<small-title :no-padding="true">
|
||||
<!-- {{ readonly ? 'btn.detail' : !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }} -->
|
||||
{{ readonly ? $t('module.equipmentManager.bom.detailDialogTitle') : $t('module.equipmentManager.bom.editDialogTitle') }}
|
||||
</small-title>
|
||||
</span>
|
||||
|
||||
<el-divider />
|
||||
<div class="content">
|
||||
<div class="visual-part">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-position="top">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.equipmentName')" prop="equipmentTypeId">
|
||||
<el-select v-model="formData.equipmentTypeId" :placeholder="$t('module.equipmentManager.bom.placeholderequipmentName')" clearable :style="{width: '100%'}" :disabled="readonly">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.name')" prop="name">
|
||||
<el-input v-model="formData.name" :placeholder="$t('module.equipmentManager.bom.name')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.code')" prop="code">
|
||||
<el-input v-model="formData.code" :placeholder="$t('module.equipmentManager.bom.code')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.bom.placeholderremark')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<template>
|
||||
<!-- <el-divider>{{ $t('module.equipmentManager.bomdetail.title') }}</el-divider> -->
|
||||
<!-- <div class="method-btn-area"> -->
|
||||
<!-- <el-button v-if="!readonly" type="primary" style="float: right;margin: 0 20px;" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button> -->
|
||||
<!-- <el-button style="float: right;" @click="resetForm">重置</el-button> -->
|
||||
<!-- </div> -->
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn v-if="!readonly" slot="handleBtn" :width="80" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page-sizes="[3, 5, 10, 20]"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</template>
|
||||
<add-form :visible.sync="showDialog" :target-info="{id: listQuery.id}" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, fatherId: listQuery.id}" @done="getList" />
|
||||
<div style="position: absolute; bottom: 24px; right: 24px;">
|
||||
<el-button v-if="!readonly" @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
<el-button v-if="readonly" type="primary" @click="close">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!readonly" type="primary" @click="handelConfirm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'materialCode',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.materialId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'materialName',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.materialName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'unit',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.unit'),
|
||||
filter: newBasicData('1'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'quantity',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.quantity'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import SmallTitle from '@/components/BaseDrawer/components/SmallTitle.vue'
|
||||
import AddForm from './subpage/AddForm'
|
||||
import EditForm from './subpage/EditForm'
|
||||
import { getBOMInfo, editBOM, getDeviceBOMList, delDeviceBOM } from '@/api/equipment/bom'
|
||||
import { getDictDeviceTypePage, getDictBom } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import newBasicData from '@/filters/newBasicData'
|
||||
export default {
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm, SmallTitle },
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
enabled: 1,
|
||||
id: null,
|
||||
current: 1,
|
||||
size: 3,
|
||||
keywords: ''
|
||||
},
|
||||
formData: {
|
||||
equipmentTypeId: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentTypeId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderEquipmentType'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
code: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
name: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bom.placeholderName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
device: [],
|
||||
bom: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
// created() {},
|
||||
// mounted() {
|
||||
// this.getDict()
|
||||
// },
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
async onOpen() {
|
||||
await this.getDict()
|
||||
await this.getDetail()
|
||||
await this.getList()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
this.dict.bom.map(item => {
|
||||
if (item.code === this.formData.code) {
|
||||
this.formData.name = item.name
|
||||
}
|
||||
})
|
||||
const result = await editBOM({
|
||||
...this.formData,
|
||||
// eslint-disable-next-line no-undef
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDetail() {
|
||||
const result = await getBOMInfo({
|
||||
// eslint-disable-next-line no-undef
|
||||
id: this.targetInfo.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// console.log(result)
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDeviceTypePage({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
// console.log(result)
|
||||
this.dict.device = result
|
||||
const res = await getDictBom({
|
||||
current: this.listQuery.current,
|
||||
size: this.listQuery.size
|
||||
})
|
||||
this.dict.bom = res
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.id = this.targetInfo.id
|
||||
this.listQuery.keywords = this.targetInfo.id
|
||||
// console.log(this.listQuery)
|
||||
const res = await getDeviceBOMList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
// console.log(res)
|
||||
}
|
||||
},
|
||||
handleClick(raw) {
|
||||
// console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceBOM({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
turnBack() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.showDialog = true// 新增
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.custom-dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer {
|
||||
border-radius: 8px 0 0 8px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-form-item__label {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer__header {
|
||||
padding: 0;
|
||||
margin: 32px 0 8px 32px;
|
||||
}
|
||||
|
||||
.drawer >>> .content {
|
||||
padding: 0 24px 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 40%;
|
||||
}
|
||||
|
||||
.drawer >>> .visual-part {
|
||||
flex: 1 auto;
|
||||
max-height: 76vh;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
padding-right: 10px; /* 调整滚动条样式 */
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,31 @@
|
||||
<!--
|
||||
* @Date: 2021-02-20 10:45:21
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2022-06-15 15:34:49
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\components\statusBtn.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-switch v-model="injectData.enabled" :active-value="1" :inactive-value="0" @change="changeStatus" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editBOM } from '@/api/equipment/bom'
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async changeStatus() {
|
||||
const result = await editBOM(this.injectData)
|
||||
if (result.code === 0) {
|
||||
this.$message.success(this.$t('module.equipmentManager.bom.succeeded'))
|
||||
this.$emit('emitData')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
211
src/views/EquipmentManager/BOMManager/index.vue
Normal file
211
src/views/EquipmentManager/BOMManager/index.vue
Normal file
@@ -0,0 +1,211 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-08-03 09:55:20
|
||||
* @LastEditors: fzq
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
@emitFun="getList"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="120" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :readonly="readonly" :target-info="{id: curEditId}" @done="getList" />
|
||||
<!-- <detail-form :visible.sync="showdetailDialog" :target-info="{id: curDetailId}" @done="getList" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import statusBtn from './components/statusBtn'
|
||||
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableProps = [{
|
||||
prop: 'equipmentTypeCode',
|
||||
label: i18n.t('module.equipmentManager.bom.equipmentCode')
|
||||
}, {
|
||||
prop: 'equipmentType',
|
||||
label: i18n.t('module.equipmentManager.bom.equipmentName')
|
||||
}, {
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.bom.code')
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.bom.name')
|
||||
}, {
|
||||
prop: 'enabled',
|
||||
label: i18n.t('module.equipmentManager.bom.enabled'),
|
||||
subcomponent: statusBtn
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.bom.remark')
|
||||
}]
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
// import DetailForm from './subpage/detail'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getBOMList, delBOM } from '@/api/equipment/bom'
|
||||
// , getMaterialList
|
||||
import { objFilter } from '@/utils'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
curDetailId: null,
|
||||
showDetailDialog: false,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
keywords: ''
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.basicData.visual.keyword'),
|
||||
placeholder: this.$t('module.equipmentManager.bom.searchPlaceholder'),
|
||||
param: 'keywords'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delBOM({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'detail':
|
||||
// this.$router.push({
|
||||
// name: 'DeviceBOMManage',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
// this.showDetailDialog = true
|
||||
// this.curDetailId = raw.data.id
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.keywords = this.headFormValue.keywords
|
||||
const res = await getBOMList(objFilter(this.listQuery))
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.showDialog = true// 新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
176
src/views/EquipmentManager/BOMManager/subpage/AddForm.vue
Normal file
176
src/views/EquipmentManager/BOMManager/subpage/AddForm.vue
Normal file
@@ -0,0 +1,176 @@
|
||||
<!--
|
||||
* @Date: 2021-01-09 16:25:11
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-13 16:01:10
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\subpage\AddForm.vue
|
||||
* @Description: 子页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.bomdetail.addDialogTitle')" class="dialog" width="45%" append-to-body v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-row :gutter="20">
|
||||
<!-- 物料名称 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.materialName')" prop="materialId">
|
||||
<el-select v-model="formData.materialId" :placeholder="$t('module.equipmentManager.bomdetail.placeholdermaterialName')" clearable :style="{width: '100%'}" @change="handleMaterialChange">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.material"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 单位 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.unit')" prop="unit">
|
||||
<el-select v-model="formData.unit" :placeholder="$t('module.equipmentManager.bomdetail.placeholderunit')" disabled :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.unit"
|
||||
:key="index"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<!-- 数量 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.quantity')" prop="quantity">
|
||||
<el-input v-model="formData.quantity" type="number" :placeholder="$t('module.equipmentManager.bomdetail.placeholderquantity')" :min="0" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 状态 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.bomdetail.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" :loading="waiting" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addDeviceBOM } from '@/api/equipment/bom'
|
||||
import { getDictMaterial } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
waiting: false,
|
||||
formData: {
|
||||
materialId: null,
|
||||
unit: undefined,
|
||||
quantity: undefined,
|
||||
remark: undefined,
|
||||
equipmentBomId: undefined
|
||||
},
|
||||
rules: {
|
||||
materialId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bomdetail.placeholdermaterialName'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
unit: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.bomdetail.placeholderunit'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
quantity: [{
|
||||
required: true,
|
||||
trigger: 'blur',
|
||||
validator: (rule, value, callback) => {
|
||||
if (value) {
|
||||
if (value <= 0) {
|
||||
callback(new Error('数量应该为正值'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
} else {
|
||||
callback(new Error('请输入数字'))
|
||||
}
|
||||
}
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.bomdetail.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
dict: {
|
||||
material: [],
|
||||
unit: JSON.parse(localStorage.getItem('dictObj'))['1']
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
this.getDict()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentBomId = this.targetInfo.id
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handleMaterialChange(mid) {
|
||||
const m = this.dict.material.find(item => item.id === mid)
|
||||
if (m) {
|
||||
this.formData.unit = m.unit || ''
|
||||
console.log('unit', m.unit, this.dict.unit)
|
||||
} else {
|
||||
this.formData.unit = ''
|
||||
}
|
||||
},
|
||||
handelConfirm() {
|
||||
this.waiting = true
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) {
|
||||
this.waiting = false
|
||||
return
|
||||
}
|
||||
const result = await addDeviceBOM(this.formData)
|
||||
this.waiting = false
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictMaterial()
|
||||
this.dict.material = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
184
src/views/EquipmentManager/BOMManager/subpage/EditForm.vue
Normal file
184
src/views/EquipmentManager/BOMManager/subpage/EditForm.vue
Normal file
@@ -0,0 +1,184 @@
|
||||
<!--
|
||||
* @Date: 2021-01-09 16:25:11
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-14 10:51:51
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\subpage\EditForm.vue
|
||||
* @Description: 子页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<!-- append-to-body 可以解决新增/编辑导致的不高亮 -->
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.bomdetail.editDialogTitle')" class="dialog" width="45%" append-to-body v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-row :gutter="20">
|
||||
<!-- 物料名称 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.materialName')" prop="materialId">
|
||||
<el-select v-model="formData.materialId" :placeholder="$t('module.equipmentManager.bomdetail.placeholdermaterialName')" clearable :style="{width: '100%'}" @change="handleMaterialChange">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.material"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 单位 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.unit')" prop="unit">
|
||||
<el-select v-model="formData.unit" :placeholder="$t('module.equipmentManager.bomdetail.placeholderunit')" disabled :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.unit"
|
||||
:key="index"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<!-- 数量 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.quantity')" prop="quantity">
|
||||
<el-input v-model="formData.quantity" :placeholder="$t('module.equipmentManager.bomdetail.placeholderquantity')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 备注 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.bomdetail.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.bomdetail.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editDeviceBOM, getDeviceBOMInfo } from '@/api/equipment/bom'
|
||||
import { getDictMaterial } from '@/api/dict'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
materialId: undefined,
|
||||
unit: undefined,
|
||||
quantity: undefined,
|
||||
remark: undefined,
|
||||
id: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
rules: {
|
||||
materialId: [{
|
||||
required: true,
|
||||
message: '请输入物料名称',
|
||||
trigger: 'change'
|
||||
}],
|
||||
unit: [{
|
||||
required: true,
|
||||
message: '请输入单位',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
quantity: [{
|
||||
required: true,
|
||||
trigger: 'blur',
|
||||
validator: (rule, value, callback) => {
|
||||
if (value) {
|
||||
if (value <= 0) {
|
||||
callback(new Error('数量应该为正值'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
} else {
|
||||
callback(new Error('请输入数字'))
|
||||
}
|
||||
}
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: '请输入备注',
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
dict: {
|
||||
// unit: JSON.parse(localStorage.getItem('dictObj'))['1392033901169348609'],
|
||||
unit: JSON.parse(localStorage.getItem('dictObj'))['1'],
|
||||
material: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handleMaterialChange(mid) {
|
||||
const m = this.dict.material.find(item => item.id === mid)
|
||||
if (m) {
|
||||
this.formData.unit = m.unit || ''
|
||||
} else {
|
||||
this.formData.unit = ''
|
||||
}
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editDeviceBOM(this.formData)
|
||||
console.log(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceBOMInfo({
|
||||
id: this.targetInfo.id
|
||||
})
|
||||
// console.log(result)
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
console.log(result)
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictMaterial()
|
||||
this.dict.material = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
232
src/views/EquipmentManager/BOMManager/subpage/detail.vue
Normal file
232
src/views/EquipmentManager/BOMManager/subpage/detail.vue
Normal file
@@ -0,0 +1,232 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-07-27 17:05:21
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\BOMManager\subpage\detail.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="bom-form-container">
|
||||
<el-form ref="elForm" :model="formData" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.equipmentName')" prop="equipmentTypeName">
|
||||
<el-input :value="equipmentTypeName" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.code')" prop="code">
|
||||
<el-input v-model="formData.code" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.name')" prop="name">
|
||||
<el-input v-model="formData.name" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :disabled="pagetype" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.bom.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="sub-table-container">
|
||||
<el-divider>{{ $t('module.equipmentManager.bomdetail.title') }}</el-divider>
|
||||
<div class="method-btn-area">
|
||||
<el-button type="primary" style="float: right;margin: 0 20px;" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
<!-- <el-button style="float: right;" @click="resetForm">重置</el-button> -->
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :width="80" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
</div>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" :target-info="{id: listQuery.id}" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, fatherId: listQuery.id}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import CheckDetail from '@/components/BaseTable/subcomponents/CheckDetail'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'materialCode',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.materialId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'materialName',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.materialName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'unit',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.unit'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'quantity',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.quantity'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.bomdetail.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
// import { objFilter } from '@/utils'
|
||||
import { getDeviceBOMList, delDeviceBOM, getBOMInfo } from '@/api/equipment/bom'
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
import { dictChange, dictFilter } from '@/utils'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'BOMForm',
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
enabled: 1,
|
||||
id: null,
|
||||
current: 1,
|
||||
size: 10,
|
||||
keywords: ''
|
||||
},
|
||||
equipmentName: undefined,
|
||||
formData: {
|
||||
equipmentCode: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
dict: {
|
||||
deviceTable: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
pagetype() {
|
||||
return true
|
||||
// return false
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
console.log(this.$route.query)
|
||||
this.listQuery.id = this.$route.query.id
|
||||
this.listQuery.keywords = this.$route.query.id
|
||||
await this.getDict()
|
||||
await this.getDetail()
|
||||
await this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceBOM({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
const res = await getDeviceBOMList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDetail() {
|
||||
const result = await getBOMInfo({
|
||||
id: this.listQuery.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
this.equipmentName = dictFilter(this.dict.deviceTable, { key: 'id', value: 'name' })(result.data.equipmentId)
|
||||
// console.log(result)
|
||||
}
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
saveForm() {},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.deviceTable = dictChange(result, { key: 'id', value: 'name' })
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/styles/mixin.scss";
|
||||
.bom-form-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
@include clearfix;
|
||||
}
|
||||
.sub-table-container {
|
||||
margin-top: 80px;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
203
src/views/EquipmentManager/DeviceMonitoring/AddForm.vue
Normal file
203
src/views/EquipmentManager/DeviceMonitoring/AddForm.vue
Normal file
@@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" title="添加备品备件" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
||||
<el-form-item label="备件编码" prop="name">
|
||||
<el-input v-model="formData.code" placeholder="请输入备件编码" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备件名称" prop="name">
|
||||
<el-input v-model="formData.name" placeholder="请输入备件名称" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备件型号" prop="sparePartModel">
|
||||
<el-input
|
||||
v-model="formData.sparePartModel"
|
||||
placeholder="请输入备件型号"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="外部编码" prop="externalCode">
|
||||
<el-input
|
||||
v-model="formData.externalCode"
|
||||
placeholder="请输入备件型号"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" prop="accessoryUnit">
|
||||
<el-select v-model="formData.accessoryUnit" placeholder="请选择单位" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in accessoryUnitOptions"
|
||||
:key="index"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="批次号" prop="batchNumber">
|
||||
<el-input v-model="formData.batchNumber" type="number" placeholder="请输入批次号" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数量" prop="accessoryNumber">
|
||||
<el-input v-model="formData.accessoryNumber" type="number" placeholder="请输入数量" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="进厂时间" prop="entryTime">
|
||||
<el-date-picker
|
||||
v-model="formData.entryTime"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
placeholder="请选择进厂时间"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<el-select v-model="formData.supplierId" placeholder="请选择供应商" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in supplierIdOptions"
|
||||
:key="index"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收人" prop="receiver">
|
||||
<el-input v-model="formData.receiver" placeholder="请输入接收人" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="formData.remark" placeholder="请输入备注" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addSapre } from '@/api/equipment/spare'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: [],
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
sparePartModel: undefined,
|
||||
accessoryUnit: undefined,
|
||||
batchNumber: undefined,
|
||||
accessoryNumber: undefined,
|
||||
entryTime: null,
|
||||
supplierId: undefined,
|
||||
receiver: undefined,
|
||||
remark: undefined,
|
||||
externalCode: undefined
|
||||
},
|
||||
rules: {
|
||||
code: [{
|
||||
required: false,
|
||||
message: '请输入备件编码',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
name: [{
|
||||
required: true,
|
||||
message: '请输入备件名称',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
sparePartModel: [{
|
||||
required: true,
|
||||
message: '请输入备件型号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
accessoryUnit: [{
|
||||
required: true,
|
||||
message: '请选择单位',
|
||||
trigger: 'change'
|
||||
}],
|
||||
externalCode: [{
|
||||
required: true,
|
||||
message: '请输入外部编码',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
batchNumber: [{
|
||||
required: true,
|
||||
message: '请输入批次号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
accessoryNumber: [{
|
||||
required: true,
|
||||
message: '请输入数量',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
entryTime: [{
|
||||
required: true,
|
||||
message: '请选择进厂时间',
|
||||
trigger: 'change'
|
||||
}],
|
||||
supplierId: [{
|
||||
required: true,
|
||||
message: '请选择供应商',
|
||||
trigger: 'change'
|
||||
}],
|
||||
receiver: [{
|
||||
required: true,
|
||||
message: '请输入接收人',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: '请输入备注',
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
accessoryUnitOptions: [{
|
||||
'label': '选项一',
|
||||
'value': 1
|
||||
}, {
|
||||
'label': '选项二',
|
||||
'value': 2
|
||||
}],
|
||||
supplierIdOptions: [{
|
||||
'label': '选项一',
|
||||
'value': 1
|
||||
}, {
|
||||
'label': '选项二',
|
||||
'value': 2
|
||||
}]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addSapre(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
222
src/views/EquipmentManager/DeviceMonitoring/EditForm.vue
Normal file
222
src/views/EquipmentManager/DeviceMonitoring/EditForm.vue
Normal file
@@ -0,0 +1,222 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" title="编辑备品备件" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
||||
<el-form-item label="备件编码" prop="name">
|
||||
<el-input v-model="formData.code" placeholder="请输入备件编码" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备件名称" prop="name">
|
||||
<el-input v-model="formData.name" placeholder="请输入备件名称" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备件型号" prop="sparePartModel">
|
||||
<el-input
|
||||
v-model="formData.sparePartModel"
|
||||
placeholder="请输入备件型号"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="外部编码" prop="externalCode">
|
||||
<el-input
|
||||
v-model="formData.externalCode"
|
||||
placeholder="请输入备件型号"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="单位" prop="accessoryUnit">
|
||||
<el-select v-model="formData.accessoryUnit" placeholder="请选择单位" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in accessoryUnitOptions"
|
||||
:key="index"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="批次号" prop="batchNumber">
|
||||
<el-input v-model="formData.batchNumber" type="number" placeholder="请输入批次号" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数量" prop="accessoryNumber">
|
||||
<el-input v-model="formData.accessoryNumber" type="number" placeholder="请输入数量" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="进厂时间" prop="entryTime">
|
||||
<el-date-picker
|
||||
v-model="formData.entryTime"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
placeholder="请选择进厂时间"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="供应商" prop="supplierId">
|
||||
<el-select v-model="formData.supplierId" placeholder="请选择供应商" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in supplierIdOptions"
|
||||
:key="index"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="接收人" prop="receiver">
|
||||
<el-input v-model="formData.receiver" placeholder="请输入接收人" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="formData.remark" placeholder="请输入备注" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSpareInfo, editSpare } from '@/api/equipment/spare'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
sparePartModel: undefined,
|
||||
accessoryUnit: undefined,
|
||||
batchNumber: undefined,
|
||||
accessoryNumber: undefined,
|
||||
entryTime: null,
|
||||
supplierId: undefined,
|
||||
receiver: undefined,
|
||||
remark: undefined,
|
||||
externalCode: undefined
|
||||
},
|
||||
rules: {
|
||||
code: [{
|
||||
required: true,
|
||||
message: '请输入备件编码',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
externalCode: [{
|
||||
required: true,
|
||||
message: '请输入外部编码',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
name: [{
|
||||
required: true,
|
||||
message: '请输入备件名称',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
sparePartModel: [{
|
||||
required: true,
|
||||
message: '请输入备件型号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
accessoryUnit: [{
|
||||
required: true,
|
||||
message: '请选择单位',
|
||||
trigger: 'change'
|
||||
}],
|
||||
batchNumber: [{
|
||||
required: true,
|
||||
message: '请输入批次号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
accessoryNumber: [{
|
||||
required: true,
|
||||
message: '请输入数量',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
entryTime: [{
|
||||
required: true,
|
||||
message: '请选择进厂时间',
|
||||
trigger: 'change'
|
||||
}],
|
||||
supplierId: [{
|
||||
required: true,
|
||||
message: '请选择供应商',
|
||||
trigger: 'change'
|
||||
}],
|
||||
receiver: [{
|
||||
required: true,
|
||||
message: '请输入接收人',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: '请输入备注',
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
accessoryUnitOptions: [{
|
||||
'label': '选项一',
|
||||
'value': 1
|
||||
}, {
|
||||
'label': '选项二',
|
||||
'value': 2
|
||||
}],
|
||||
supplierIdOptions: [{
|
||||
'label': '选项一',
|
||||
'value': 1
|
||||
}, {
|
||||
'label': '选项二',
|
||||
'value': 2
|
||||
}]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDetail()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editSpare({
|
||||
...this.formData,
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDetail() {
|
||||
const result = await getSpareInfo({
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// console.log(result)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
167
src/views/EquipmentManager/DeviceMonitoring/index.vue
Normal file
167
src/views/EquipmentManager/DeviceMonitoring/index.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: guo
|
||||
* @LastEditTime: 2021-03-20 17:51:55
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\DeviceMonitoring\index.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="usermanager-container">
|
||||
<div class="method-btn-area">
|
||||
<el-input v-model="listQuery.keywords" :placeholder="$t('module.equipmentManager.monitoring.searchPlaceholder')" style="width: 200px;" clearable />
|
||||
<el-button @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
<!-- <el-button type="primary" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button> -->
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
import { timeFormatter } from '@/filters'
|
||||
const statusTableFilter = value => {
|
||||
const table = {
|
||||
'0': 'productive',
|
||||
'1': 'standby',
|
||||
'2': 'unscheduled downtime',
|
||||
'3': 'scheduled downtime',
|
||||
'4': 'engineering',
|
||||
'5': 'non-scheduled'
|
||||
}
|
||||
return table[value] ? table[value] : value
|
||||
}
|
||||
const tableBtn = [{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.monitoring.code'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.monitoring.name'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.monitoring.status'),
|
||||
align: 'center',
|
||||
filter: statusTableFilter
|
||||
}, {
|
||||
prop: 'startTime',
|
||||
label: i18n.t('module.equipmentManager.monitoring.startTime'),
|
||||
align: 'center',
|
||||
filter: timeFormatter
|
||||
// filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'totalCount',
|
||||
label: i18n.t('module.equipmentManager.monitoring.totalCount'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'repairTime',
|
||||
label: i18n.t('module.equipmentManager.monitoring.repairTime'),
|
||||
align: 'center',
|
||||
filter: timeFormatter
|
||||
}]
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getDeviceMonitoringList } from '@/api/equipment/monitoring'
|
||||
import { getDictSupplier } from '@/api/dict/index'
|
||||
import { dictChange, dictFilter } from '@/utils'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps: [],
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
keywords: ''
|
||||
},
|
||||
dict: {
|
||||
supplier: []
|
||||
}
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.getDict()
|
||||
await this.preprocess()
|
||||
await this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'detail':
|
||||
// this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
const res = await getDeviceMonitoringList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictSupplier()
|
||||
this.dict.supplier = result.data
|
||||
},
|
||||
async preprocess() {
|
||||
this.tableProps = tableProps.map(item => {
|
||||
if (this.dict[item.prop]) {
|
||||
console.log(dictChange(this.dict[item.prop], { key: 'id', value: 'name' }))
|
||||
item.filter = dictFilter(dictChange(this.dict[item.prop], { key: 'id', value: 'name' }))
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.usermanager-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
422
src/views/EquipmentManager/HomePage.vue
Normal file
422
src/views/EquipmentManager/HomePage.vue
Normal file
@@ -0,0 +1,422 @@
|
||||
<template>
|
||||
<div ref="cockpit-container-equipment" class="visual-container">
|
||||
<techy-header :head-title="'合肥新能源数字工厂设备管理驾驶舱'" @toggle-full-screen="changeFullScreen" />
|
||||
<!-- <section class="techy-body" :key="refreshKey"> -->
|
||||
<section class="techy-body">
|
||||
<div class="tech-body__col-1">
|
||||
<div class="row-1">
|
||||
<div class="equipment-exception">
|
||||
<!-- 设备报修/异常上报 -->
|
||||
<techy-container :title="'设备报修/异常上报'" :icon="equipmentExceptionSVG">
|
||||
<div class="table-wrapper">
|
||||
<techy-table
|
||||
:page="1"
|
||||
:limit="7"
|
||||
:show-index="false"
|
||||
:table-config="equipmentExceptionProps"
|
||||
:table-data="equipmentExceptionDatalist"
|
||||
/>
|
||||
</div>
|
||||
</techy-container>
|
||||
</div>
|
||||
<div class="equipment-alarm">
|
||||
<!-- 设备异常报警 -->
|
||||
<techy-container :title="'设备异常报警'" :icon="equipmentAlarmSVG">
|
||||
<div class="table-wrapper">
|
||||
<techy-table
|
||||
:page="1"
|
||||
:limit="7"
|
||||
:show-index="false"
|
||||
:table-config="equipmentAlarmProps"
|
||||
:table-data="equipmentAlarmDatalist"
|
||||
/>
|
||||
</div>
|
||||
</techy-container>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row-2">
|
||||
<!-- 设备分析 -->
|
||||
<techy-container :title="'设备分析'" :icon="equipmentAnalysisSVG">
|
||||
<select id="productLine" name="productLine" class="product-line-selection">
|
||||
<option value="1">产线一</option>
|
||||
<option value="2">产线二</option>
|
||||
<option value="3">产线三</option>
|
||||
</select>
|
||||
<div class="grid columns-2" style="height: calc(100% - 32px)">
|
||||
<div class="pl-jdl">
|
||||
<TechyBox style="padding: calc(100vh / 1920 * 24)">
|
||||
<h2
|
||||
:style="{
|
||||
margin: 0,
|
||||
padding: 0,
|
||||
fontWeight: 'normal',
|
||||
color: '#01CFCC',
|
||||
lineHeight: '18px',
|
||||
fontSize: '0.85vw'
|
||||
}"
|
||||
>
|
||||
<!-- fontSize: '15px', -->
|
||||
各产线稼动率
|
||||
</h2>
|
||||
<pl-jdl-chart />
|
||||
</TechyBox>
|
||||
</div>
|
||||
<div class="eqs-oee-mtbr-btbf grid grid-2-3">
|
||||
<EquipmentAnalysisBox
|
||||
v-for="(item, index) in equipmentAnalysisData"
|
||||
:key="index"
|
||||
:name="item.name"
|
||||
:oee="item.oee"
|
||||
:mtbf="item.mtbf"
|
||||
:mtbr="item.mtbr"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</techy-container>
|
||||
</div>
|
||||
<div class="row-3">
|
||||
<!-- 设备备件管理 -->
|
||||
<techy-container :title="'设备备件管理'" :icon="equipmentOrderSVG">
|
||||
<techy-table
|
||||
:page="1"
|
||||
:limit="7"
|
||||
:show-index="false"
|
||||
:table-config="sparepartsProps"
|
||||
:table-data="sparepartsDatalist"
|
||||
/>
|
||||
</techy-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tech-body__col-2">
|
||||
<techy-container :title="'设备工单管理'" :icon="equipmentOrderSVG">
|
||||
<!-- 设备工单管理 -->
|
||||
<div class="techy-container__inner">
|
||||
<div>
|
||||
<TechyAnalysisHeader>突发性维护</TechyAnalysisHeader>
|
||||
<TechyVerticalTable :table-props="rightSideProps" :data-list="rightSideDatalist" />
|
||||
</div>
|
||||
<div>
|
||||
<TechyAnalysisHeader>计划内保养</TechyAnalysisHeader>
|
||||
<TechyVerticalTable :table-props="rightSideProps" :data-list="rightSideDatalist" />
|
||||
</div>
|
||||
<div>
|
||||
<TechyAnalysisHeader>防御性维护</TechyAnalysisHeader>
|
||||
<TechyVerticalTable :table-props="rightSideProps" :data-list="rightSideDatalist" />
|
||||
</div>
|
||||
<div>
|
||||
<TechyAnalysisHeader>点检工单</TechyAnalysisHeader>
|
||||
<TechyVerticalTable :table-props="rightSideProps" :data-list="rightSideDatalist" />
|
||||
</div>
|
||||
</div>
|
||||
</techy-container>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TechyContainer from './components/TechyContainer.vue'
|
||||
import TechyHeader from './components/TechyHeader.vue'
|
||||
import TechyBox from './components/TechyBox.vue'
|
||||
import TechyTable from './components/TechyTable.vue'
|
||||
import TechyAnalysisHeader from './components/TechyAnalysisHeader.vue'
|
||||
import EquipmentAnalysisBox from './components/EquipmentAnalysisBox.vue'
|
||||
import TechyVerticalTable from './components/TechyVerticalTable.vue'
|
||||
import plJdlChart from './components/charts/pl-JDL-Chart.vue'
|
||||
|
||||
import {
|
||||
equipmentExceptionProps,
|
||||
equipmentExceptionDatalist,
|
||||
equipmentAlarmProps,
|
||||
equipmentAlarmDatalist,
|
||||
OEE_PER_LINE,
|
||||
equipmentAnalysisData,
|
||||
sparepartsProps,
|
||||
sparepartsDatalist,
|
||||
rightSideProps,
|
||||
rightSideDatalist
|
||||
} from './mockData'
|
||||
|
||||
import { mapGetters } from 'vuex'
|
||||
import screenfull from 'screenfull'
|
||||
|
||||
const equipmentExceptionSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>setting tools</title>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-4设备管理" transform="translate(-384.000000, -254.000000)">
|
||||
<g id="编组-16备份-6" transform="translate(360.000000, 230.000000)">
|
||||
<g id="编组" transform="translate(24.000000, 24.000000)">
|
||||
<polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
|
||||
<path d="M5.8599,18.0898 C6.4089,18.6418 7.3019,18.6448 7.8539,18.0958 C7.8559,18.0938 7.8579,18.0918 7.8599,18.0898 L14.5199,11.4298 L14.8899,11.4998 L15.0599,11.4998 C16.6169,11.7418 18.1089,10.7848 18.5399,9.2698 L18.2299,9.6198 C17.1349,10.6718 15.4049,10.6718 14.3099,9.6198 C13.2319,8.5358 13.2319,6.7838 14.3099,5.6998 L14.5999,5.4098 C13.0609,5.8908 12.1389,7.4618 12.4699,9.0398 L12.5499,9.4098 L5.8809,16.0798 C5.6139,16.3438 5.4659,16.7048 5.46982098,17.0798 C5.4729,17.4538 5.6199,17.8118 5.8809,18.0798 L5.8599,18.0898 Z M6.8599,19.8698 C6.1109,19.8828 5.3889,19.5898 4.8599,19.0598 C3.7809,17.9838 3.7769,16.2358 4.8529,15.1568 C4.8559,15.1538 4.8579,15.1518 4.8599,15.1498 L11.0099,8.9898 C10.7039,6.6548 12.2459,4.4768 14.5499,3.9898 L14.7799,3.9398 L15.0899,3.9398 C15.6049,3.8968 16.0939,4.1748 16.3199,4.6398 C16.4859,5.0968 16.3549,5.6088 15.9899,5.9298 L15.2299,6.6898 C14.6769,7.2388 14.6749,8.1318 15.2239,8.6838 L15.2299,8.6898 C15.7859,9.2338 16.6739,9.2338 17.2299,8.6898 L17.9899,7.9198 C18.2099,7.6868 18.5099,7.5478 18.8299,7.5298 C19.1509,7.5208 19.4599,7.6568 19.6709,7.8998 C19.9429,8.2518 20.0459,8.7058 19.9499,9.1398 C19.5749,11.5408 17.3609,13.2088 14.9499,12.9098 L8.7999,19.0598 C8.2859,19.5748 7.5889,19.8668 6.8599,19.8698 L6.8599,19.8698 Z" id="Fill-5" fill="#6FFADE"></path>
|
||||
<path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-7" fill="#6FFADE"></path>
|
||||
<polygon id="Fill-9" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
|
||||
<path d="M5.3901,18.6099 C4.5621,17.8059 4.5411,16.4829 5.3451,15.6549 C5.3601,15.6399 5.3741,15.6249 5.3901,15.6099 L11.7891,9.2099 C11.3521,7.1479 12.6671,5.1199 14.7301,4.6799 L14.9301,4.6799 L15.1501,4.6799 C15.7401,4.6799 15.9301,5.1099 15.5501,5.4899 L14.7891,6.2499 C13.9611,7.0789 13.9611,8.4219 14.7891,9.2499 C15.6191,10.0789 16.9611,10.0789 17.7891,9.2499 L18.5501,8.4899 C18.6531,8.3769 18.7971,8.3079 18.9501,8.2999 C19.2201,8.2999 19.4301,8.5999 19.3501,9.1099 C19.0271,11.1909 17.0811,12.6169 15.0001,12.2999 L14.7901,12.2999 L8.3901,18.6999 C7.5861,19.5279 6.2631,19.5479 5.4351,18.7449 C5.4191,18.7299 5.4051,18.7149 5.3901,18.6999 L5.3901,18.6099 Z" id="Stroke-13" stroke="#6FFADE" stroke-width="1.5"></path>
|
||||
<path d="M16.9399,20.1099 L13.4609,16.6299 C13.3319,16.4919 13.3319,16.2779 13.4609,16.1399 L14.9399,14.6699 C15.0699,14.5349 15.2859,14.5309 15.4199,14.6609 C15.4239,14.6639 15.4269,14.6669 15.4299,14.6699 L18.9099,18.1499 C19.4619,18.7019 19.4619,19.5979 18.9099,20.1499 C18.3579,20.7019 17.4619,20.7019 16.9099,20.1499 L16.9399,20.1099 Z" id="Fill-15" fill="#6FFADE"></path>
|
||||
<polygon id="Fill-17" fill="#6FFADE" points="5.6499 7.6899 4.6199 7.1499 3.3899 5.4299 4.3799 4.4399 6.0999 5.6699 6.6399 6.7099 9.0399 9.1199 8.0599 10.1099"></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
const equipmentAlarmSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>hatplus</title>
|
||||
<defs>
|
||||
<linearGradient x1="100%" y1="100%" x2="20.318998%" y2="7.84095011e-14%" id="linearGradient-1">
|
||||
<stop stop-color="#4BFFC8" offset="0%"></stop>
|
||||
<stop stop-color="#45F2EC" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-4设备管理" transform="translate(-998.000000, -254.000000)">
|
||||
<g id="编组-16备份-8" transform="translate(974.000000, 230.000000)">
|
||||
<g id="编组-6" transform="translate(24.000000, 24.000000)">
|
||||
<rect id="矩形" x="0" y="0" width="24" height="24"></rect>
|
||||
<g id="异常" transform="translate(3.000000, 3.000000)" fill-rule="nonzero">
|
||||
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="17" height="17"></rect>
|
||||
<path d="M9.00003613,1.00009438 C7.45266489,0.991339384 5.96400493,1.59197413 4.85604619,2.6721807 C3.77420104,3.74179852 3.16375561,5.19879645 3.16005953,6.72012488 L3.16005953,14.5280306 L14.7760126,14.5280306 L14.7760126,6.72010926 C14.7746725,5.19671341 14.1605756,3.73789487 13.0720104,2.67216507 C11.9832986,1.60721536 10.5229694,1.00760431 9.0000205,1.00009438 L9.00003613,1.00009438 Z M8.52003548,12.6560576 L8.35203526,8.87208057 L5.48804703,8.87208057 L9.24800521,4.12815624 L9.56800564,7.18412206 L12.2880093,7.28012148 L8.48800418,12.6560576 L8.52003548,12.6560576 Z M1.00003551,16.1280053 C0.997937773,15.8953576 1.08886376,15.671504 1.25262424,15.5062394 C1.41638472,15.3409748 1.63939864,15.2480106 1.87205781,15.2480106 L16.1280144,15.2480106 C16.3586463,15.2508825 16.5792874,15.3425823 16.7440153,15.5040247 C16.9059435,15.6716664 16.9975415,15.894943 17,16.1280053 C17,16.6095886 16.6096013,17 16.1280144,17 L1.87205781,17 C1.39047096,17 1.00003551,16.6095886 1.00003551,16.1280053 L1.00003551,16.1280053 Z" id="形状" fill="url(#linearGradient-1)"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
const equipmentOrderSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组</title>
|
||||
<defs>
|
||||
<polygon id="path-1" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
|
||||
<polygon id="path-3" points="0 0 16.1800204 0 16.1800204 18.6799449 0 18.6799449"></polygon>
|
||||
</defs>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-4设备管理" transform="translate(-1532.000000, -254.000000)">
|
||||
<g id="编组-6" transform="translate(1508.000000, 230.000000)">
|
||||
<g id="编组" transform="translate(24.000000, 24.000000)">
|
||||
<polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
|
||||
<path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-3" fill="#6EF9E1"></path>
|
||||
<path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-5" fill="#6EF9E1"></path>
|
||||
<g transform="translate(3.140000, 2.930055)">
|
||||
<mask id="mask-2" fill="white">
|
||||
<use xlink:href="#path-1"></use>
|
||||
</mask>
|
||||
<g id="Clip-8"></g>
|
||||
<path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-7" fill="#6EF9E1" mask="url(#mask-2)"></path>
|
||||
</g>
|
||||
<g transform="translate(6.579800, 7.340500)">
|
||||
<path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-9" fill="#6FFADE"></path>
|
||||
<path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-11" fill="#6EF9E1"></path>
|
||||
<path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-13" fill="#6EF9E1"></path>
|
||||
<path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-15" fill="#6EF9E1"></path>
|
||||
<path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-17" fill="#6DF8E1"></path>
|
||||
<path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-19" fill="#6DF8E1"></path>
|
||||
<path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-21" fill="#6DF8E1"></path>
|
||||
</g>
|
||||
<path d="M9.0701,20.7905 C9.0691,21.0755 9.2221,21.3395 9.4701,21.4795 C9.7211,21.6205 10.0281,21.6205 10.2801,21.4795 C10.5301,21.3405 10.6871,21.0765 10.6901,20.7905 C10.6761,20.3375 10.2981,19.9815 9.8451,19.9955 C9.7131,20.0005 9.5851,20.0355 9.4701,20.1005 C9.2201,20.2395 9.0671,20.5045 9.0701,20.7905" id="Fill-23" fill="#6EF9E1"></path>
|
||||
<path d="M17.7101951,12.2602 C17.7092,12.5452 17.8622,12.8092 18.1102,12.9492 C18.3612,13.0902 18.6682,13.0902 18.9202,12.9492 C19.1702,12.8102 19.3272,12.5472 19.3302,12.2602 C19.3262,11.9702 19.1702,11.7042 18.9202,11.5602 C18.6682,11.4192 18.3612,11.4192 18.1102,11.5602 C17.8612,11.7052 17.7101951,11.9722 17.7101951,12.2602" id="Fill-25" fill="#6EF9E1"></path>
|
||||
<g transform="translate(3.140000, 2.930055)">
|
||||
<mask id="mask-4" fill="white">
|
||||
<use xlink:href="#path-3"></use>
|
||||
</mask>
|
||||
<g id="Clip-28"></g>
|
||||
<path d="M14.85,0 L1.35,0 C0.61,-0.00595509266 0.006,0.590044907 0,1.33004491 L0,1.34004491 L0,17.3400449 C0,18.0800449 0.6,18.6800449 1.34,18.6800449 L1.35,18.6800449 L6.75,18.6800449 L6.75,17.0800449 L2.75,17.0800449 C2.121,17.0850449 1.605,16.5790449 1.6,15.9500449 L1.6,15.9390449 L1.6,2.72904491 C1.6,2.10104491 2.11,1.59004491 2.74,1.59004491 L2.75,1.59004491 L13.41,1.59004491 C14.041,1.59004491 14.555,2.09904491 14.56,2.72904491 L14.56,9.33004491 L16.1800204,9.33004491 L16.1800204,1.33004491 C16.182,0.972044907 16.037,0.629044907 15.78,0.380044907 C15.531,0.138044907 15.198,0.00104490734 14.85,0" id="Fill-27" fill="#6EF9E1" mask="url(#mask-4)"></path>
|
||||
</g>
|
||||
<g transform="translate(6.579800, 7.340500)">
|
||||
<path d="M12.3702,11.45 C12.3812,12.322 11.6832,13.038 10.8102,13.05 C9.9372,13.06 9.2222,12.362 9.2102,11.489 C9.1992,10.617 9.8982,9.901 10.7702,9.88897334 L10.7902,9.88897334 C11.6572,9.884 12.3652,10.583 12.3702,11.449 L12.3702,11.45 Z M14.3102,12.13 L13.6802,11.66 C13.6862,11.59 13.6862,11.519 13.6802,11.45 C13.6852,11.377 13.6852,11.303 13.6802,11.229 L14.3102,10.769 C14.4802,10.635 14.5222,10.394 14.4102,10.21 L13.7202,9.05 C13.6362,8.915 13.4892,8.832 13.3302,8.83 C13.2812,8.819 13.2292,8.819 13.1802,8.83 L12.4302,9.109 C12.3072,9.028 12.1762,8.958 12.0402,8.899 L11.9302,8.149 C11.8992,7.931 11.7102,7.772 11.4902,7.779 L10.0802,7.779 C9.8632,7.781 9.6792,7.936 9.6402,8.149 L9.5402,8.899 L9.1502,9.109 L8.4102,8.83 L8.2502,8.83 C8.0922,8.826 7.9452,8.911 7.8702,9.05 L7.1602,10.21 C7.0502,10.397 7.0972,10.638 7.2702,10.769 L7.8902,11.229 L7.8902,11.45 C7.8852,11.519 7.8852,11.59 7.8902,11.66 L7.2702,12.13 C7.0992,12.258 7.0512,12.495 7.1602,12.679 L7.8602,13.849 C7.9452,13.984 8.0912,14.067 8.2502,14.069 C8.3002,14.079 8.3502,14.079 8.4002,14.069 L9.1402,13.779 C9.2642,13.864 9.3942,13.937 9.5302,14 L9.6402,14.75 C9.6792,14.963 9.8632,15.118 10.0802,15.12 L11.4902,15.12 C11.7102,15.127 11.8992,14.968 11.9302,14.75 L12.0402,14 C12.1772,13.94 12.3082,13.866 12.4302,13.779 L13.1802,14.069 C13.2292,14.079 13.2812,14.079 13.3302,14.069 C13.4912,14.073 13.6402,13.988 13.7202,13.849 L14.4202,12.679 C14.5242,12.494 14.4782,12.261 14.3102,12.13 L14.3102,12.13 Z" id="Fill-29" fill="#6FFADE"></path>
|
||||
<path d="M9.4102,0.739 C9.4102,1.229 9.2002,1.469 8.8002,1.469 L2.9202,1.469 C2.5102,1.469 2.3102,1.229 2.3102,0.739 C2.3102,0.25 2.5102,0 2.9202,0 L8.8002,0 C9.2002,0 9.4102,0.25 9.4102,0.739" id="Fill-31" fill="#6EF9E1"></path>
|
||||
<path d="M7.4102,4.6599 C7.4102,5.1599 7.2002,5.3989 6.7902,5.3989 L2.8702,5.3989 C2.4502,5.3989 2.2502,5.1599 2.2502,4.6599 C2.2502,4.1599 2.4502,3.9299 2.8702,3.9299 L6.7902,3.9299 C7.2002,3.9299 7.4102,4.1699 7.4102,4.6599" id="Fill-33" fill="#6EF9E1"></path>
|
||||
<path d="M5.4102,8.5896 C5.4102,9.0796 5.2002,9.3296 4.7802,9.3296 L2.8802,9.3296 C2.4602,9.3296 2.2502,9.0796 2.2502,8.5896 C2.2502,8.0996 2.4602,7.8596 2.8802,7.8596 L4.7802,7.8596 C5.2002,7.8596 5.4102,8.0996 5.4102,8.5896" id="Fill-35" fill="#6EF9E1"></path>
|
||||
<path d="M0.73,0.0095 L0.75,0.0095 C1.153,0.0095 1.48,0.3365 1.48,0.7385 L1.48,0.7495 C1.48,1.1535 1.153,1.4795 0.75,1.4795 L0.73,1.4795 C0.327,1.4795 0,1.1535 0,0.7495 L0,0.7385 C0,0.3365 0.327,0.0095 0.73,0.0095" id="Fill-37" fill="#6DF8E1"></path>
|
||||
<path d="M0.73,3.9695 L0.75,3.9695 C1.153,3.9695 1.48,4.2965 1.48,4.6995 L1.48,4.7095 C1.48,5.1135 1.153,5.4395 0.75,5.4395 L0.73,5.4395 C0.327,5.4395 0,5.1135 0,4.7095 L0,4.6995 C0,4.2965 0.327,3.9695 0.73,3.9695" id="Fill-39" fill="#6DF8E1"></path>
|
||||
<path d="M0.73,7.9197 L0.75,7.9197 C1.153,7.9197 1.48,8.2457 1.48,8.6487 L1.48,8.6597 C1.48,9.0627 1.153,9.3897 0.75,9.3897 L0.73,9.3897 C0.327,9.3897 0,9.0627 0,8.6597 L0,8.6487 C0,8.2457 0.327,7.9197 0.73,7.9197" id="Fill-41" fill="#6DF8E1"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
const equipmentAnalysisSVG = `<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>analysis</title>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-4设备管理" transform="translate(-384.000000, -533.000000)">
|
||||
<g id="编组-16备份-7" transform="translate(360.000000, 509.000000)">
|
||||
<g id="编组" transform="translate(24.000000, 24.000000)">
|
||||
<polygon id="Fill-1" fill="#3B71B2" opacity="0" points="0 24 24 24 24 0 0 0"></polygon>
|
||||
<path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-3" fill="#6FFADE"></path>
|
||||
<path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-5" fill="#6FFADE"></path>
|
||||
<path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-7" fill="#6FFADE"></path>
|
||||
<path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-9" fill="#6FFADE"></path>
|
||||
<path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-11" fill="#6FFADE"></path>
|
||||
<path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-13" fill="#6FFADE"></path>
|
||||
<path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-15" fill="#6FFADE"></path>
|
||||
<path d="M14.6801,7.8401 L14.6801,8.4001 C14.6801,8.6761 14.9041,8.9001 15.1801,8.9001 L15.1901,8.9001 C15.4661,8.9001 15.6901,8.6761 15.6901,8.4001 L15.6901,6.5001 C15.6901,6.2241 15.4661,6.0001 15.1901,6.0001 L13.2701,6.0001 C13.0171,6.0301 12.8281,6.2451 12.8301,6.5001 C12.8271,6.7561 13.0161,6.9751 13.2701,7.0101 L13.8301,7.0101 L11.3301,8.7501 L10.3301,7.4201 C10.1241,7.1751 9.7671,7.1231 9.5001,7.3001 L5.8001,10.0001 C5.5381,10.1941 5.4831,10.5631 5.6761,10.8251 C5.6781,10.8261 5.6791,10.8281 5.6801,10.8301 C5.7951,10.9901 5.9821,11.0841 6.1801,11.0801 C6.3021,11.0791 6.4201,11.0331 6.5101,10.9501 L9.7501,8.5801 L10.7501,9.9101 C10.9571,10.1591 11.3251,10.1981 11.5801,10.0001 L14.6501,7.8801 L14.6801,7.8401 Z" id="Fill-17" fill="#6FFADE"></path>
|
||||
<path d="M16.7601,17.7502146 C15.1691,17.7552 13.8751,16.4712 13.8700791,14.8802 C13.8641,13.2892 15.1491,11.9952 16.7401,11.9901791 C18.3301,11.9842 19.6241,13.2702 19.6301,14.8592 C19.6301,14.8662 19.6301,14.8732 19.6301,14.8802 C19.6191,16.4602 18.3411,17.7392 16.7601,17.7502146 M21.8101,19.7002 L19.8101,17.7002 C20.5281,16.9382 20.9261,15.9282 20.9201,14.8802 C20.9201,12.5772 19.0531,10.7102 16.7501,10.7102 C14.4471,10.7102 12.5801,12.5772 12.5801,14.8802 C12.5801,17.1832 14.4471,19.0502 16.7501,19.0502 C17.4471,19.0422 18.1341,18.8672 18.7501,18.5402 L20.8301,20.6202 C20.9511,20.7492 21.1231,20.8192 21.3001,20.8102 C21.4731,20.8162 21.6411,20.7472 21.7601,20.6202 C22.0261,20.4132 22.0741,20.0302 21.8671,19.7642 C21.8501,19.7412 21.8301,19.7202 21.8101,19.7002" id="Fill-19" fill="#6FFADE"></path>
|
||||
<path d="M6.9901,15.3196 C6.8671,15.3196 6.7501,15.2726 6.6601,15.1896 C6.5781,15.0986 6.5321,14.9816 6.5301,14.8596 L6.5301,12.5006 C6.5061,12.3216 6.5881,12.1456 6.7401,12.0496 C6.8911,11.9486 7.0891,11.9486 7.2401,12.0496 C7.3921,12.1456 7.4741,12.3216 7.4501,12.5006 L7.4501,14.8596 C7.4481,14.9846 7.3981,15.1026 7.3101,15.1896 C7.2241,15.2736 7.1091,15.3196 6.9901,15.3196" id="Fill-21" fill="#6FFADE"></path>
|
||||
<path d="M9.2601,15.3196 C9.0171,15.3256 8.8151,15.1326 8.8091,14.8906 C8.8091,14.8806 8.8091,14.8706 8.8101,14.8596 L8.8101,11.1206 C8.8471,10.8686 9.0811,10.6956 9.3321,10.7326 C9.5331,10.7616 9.6901,10.9206 9.7201,11.1206 L9.7201,14.8496 C9.7241,14.9756 9.6771,15.0986 9.5901,15.1896 C9.5001,15.2726 9.3821,15.3196 9.2601,15.3196" id="Fill-23" fill="#6FFADE"></path>
|
||||
<path d="M11.5399,15.3196 C11.4169,15.3196 11.2999,15.2726 11.2099,15.1896 C11.1289,15.0986 11.0819,14.9816 11.0799,14.8596 L11.0799,13.2196 C11.0809,12.9656 11.2869,12.7596 11.5409,12.7605964 C11.7939,12.7605964 11.9989,12.9666 11.9999,13.2196 L11.9999,14.8596 C11.9989,14.9846 11.9489,15.1026 11.8599,15.1896 C11.7739,15.2736 11.6599,15.3196 11.5399,15.3196" id="Fill-25" fill="#6FFADE"></path>
|
||||
<path d="M13.35,19.2297 L2.65,19.2297 C2.259,19.2607 1.967,19.6017 1.997,19.9937 C1.998,20.0017 1.999,20.0107 2,20.0197 C1.96,20.4107 2.244,20.7587 2.634,20.7987 C2.64,20.7987 2.645,20.7997 2.65,20.7997 L13.35,20.7997 C13.784,20.7147 14.066,20.2937 13.981,19.8607 C13.918,19.5417 13.669,19.2917 13.35,19.2297" id="Fill-27" fill="#6FFADE"></path>
|
||||
<path d="M16.8002,2.6301 L4.9402,2.6301 C3.2832,2.6301 1.9402,3.9731 1.9402,5.6301 L1.9402,15.0801 C1.9402,16.7361 3.2832,18.0801 4.9402,18.0801 L11.5402,18.0801 C11.9002,18.0801 12.1802,17.6601 12.1802,17.3001 C12.1802,16.9401 11.9002,16.5101 11.5402,16.5101 L5.2202,16.5101 C4.2862,16.5211 3.5212,15.7741 3.5102,14.8401 C3.5092,14.8261 3.5092,14.8141 3.5102,14.8001 L3.5102,5.9001 C3.5152,4.9801 4.2602,4.2351 5.1802,4.2301 L16.6402,4.2301 C17.5622,4.2301 18.3102,4.9781 18.3102,5.9001 L18.3102,10.0101 L18.3102,10.1001 C18.3042,10.1231 18.3042,10.1471 18.3102,10.1701 C18.3732,10.5131 18.6722,10.7611 19.0202,10.7601 C19.4212,10.7491 19.7402,10.4211 19.7402,10.0201 L19.7402,5.6301 C19.7402,3.9961 18.4332,2.6621 16.8002,2.6301" id="Fill-29" fill="#6FFADE"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
export default {
|
||||
name: 'EquipmentManageHome',
|
||||
components: {
|
||||
plJdlChart,
|
||||
TechyContainer,
|
||||
TechyHeader,
|
||||
TechyBox,
|
||||
TechyVerticalTable,
|
||||
TechyTable,
|
||||
TechyAnalysisHeader,
|
||||
EquipmentAnalysisBox
|
||||
},
|
||||
directives: {
|
||||
'auto-shrink-and-grow': function(el, binding) {
|
||||
console.log('el', el, binding)
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
equipmentExceptionSVG,
|
||||
equipmentAlarmSVG,
|
||||
equipmentOrderSVG,
|
||||
equipmentAnalysisSVG,
|
||||
equipmentExceptionProps,
|
||||
equipmentExceptionDatalist,
|
||||
equipmentAlarmProps,
|
||||
equipmentAlarmDatalist,
|
||||
OEE_PER_LINE,
|
||||
equipmentAnalysisData,
|
||||
sparepartsProps,
|
||||
sparepartsDatalist,
|
||||
rightSideProps,
|
||||
rightSideDatalist
|
||||
// refreshKey: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['sidebar'])
|
||||
},
|
||||
mounted() {
|
||||
// window.addEventListener('resize', () => {
|
||||
// console.log('resizing....')
|
||||
// this.refreshSize++
|
||||
// this.$nextTick(() => {
|
||||
// this.$forceUpdate()
|
||||
// })
|
||||
// }) // 不可行
|
||||
},
|
||||
|
||||
methods: {
|
||||
changeFullScreen() {
|
||||
if (!screenfull.enabled) {
|
||||
this.$message({
|
||||
message: 'you browser can not work',
|
||||
type: 'warning'
|
||||
})
|
||||
return false
|
||||
}
|
||||
screenfull.toggle(this.$refs['cockpit-container-equipment'])
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.visual-container {
|
||||
width: 100%;
|
||||
min-width: 1280px;
|
||||
/* height: calc(100vh - 128px); */
|
||||
background: url('./assets/bg.png') no-repeat;
|
||||
background-size: cover;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.techy-body {
|
||||
height: calc(100vh - 64px);
|
||||
width: 100%;
|
||||
/* overflow: hidden; */
|
||||
/* padding: 24px; */
|
||||
padding: calc(100vw / 1920 * 24);
|
||||
/* display: grid;
|
||||
grid-template-columns: 3fr 1fr; */
|
||||
display: flex;
|
||||
gap: calc(100vw / 1920 * 16);
|
||||
}
|
||||
|
||||
.tech-body__col-1 {
|
||||
height: calc(100% - 28px);
|
||||
flex: 1 3;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: calc(100vw / 1920 * 16);
|
||||
}
|
||||
|
||||
.tech-body__col-2 {
|
||||
flex: 1 1;
|
||||
max-width: 25%;
|
||||
height: calc(100% - 28px);
|
||||
}
|
||||
|
||||
.techy-container__inner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.8vh;
|
||||
height: calc(100% - 4vh);
|
||||
/* overflow-y: scroll; */
|
||||
overflow-y: hidden;
|
||||
}
|
||||
.techy-container__inner > div {
|
||||
flex: 1 1;
|
||||
}
|
||||
|
||||
.row-1 {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
gap: calc(100vw / 1920 * 16);
|
||||
}
|
||||
|
||||
.equipment-exception {
|
||||
flex: 3 1;
|
||||
}
|
||||
|
||||
.equipment-alarm {
|
||||
flex: 2 1;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.columns-2 {
|
||||
grid-template-columns: 1fr 3fr;
|
||||
/* gap: 8px; */
|
||||
gap: 0.5vw;
|
||||
}
|
||||
|
||||
.grid-2-3 {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: 1fr 1fr;
|
||||
/* gap: 4px; */
|
||||
gap: 0.6vh 0.3vw;
|
||||
}
|
||||
|
||||
.product-line-selection {
|
||||
border: none;
|
||||
outline: none;
|
||||
border-radius: 2px 4px 4px 2px;
|
||||
background: #31878c45;
|
||||
/* opacity: 0.29; */
|
||||
color: white;
|
||||
position: absolute;
|
||||
padding: 0.5vh;
|
||||
width: 5vw;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
top: calc(1vh + 8px);
|
||||
left: calc(5vw + 32px);
|
||||
}
|
||||
</style>
|
||||
442
src/views/EquipmentManager/MaintainLog/AddLog.vue
Normal file
442
src/views/EquipmentManager/MaintainLog/AddLog.vue
Normal file
@@ -0,0 +1,442 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.maintainlog.maintainAdd')" class="dialog" width="50%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" label-width="110px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="orderId" :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.orderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentName"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholderequipmentId')"
|
||||
:disabled="valDisabled"
|
||||
:style="{width: '100%'}"
|
||||
filterable
|
||||
@input="changeEq"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceOrderNumber')" prop="logMaintenanceOrderNumber">
|
||||
<el-input v-model="formData.logMaintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainNextTime')" prop="nextMaintenanceTime">
|
||||
<el-date-picker
|
||||
v-model="formData.nextMaintenanceTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainNextTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainStartTime')" prop="actualStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainStartTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainEndTime')" prop="actualEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainWorkerId')" prop="maintainWorker">
|
||||
<el-select
|
||||
v-model="formData.maintainWorker"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
@input="changeWorker"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.status')" prop="status">
|
||||
<el-select
|
||||
v-model="formData.status"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderstatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.undone')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.done')"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainType')" prop="maintainType">
|
||||
<el-select
|
||||
v-model="formData.maintainType"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainlog.placeholdermaintainType')])"
|
||||
celearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainType"
|
||||
:key="index"
|
||||
:label="item.dataName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceDetail')" prop="maintenanceDes">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDes"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="annex">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:file-list="fileList"
|
||||
:action="uploadPath"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:on-success="handleSuccess"
|
||||
class="btn"
|
||||
>
|
||||
<el-button class="uploadButton" icon="el-icon-upload2">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.maintainlog.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// getLogCode
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { addMaintainLog, getMaintainPlan } from '@/api/equipment/maintain'
|
||||
import { getDictDevice, getDictWorker } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import { timeIsBefore } from '@/utils'
|
||||
import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
uploadPath,
|
||||
annexfileList: [],
|
||||
fileList: [],
|
||||
dataObj: { typeCode: 'file' },
|
||||
formData: {
|
||||
equipmentId: undefined,
|
||||
equipmentName: undefined,
|
||||
logMaintenanceOrderNumber: undefined,
|
||||
nextMaintenanceTime: null,
|
||||
actualStartTime: null,
|
||||
maintainWorker: '',
|
||||
maintainWorkerId: undefined,
|
||||
actualEndTime: undefined,
|
||||
maintenanceDes: undefined,
|
||||
maintainDuration: undefined,
|
||||
file: null,
|
||||
annex: null,
|
||||
remark: undefined,
|
||||
status: undefined,
|
||||
orderNumber: undefined,
|
||||
id: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
logMaintenanceOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainType: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainType'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
nextMaintenanceTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainNextTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
actualStartTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualStartTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualEndTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainWorker: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceDes: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
status: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderstatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
device: [],
|
||||
worker: [],
|
||||
maintainType: []
|
||||
},
|
||||
// 控制添加选项是否disable
|
||||
valDisabled: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
orderId() {
|
||||
return this.$route.query.orderId
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.formData.maintainPlanId = this.$route.query.orderId
|
||||
this.getInfo()
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
console.log(this.orderId)
|
||||
console.log(this.targetInfo)
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
submitForm() {
|
||||
console.log(this.formData)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.formData.actualStartTime && this.formData.actualEndTime && !timeIsBefore(this.formData.actualStartTime, this.formData.actualEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: i18n.t('module.equipmentManager.maintainplan.sort')
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
if (this.formData.maintainWorker) {
|
||||
this.formData.maintainWorker = this.formData.maintainWorker.join(',')
|
||||
} else {
|
||||
this.formData.maintainWorker = ''
|
||||
}
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
console.log(this.formData)
|
||||
await addMaintainLog(this.formData).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
}).catch(res => {
|
||||
if (res.code !== 0) {
|
||||
this.formData.maintainWorker = this.formData.maintainWorker.split(',')
|
||||
// console.log(this.formData.maintainWorkerId)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.large'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
// console.log(res)
|
||||
this.fileList.push({ name: file.name, id: res.data[0].id })
|
||||
const arr = this.fileList.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
let str = ''
|
||||
arr.forEach((v) => {
|
||||
str += v.name + ':' + v.id + ';'
|
||||
})
|
||||
this.formData.annex = str.slice(0, -1)
|
||||
},
|
||||
async getDict() {
|
||||
// const result3 = await getLogCode()
|
||||
// if (result3.code === 0) {
|
||||
// this.formData.logMaintenanceOrderNumber = result3.data
|
||||
// }
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
// console.log(result)
|
||||
const result2 = await getDictWorker()
|
||||
this.dict.worker = result2
|
||||
const listQuery = {
|
||||
current: 1,
|
||||
size: 500
|
||||
}
|
||||
// 获取保养类型
|
||||
await dataDictionaryDataList(Object.assign(listQuery, {
|
||||
dictTypeId: '1393401964580093954'
|
||||
})).then(response => {
|
||||
if (response.data.records) {
|
||||
this.dict.maintainType = response.data.records
|
||||
console.log(this.dict.maintainType)
|
||||
}
|
||||
})
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
async getInfo() {
|
||||
if (this.orderId) {
|
||||
this.valDisabled = true
|
||||
const result = await getMaintainPlan({
|
||||
id: this.orderId,
|
||||
current: 1,
|
||||
size: 10
|
||||
})
|
||||
if (result.code === 0) {
|
||||
// console.log(result)
|
||||
// 根据equipmentId查询equipmentName
|
||||
// const res = await getEqListDetail({
|
||||
// current: 1,
|
||||
// size: 999,
|
||||
// id: result.data[0].equipmentId
|
||||
// })
|
||||
// console.log(res)
|
||||
this.formData.equipmentId = result.data[0].equipmentId
|
||||
this.formData.equipmentName = result.data[0].equipmentName
|
||||
this.formData.status = result.data[0].status
|
||||
this.formData.maintenanceOrderNumber = result.data[0].maintenanceOrderNumber
|
||||
this.formData.orderNumber = result.data[0].maintenanceOrderNumber
|
||||
// console.log(this.formData.equipmentId)
|
||||
}
|
||||
}
|
||||
},
|
||||
changeEq(val) {
|
||||
this.formData.equipmentId = val
|
||||
},
|
||||
changeWorker(val) {
|
||||
// console.log(val)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.form-container {
|
||||
padding: 30px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
/* 上传按钮样式 */
|
||||
.uploadButton{
|
||||
width: 106px;
|
||||
height: 32px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
</style>
|
||||
426
src/views/EquipmentManager/MaintainLog/EditLog.vue
Normal file
426
src/views/EquipmentManager/MaintainLog/EditLog.vue
Normal file
@@ -0,0 +1,426 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="readonly ? $t('module.equipmentManager.maintainlog.maintainDetail') : $t('module.equipmentManager.maintainlog.maintainEdit')" class="dialog" width="50%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" label-width="110px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item v-if="targetInfo.orderId" :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.maintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.equipmentId')" prop="equipmentId">
|
||||
<!-- equipmentName Id -->
|
||||
<el-select
|
||||
v-model="formData.equipmentName"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholderequipmentId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
filterable
|
||||
@input="changeEq"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceOrderNumber')" prop="logMaintenanceOrderNumber">
|
||||
<el-input v-model="formData.logMaintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-col :span="23">
|
||||
<el-form-item label="是否结束保养" prop="field104" required>
|
||||
<el-switch v-model="formData.field104" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainNextTime')" prop="nextMaintenanceTime">
|
||||
<el-date-picker
|
||||
v-model="formData.nextMaintenanceTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainNextTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainStartTime')" prop="actualStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainStartTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainEndTime')" prop="actualEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainWorkerId')" prop="maintainWorker">
|
||||
<el-select
|
||||
v-model="formData.maintainWorker"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainDuration')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.status')" prop="status">
|
||||
<el-select
|
||||
v-model="formData.status"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderstatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.undone')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.done')"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceDetail')" prop="maintenanceDes">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDes"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="annex">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:file-list="fileList"
|
||||
:action="uploadPath"
|
||||
:show-file-list="true"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:on-success="handleSuccess"
|
||||
:on-preview="openFile"
|
||||
class="btn"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-button class="uploadButton" icon="el-icon-upload2">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.maintainlog.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- <el-form-item size="large">
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
</el-form-item> -->
|
||||
<div slot="footer">
|
||||
<el-button v-if="!readonly" @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
<el-button v-if="readonly" @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!readonly" type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editMaintainLog, getMaintainLog } from '@/api/equipment/maintain'
|
||||
import { getDictDevice, getDictWorker } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import { timeIsBefore } from '@/utils'
|
||||
import { uploadPath } from '@/api/basic'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
equipmentId: undefined,
|
||||
equipmentName: undefined,
|
||||
logMaintenanceOrderNumber: undefined,
|
||||
field104: false,
|
||||
nextMaintenanceTime: null,
|
||||
actualStartTime: null,
|
||||
maintainWorkerIdId: undefined,
|
||||
maintainWorker: '',
|
||||
maintainDuration: undefined,
|
||||
actualEndTime: undefined,
|
||||
maintenanceDes: undefined,
|
||||
field110: null,
|
||||
remark: undefined,
|
||||
status: undefined,
|
||||
annex: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
logMaintenanceOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainWorkerId: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
nextMaintenanceTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainNextTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualStartTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualStartTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualEndTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDes: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
status: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderstatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
uploadPath,
|
||||
fileList: [],
|
||||
dataObj: { typeCode: 'file' },
|
||||
dict: {
|
||||
device: [],
|
||||
worker: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// orderId() {
|
||||
// return this.$route.query.orderId
|
||||
// },
|
||||
// id() {
|
||||
// return this.$route.query.id
|
||||
// }
|
||||
},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
// this.getDict()
|
||||
// this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDict()
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.formData.actualStartTime && this.formData.actualEndTime && !timeIsBefore(this.formData.actualStartTime, this.formData.actualEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: i18n.t('module.equipmentManager.maintainplan.sort')
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
if (this.formData.maintainWorker) {
|
||||
this.formData.maintainWorker = this.formData.maintainWorker.join(',')
|
||||
} else {
|
||||
this.formData.maintainWorker = ''
|
||||
}
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
// this.formData.maintainWorker = this.formData.maintainWorker.join(',')
|
||||
// console.log(this.formData)
|
||||
await editMaintainLog(this.formData).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
}).catch(res => {
|
||||
if (res.code !== 0) {
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.split(',')
|
||||
this.formData.maintainWorker = this.formData.maintainWorker.split(',')
|
||||
// console.log(this.formData.maintainWorkerId)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.large'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
openFile(file) {
|
||||
// console.log(file)
|
||||
window.open(`${location.origin}/api/common/attachment/downloadFile?type=file&attachmentId=${file.id}`)
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
// console.log(res)
|
||||
this.fileList.push({ name: file.name, id: res.data[0].id })
|
||||
const arr = this.fileList.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
let str = ''
|
||||
arr.forEach((v) => {
|
||||
str += v.name + ':' + v.id + ';'
|
||||
})
|
||||
this.formData.annex = str.slice(0, -1)
|
||||
},
|
||||
async getInfo() {
|
||||
console.log(this.targetInfo.id)
|
||||
const result = await getMaintainLog({
|
||||
// id: this.id
|
||||
id: this.targetInfo.id
|
||||
})
|
||||
console.log(result)
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// this.formData.equipmentId = this.id
|
||||
// this.formData.equipmentId = this.targetInfo.id
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.split(',')
|
||||
this.formData.maintainWorker = this.formData.maintainWorker.split(',')
|
||||
// console.log(this.formData)
|
||||
if (this.formData.annex) {
|
||||
const arr = this.formData.annex.split(';').map(v => {
|
||||
const obj = {}
|
||||
const a = v.split(':')
|
||||
obj.name = a[0]
|
||||
obj.id = a[1]
|
||||
return obj
|
||||
})
|
||||
this.fileList = arr
|
||||
console.log(this.fileList)
|
||||
}
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
console.log(result)
|
||||
const result2 = await getDictWorker()
|
||||
this.dict.worker = result2
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
// 监测select下拉框输入获取equipmentId
|
||||
changeEq(val) {
|
||||
this.formData.equipmentId = val
|
||||
console.log(val)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.form-container {
|
||||
padding: 30px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
/* 上传按钮样式 */
|
||||
.uploadButton{
|
||||
width: 106px;
|
||||
height: 32px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
</style>
|
||||
551
src/views/EquipmentManager/MaintainLog/index.vue
Normal file
551
src/views/EquipmentManager/MaintainLog/index.vue
Normal file
@@ -0,0 +1,551 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-19
|
||||
* @LastEditTime: 2022-08-03 09:50:17
|
||||
* @LastEditors: fzq
|
||||
@FilePath: \basic-admin\src\views\EquipmentManager\MaintainLog\index.vue
|
||||
* @Description:
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="120" :method-list="tableBtn" :is-fixed="true" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<!-- 新增弹窗 -->
|
||||
<!-- :order-id="{orderId: orderId}" -->
|
||||
<add-form :visible.sync="showDialog" :order-id="{orderId: orderId}" @done="getList" />
|
||||
<!-- 编辑/详情弹窗 -->
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
<!-- 更新详情 弹窗-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import dataDict from '@/filters/DataDict'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import { timeFormatter } from '@/filters'
|
||||
import { getDictWorker } from '@/api/dict'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.equipmentId')
|
||||
}, {
|
||||
prop: 'logMaintenanceOrderNumber',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintenanceOrderNumber')
|
||||
}, {
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.status'),
|
||||
filter: dataDict('doneStatus')
|
||||
// }, {
|
||||
// prop: 'logMaintenanceOrderNumber',
|
||||
// label: i18n.t('module.equipmentManager.maintainlog.maintenanceOrderNumber'),
|
||||
// isFixed: true
|
||||
}, {
|
||||
prop: 'actualStartTime',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainStartTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'actualEndTime',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainEndTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'maintainWorker',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainWorker')
|
||||
}, {
|
||||
prop: 'maintainDuration',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainDuration')
|
||||
},
|
||||
// {
|
||||
// prop: 'equipmentCode',
|
||||
// label: i18n.t('module.equipmentManager.maintainlog.equipmentCode'),
|
||||
// isFixed: true
|
||||
// // filter: dataDict('enableState')
|
||||
// },
|
||||
// {
|
||||
// prop: 'nextMaintenanceTime',
|
||||
// label: i18n.t('module.equipmentManager.maintainlog.nextMaintenanceTime'),
|
||||
// isFixed: true,
|
||||
// filter: timeFormatter
|
||||
// },
|
||||
// {
|
||||
// prop: 'maintenanceDes',
|
||||
// label: '保养记录',
|
||||
// isFixed: true
|
||||
// // filter: dataDict('enableState')
|
||||
// },
|
||||
{
|
||||
prop: 'planned',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.planned')
|
||||
}]
|
||||
const tablePropsOnly = [{
|
||||
prop: 'logMaintenanceOrderNumber',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintenanceOrderNumber')
|
||||
}, {
|
||||
prop: 'actualStartTime',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainStartTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'actualEndTime',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainEndTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'maintainDuration',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.maintainDuration')
|
||||
},
|
||||
{
|
||||
prop: 'relatePlan',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.isplan'),
|
||||
show: false
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.status'),
|
||||
filter: dataDict('doneStatus')
|
||||
},
|
||||
{
|
||||
prop: 'equipmentCode',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.equipmentCode')
|
||||
// filter: dataDict('enableState')
|
||||
},
|
||||
// {
|
||||
// prop: 'nextMaintenanceTime',
|
||||
// label: i18n.t('module.equipmentManager.maintainlog.nextMaintenanceTime'),
|
||||
// isFixed: true,
|
||||
// filter: timeFormatter
|
||||
// },
|
||||
// {
|
||||
// prop: 'maintenanceDes',
|
||||
// label: '保养记录',
|
||||
// isFixed: true
|
||||
// // filter: dataDict('enableState')
|
||||
// },
|
||||
{
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.maintainlog.remark')
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getMaintainLogList, delMaintainLog, getSingleMaintainLogList, getEqList } from '@/api/equipment/maintain'
|
||||
import AddForm from './AddLog'
|
||||
import EditForm from './EditLog'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import { objFilter } from '@/utils'
|
||||
import i18n from '@/lang'
|
||||
import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
// import VisualImgInfoVue from '@/views/basicData/components/VisualImgInfo.vue'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
tableH: tableHeight(280),
|
||||
tablePropsOnly,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
maintainPlanId: null,
|
||||
current: 1,
|
||||
size: 20,
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
relatePlan: 0,
|
||||
// maintainType: null,
|
||||
equipmentId: null,
|
||||
equipmentName: null
|
||||
// maintainWorkerId: undefined
|
||||
},
|
||||
date: null,
|
||||
array: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
eqIdArr: [],
|
||||
maintainTypeArr: [],
|
||||
workeArr: [],
|
||||
headFormConfig: [],
|
||||
headFormValue: {},
|
||||
result2: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
orderId() {
|
||||
return this.$route.query.orderId
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
orderId: function() {
|
||||
this.isShowSearch()
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.isShowSearch()
|
||||
},
|
||||
mounted() {
|
||||
// 固定表头，表格的最大高度随页面的高度自动调整
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
})
|
||||
this.getEquipmentList()
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delMaintainLog({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'detail':
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'edit':
|
||||
// this.$router.push({
|
||||
// name: 'MaintainEditLog',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
// console.log(raw)
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
// console.log(this.headFormValue)
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
if (this.orderId) {
|
||||
console.log(this.orderId)
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : ''
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : ''
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.relatePlan = this.headFormValue.relatePlan ? this.headFormValue.relatePlan : '0'
|
||||
this.listQuery.maintainPlanId = this.orderId
|
||||
// const res = await getMaintainLogList(objFilter({
|
||||
// current: this.listQuery.current,
|
||||
// size: this.listQuery.size,
|
||||
// startTime: this.listQuery.startTime,
|
||||
// endTime: this.listQuery.endTime,
|
||||
// relatePlan: 0,
|
||||
// maintainPlanId: this.orderId,
|
||||
// equipmentName: this.listQuery.equipmentName
|
||||
// }))
|
||||
const res = await getMaintainLogList(objFilter(this.listQuery))
|
||||
console.log(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data
|
||||
console.log(res)
|
||||
// this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
} else {
|
||||
// if (this.headFormValue.worker) {
|
||||
// console.log(this.headFormValue.worker)
|
||||
// this.listQuery.maintainWorkerId = this.headFormValue.worker.join(',')
|
||||
// }
|
||||
// this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName ? this.headFormValue.equipmentName : null
|
||||
this.listQuery.relatePlan = this.headFormValue.relatePlan ? this.headFormValue.relatePlan : '0'
|
||||
// this.listQuery.maintainType = this.headFormValue.maintainType
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
console.log(this.listQuery)
|
||||
const result = await getSingleMaintainLogList(this.listQuery)
|
||||
// console.log(result)
|
||||
if (result.code === 0) {
|
||||
this.list = result.data.records ? result.data.records : []
|
||||
// 用于显示relatePlan是否显示成汉字
|
||||
// this.list.forEach(item => {
|
||||
// if (item.relatePlan === -1) {
|
||||
// item.relatePlan = '否'
|
||||
// } else if (item.relatePlan === 1) {
|
||||
// item.relatePlan = '是'
|
||||
// }
|
||||
// })
|
||||
// work名字与id之间的转化
|
||||
// console.log(this.list[0].maintainWorker.split(','))
|
||||
for (var i = 0; i < this.result2.length; i++) {
|
||||
this.list.forEach(item => {
|
||||
// item.maintenanceWorker = item.maintenanceWorker.split(',')
|
||||
if (item.maintainWorker === this.result2.id) {
|
||||
item.maintainWorker = this.result2.name
|
||||
}
|
||||
})
|
||||
}
|
||||
this.total = result.data.total
|
||||
// console.log(this.result2)
|
||||
console.log(result)
|
||||
this.listLoading = false
|
||||
}
|
||||
}
|
||||
},
|
||||
async getEquipmentList() {
|
||||
const res = await getEqList({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.getList()
|
||||
if (res.code === 0) {
|
||||
this.eqIdArr = res.data.records.map(item => {
|
||||
return {
|
||||
id: item.name,
|
||||
name: item.name
|
||||
}
|
||||
})
|
||||
// console.log(res)
|
||||
this.headFormConfig[0].selectOptions = this.eqIdArr
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const listQuery = {
|
||||
current: 1,
|
||||
size: 500
|
||||
}
|
||||
await dataDictionaryDataList(Object.assign(listQuery, {
|
||||
dictTypeId: '1393401964580093954'
|
||||
})).then(response => {
|
||||
if (response.data.records) {
|
||||
this.maintainTypeArr = response.data.records.map(item => {
|
||||
return {
|
||||
id: item.id,
|
||||
name: item.dataName
|
||||
}
|
||||
})
|
||||
// this.headFormConfig[2].selectOptions = this.maintainTypeArr
|
||||
}
|
||||
})
|
||||
this.result2 = await getDictWorker()
|
||||
// this.workeArr = result2
|
||||
// this.headFormConfig[3].selectOptions = this.workeArr
|
||||
// console.log(this.result2)
|
||||
},
|
||||
toAddPage() {
|
||||
this.$router.push({
|
||||
name: 'MaintainAddLog',
|
||||
query: {
|
||||
orderId: this.orderId
|
||||
}
|
||||
})
|
||||
},
|
||||
isShowSearch() {
|
||||
if (this.orderId) {
|
||||
this.headFormConfig = [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainplan.placeholderequipmentId'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentName'
|
||||
},
|
||||
// {
|
||||
// type: 'datePicker',
|
||||
// label: this.$t('module.equipmentManager.maintainlog.maintainlogTime'),
|
||||
// dateType: 'daterange',
|
||||
// rangeSeparator: '-',
|
||||
// startPlaceholder: this.$t('module.equipmentManager.maintainlog.startTime'),
|
||||
// endPlaceholder: this.$t('module.equipmentManager.maintainlog.endTime'),
|
||||
// param: 'searchTime'
|
||||
// },
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.back',
|
||||
name: 'back',
|
||||
color: 'primary'
|
||||
}
|
||||
]
|
||||
} else {
|
||||
this.headFormConfig = [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainlog.equipment'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentName'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainlog.isplan'),
|
||||
selectOptions: [
|
||||
{ id: '0', name: this.$t('module.equipmentManager.maintainlog.planAll') },
|
||||
{ id: '1', name: this.$t('module.equipmentManager.maintainlog.planYes') },
|
||||
{ id: '-1', name: this.$t('module.equipmentManager.maintainlog.planNo') }
|
||||
],
|
||||
defaultSelect: '0',
|
||||
param: 'relatePlan'
|
||||
},
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: this.$t('module.equipmentManager.maintainlog.maintainType'),
|
||||
// selectOptions: [],
|
||||
// param: 'maintainType'
|
||||
// },
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: this.$t('module.equipmentManager.maintainlog.maintainWorkerId'),
|
||||
// selectOptions: [],
|
||||
// param: 'worker',
|
||||
// multiple: true
|
||||
// },
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: this.$t('module.equipmentManager.maintainlog.maintainlogTime'),
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd hh:mm:ss',
|
||||
valueFormat: 'yyyy-MM-dd hh:mm:ss',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.equipmentManager.maintainlog.startTime'),
|
||||
endPlaceholder: this.$t('module.equipmentManager.maintainlog.endTime'),
|
||||
param: 'searchTime'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.add',
|
||||
// name: 'add',
|
||||
// color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.export',
|
||||
// name: 'export',
|
||||
// color: 'success'
|
||||
}
|
||||
]
|
||||
// this.headFormConfig[0].selectOptions = this.eqIdArr
|
||||
// this.headFormConfig[2].selectOptions = this.maintainTypeArr
|
||||
// this.headFormConfig[3].selectOptions = this.workeArr
|
||||
}
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
} else if (this.headFormValue.btnName === 'add') {
|
||||
this.toAddPage()
|
||||
this.showDialog = true// 新增
|
||||
} else if (this.headFormValue.btnName === 'back') {
|
||||
this.$router.push({
|
||||
name: 'MaintainPlan'
|
||||
})
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
// this.toAddPage()// 新增
|
||||
this.showDialog = true// 弹窗新增
|
||||
this.orderId = this.$route.query.orderId
|
||||
} else if (this.headFormValue.btnName === 'export') {
|
||||
this.exportExcel()
|
||||
}
|
||||
}
|
||||
// exportExcel() {
|
||||
// const params = {
|
||||
// current: 1,
|
||||
// size: 999,
|
||||
// equipmentId: this.headFormValue.equipmentId,
|
||||
// equipmentName: this.headFormValue.equipmentName,
|
||||
// startTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null,
|
||||
// endTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
// }
|
||||
// this.$nextTick(() => {
|
||||
// exportFile(params).then(response => {
|
||||
// let fileName = ''
|
||||
// const contentDisposition = response.headers['content-disposition']
|
||||
// if (contentDisposition) {
|
||||
// fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
|
||||
// }
|
||||
// const blob = new Blob([response.data])
|
||||
// const reader = new FileReader()
|
||||
// reader.readAsDataURL(blob)
|
||||
// reader.onload = (e) => {
|
||||
// const a = document.createElement('a')
|
||||
// a.download = fileName
|
||||
// a.href = e.target.result
|
||||
// document.body.appendChild(a)
|
||||
// a.click()
|
||||
// document.body.removeChild(a)
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
390
src/views/EquipmentManager/MaintainPlan/AddForm.vue
Normal file
390
src/views/EquipmentManager/MaintainPlan/AddForm.vue
Normal file
@@ -0,0 +1,390 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.maintainplan.addDialogTitle')" class="dialog" width="50%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" label-width="110px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.maintenanceOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenanceOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderequipmentId')"
|
||||
clearable
|
||||
filterable
|
||||
:style="{width: '100%'}"
|
||||
@change="getCode($event)"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainType')" prop="maintainTypeId">
|
||||
<el-select
|
||||
v-model="formData.maintainTypeId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainType')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.equipmentCode')" prop="equipmentCode">
|
||||
<el-input v-model="formData.equipmentCode" :placeholder="$t('module.equipmentManager.maintainplan.placeholderequipmentCode')" :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.erpIdentification')" prop="erpIdentification">
|
||||
<el-input v-model="formData.erpIdentification" :placeholder="$t('module.equipmentManager.maintainplan.placeholdererpIdentification')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainStartTime')" prop="maintainStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.maintainStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainStartTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainEndTime')" prop="maintainEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.maintainEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainplan.maintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintainWorkerId')" prop="maintainWorkerId">
|
||||
<el-select v-model="formData.maintainWorkerId" multiple placeholder="请选择">
|
||||
<el-option
|
||||
v-for="(item,index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintenancePeriodId')" prop="maintenancePeriodId">
|
||||
<!-- <el-input v-model="formData.maintenancePeriodId" :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId')" :style="{width: '100%'}" /> -->
|
||||
<el-select
|
||||
v-model="formData.maintenancePeriodId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainPeriodList"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainFuncDesc')" prop="maintainFuncDesc">
|
||||
<el-input v-model="formData.maintainFuncDesc" :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainFuncDesc')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.status')" prop="status">
|
||||
<el-select
|
||||
v-model="formData.status"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderstatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.undone')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.done')"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.maintainplan.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="annex">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:file-list="fileList"
|
||||
:action="uploadPath"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:on-success="handleSuccess"
|
||||
class="btn"
|
||||
>
|
||||
<el-button class="uploadButton" icon="el-icon-upload2">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { timeIsBefore } from '@/utils'
|
||||
import { addMaintainPlan, getPlanCode } from '@/api/equipment/maintain'
|
||||
import { getDictDevice, maintainPeriod, getDictWorker, getDictRepairType } from '@/api/dict'
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { equipmentInfoDetail } from '@/api/basicData/Equipment/equipmentInfo'
|
||||
// import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: [],
|
||||
data() {
|
||||
return {
|
||||
uploadPath,
|
||||
annexfileList: [],
|
||||
fileList: [],
|
||||
dataObj: { typeCode: 'file' },
|
||||
formData: {
|
||||
maintenanceOrderNumber: null,
|
||||
maintenancePeriod: undefined,
|
||||
equipmentId: undefined,
|
||||
maintainStartTime: null,
|
||||
maintainEndTime: null,
|
||||
status: 0,
|
||||
maintainFuncDesc: null,
|
||||
remark: undefined,
|
||||
annexUrl: null,
|
||||
maintainWorkerId: null,
|
||||
groupId: undefined,
|
||||
maintainTypeId: undefined
|
||||
},
|
||||
rules: {
|
||||
// maintenanceOrderNumber: [{
|
||||
// required: true,
|
||||
// message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintenanceOrderNumber'),
|
||||
// trigger: 'blur'
|
||||
// }],
|
||||
maintenancePeriodId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
// maintainStartTime: [{
|
||||
// required: true,
|
||||
// message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainStartTime'),
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
maintainEndTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
// lastMaintainTime: [{
|
||||
// required: true,
|
||||
// message: i18n.t('module.equipmentManager.maintainplan.placeholderlastMaintainTime'),
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
// nextMaintainTime: [{
|
||||
// required: true,
|
||||
// message: i18n.t('module.equipmentManager.maintainplan.placeholdernextMaintainTime'),
|
||||
// trigger: 'change'
|
||||
// }],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
pattern: /^(0|[1-9][0-9]*)$/,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.int'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintainFuncDesc: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainFuncDesc'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintainType: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainType'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
erpIdentification: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdererpIdentification'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
dict: {
|
||||
device: [],
|
||||
maintainPeriodList: [],
|
||||
worker: [],
|
||||
maintainType: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
this.getDict()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
async onOpen() {
|
||||
const result = await getPlanCode()
|
||||
if (result.code === 0) {
|
||||
this.formData.maintenanceOrderNumber = result.data
|
||||
}
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
// TODO 提交表单
|
||||
if (this.formData.maintainStartTime && this.formData.maintainEndTime && !timeIsBefore(this.formData.maintainStartTime, this.formData.maintainEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: i18n.t('module.equipmentManager.maintainplan.sort')
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
console.log(this.formData)
|
||||
await addMaintainPlan(this.formData).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
}).catch(res => {
|
||||
if (res.code !== 0) {
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.split(',')
|
||||
// console.log(this.formData.maintainWorkerId)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
async getCode($event) {
|
||||
const result = await equipmentInfoDetail($event)
|
||||
if (result.code === 0) {
|
||||
console.log(result)
|
||||
this.formData.equipmentCode = result.data.code
|
||||
this.formData.maintenancePeriodId = result.data.maintenanceCycle
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.large'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
// console.log(res)
|
||||
this.fileList.push({ name: file.name, id: res.data[0].id })
|
||||
const arr = this.fileList.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
let str = ''
|
||||
arr.forEach((v) => {
|
||||
str += v.name + ':' + v.id + ';'
|
||||
})
|
||||
this.formData.annexUrl = str.slice(0, -1)
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const result2 = await maintainPeriod()
|
||||
this.dict.maintainPeriodList = result2
|
||||
// console.log(result2)
|
||||
const result3 = await getDictRepairType()
|
||||
this.dict.maintainType = result3
|
||||
console.log(result3)
|
||||
const result4 = await getDictWorker()
|
||||
this.dict.worker = result4
|
||||
// const listQuery = {
|
||||
// current: 1,
|
||||
// size: 500
|
||||
// }
|
||||
// await dataDictionaryDataList(Object.assign(listQuery, {
|
||||
// dictTypeId: '1393401964580093954'
|
||||
// })).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.dict.maintainType = response.data.records
|
||||
// }
|
||||
// })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
/* 上传按钮样式 */
|
||||
.uploadButton{
|
||||
width: 106px;
|
||||
height: 32px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
</style>
|
||||
480
src/views/EquipmentManager/MaintainPlan/EditForm.vue
Normal file
480
src/views/EquipmentManager/MaintainPlan/EditForm.vue
Normal file
@@ -0,0 +1,480 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="readonly ? $t('module.equipmentManager.maintainplan.maintainPlanDetail') : $t('module.equipmentManager.maintainplan.editDialogTitle')" class="dialog" width="50%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" label-width="110px">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.maintenanceOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenanceOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderequipmentId')"
|
||||
clearable
|
||||
filterable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
@change="getCode($event)"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
:disabled="item.disabled"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.equipmentCode')" prop="equipmentCode">
|
||||
<el-input v-model="formData.equipmentCode" disabled :placeholder="$t('module.equipmentManager.maintainplan.placeholderequipmentCode')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainType')" prop="maintainTypeId">
|
||||
<el-select
|
||||
v-model="formData.maintainTypeId"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainplan.placeholdermaintainType')])"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintainWorkerId')" prop="maintainWorkerId">
|
||||
<el-select v-model="formData.maintainWorkerId" :disabled="readonly" multiple placeholder="请选择">
|
||||
<el-option
|
||||
v-for="(item,index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item v-if="readonly" :label="$t('module.equipmentManager.maintainplan.lastMaintainWorkerId')">
|
||||
<el-select v-model="lastFormData.maintainWorkerId" :placeholder="$t('module.equipmentManager.maintainplan.lastMaintainWorkerId')" disabled multiple>
|
||||
<el-option
|
||||
v-for="(item,index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.erpIdentification')" prop="erpIdentification">
|
||||
<el-input v-model="formData.erpIdentification" :disabled="readonly" :placeholder="$t('module.equipmentManager.maintainplan.placeholdererpIdentification')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.lastMaintainTime')" prop="lastMaintainTime">
|
||||
<el-date-picker
|
||||
v-model="formData.lastMaintainTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderlastMaintainTime')"
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.nextMaintainTime')" prop="nextMaintainTime">
|
||||
<el-date-picker
|
||||
v-model="formData.nextMaintainTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdernextMaintainTime')"
|
||||
disabled
|
||||
/>
|
||||
</el-form-item> -->
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainStartTime')" prop="maintainStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.maintainStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainStartTime')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainEndTime')" prop="maintainEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.maintainEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainplan.maintainDuration')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintenancePeriodId')" prop="maintenancePeriodId">
|
||||
<!-- <el-input v-model="formData.maintenancePeriodId" disabled :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId')" :style="{width: '100%'}" /> -->
|
||||
<el-select
|
||||
v-model="formData.maintenancePeriodId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainPeriodList"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-form-item v-if="readonly" :label="$t('module.equipmentManager.maintainplan.lastMaintainStartTime')">
|
||||
<el-date-picker
|
||||
v-model="lastFormData.maintainStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="readonly" :label="$t('module.equipmentManager.maintainplan.lastMaintainEndTime')">
|
||||
<el-date-picker
|
||||
v-model="lastFormData.maintainEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.status')" prop="status">
|
||||
<el-select
|
||||
v-model="formData.status"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderstatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
label="未完成"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
label="已完成"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainFuncDesc')" prop="maintainFuncDesc">
|
||||
<el-input v-model="formData.maintainFuncDesc" :disabled="readonly" :placeholder="$t('module.equipmentManager.maintainplan.placeholdermaintainFuncDesc')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :disabled="readonly" :placeholder="$t('module.equipmentManager.maintainplan.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="annex">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:file-list="fileList"
|
||||
:action="uploadPath"
|
||||
:show-file-list="true"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:on-success="handleSuccess"
|
||||
:on-preview="openFile"
|
||||
class="btn"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<!-- size="small" type="primary" icon="el-icon-upload2"-->
|
||||
<el-button :disabled="readonly" class="uploadButton" icon="el-icon-upload2">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!readonly" type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { timeIsBefore } from '@/utils'
|
||||
import { editMaintainPlan, getMaintainPlan } from '@/api/equipment/maintain'
|
||||
import { maintainPeriod, getDictWorker, getDictRepairType } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { equipmentInfoDetail } from '@/api/basicData/Equipment/equipmentInfo'
|
||||
// import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
import { getEqList } from '@/api/equipment/eqManager'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
maintenanceOrderNumber: undefined,
|
||||
maintenancePeriodId: undefined,
|
||||
equipmentId: undefined,
|
||||
maintainStartTime: null,
|
||||
maintainEndTime: null,
|
||||
remark: undefined,
|
||||
annexUrl: undefined,
|
||||
maintainTypeId: undefined
|
||||
},
|
||||
lastFormData: {
|
||||
maintainStartTime: null,
|
||||
maintainEndTime: null,
|
||||
maintainWorkerId: []
|
||||
},
|
||||
uploadPath,
|
||||
fileList: [],
|
||||
dataObj: { typeCode: 'file' },
|
||||
rules: {
|
||||
maintenanceOrderNumber: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintenanceOrderNumber'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenancePeriodId: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintenancePeriodId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainStartTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainStartTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainEndTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
pattern: /^(0|[1-9][0-9]*)$/,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.int'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
maintenancePeriodOptions: [{
|
||||
'label': i18n.t('module.equipmentManager.equipmentVisualization.Week'),
|
||||
'value': 'week'
|
||||
}, {
|
||||
'label': i18n.t('module.equipmentManager.equipmentVisualization.Month'),
|
||||
'value': 'month'
|
||||
}, {
|
||||
'label': i18n.t('module.equipmentManager.equipmentVisualization.Year'),
|
||||
'value': 'year'
|
||||
}],
|
||||
dict: {
|
||||
device: [],
|
||||
maintainPeriodList: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
this.getDict()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
openFile(file) {
|
||||
// console.log(file)
|
||||
window.open(`${location.origin}/api/common/attachment/downloadFile?type=file&attachmentId=${file.id}`)
|
||||
},
|
||||
onOpen() {
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
// console.log(this.formData)
|
||||
// console.log(this.formData.maintainDuration)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
// TODO 提交表单
|
||||
if (this.formData.maintainStartTime && this.formData.maintainEndTime && !timeIsBefore(this.formData.maintainStartTime, this.formData.maintainEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: i18n.t('module.equipmentManager.maintainplan.sort')
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
const result = await editMaintainPlan(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.large'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
// console.log(res)
|
||||
this.fileList.push({ name: file.name, id: res.data[0].id })
|
||||
const arr = this.fileList.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
let str = ''
|
||||
arr.forEach((v) => {
|
||||
str += v.name + ':' + v.id + ';'
|
||||
})
|
||||
this.formData.annexUrl = str.slice(0, -1)
|
||||
},
|
||||
async getCode($event) {
|
||||
const result = await equipmentInfoDetail($event)
|
||||
if (result.code === 0) {
|
||||
this.formData.equipmentCode = result.data.code
|
||||
this.formData.maintenancePeriodId = result.data.maintenanceCycle
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getMaintainPlan({
|
||||
// eslint-disable-next-line no-undef
|
||||
id: this.targetInfo?.id,
|
||||
current: 1,
|
||||
size: 10
|
||||
})
|
||||
if (result.code === 0) {
|
||||
// console.log(result)
|
||||
this.formData = result.data[0]
|
||||
// console.log(this.formData)
|
||||
if (this.readonly && this.formData.lastMaintainPlanId) {
|
||||
this.getLastInfo(this.formData.lastMaintainPlanId)
|
||||
}
|
||||
// console.log(this.formData.annexUrl)
|
||||
// this.formData.maintainWorker = this.formData.maintainWorker.split(',')
|
||||
if (this.formData.annexUrl) {
|
||||
const arr = this.formData.annexUrl.split(';').map(v => {
|
||||
const obj = {}
|
||||
const a = v.split(':')
|
||||
obj.name = a[0]
|
||||
obj.id = a[1]
|
||||
return obj
|
||||
})
|
||||
this.fileList = arr
|
||||
console.log(this.fileList)
|
||||
}
|
||||
}
|
||||
},
|
||||
async getLastInfo(id) {
|
||||
const result = await getMaintainPlan({
|
||||
id,
|
||||
current: 1,
|
||||
size: 10
|
||||
})
|
||||
if (result.code === 0 && result.data.records.length > 0) {
|
||||
this.lastFormData = result.data.records[0]
|
||||
this.lastFormData.maintainWorker = this.lastFormData.maintainWorker.split(',')
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getEqList({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result.data.records
|
||||
const result2 = await maintainPeriod()
|
||||
this.dict.maintainPeriodList = result2
|
||||
const result3 = await getDictRepairType()
|
||||
this.dict.maintainType = result3
|
||||
const result4 = await getDictWorker()
|
||||
console.log(result4)
|
||||
this.dict.worker = result4
|
||||
// const listQuery = {
|
||||
// current: 1,
|
||||
// size: 500
|
||||
// }
|
||||
// await dataDictionaryDataList(Object.assign(listQuery, {
|
||||
// dictTypeId: '1393401964580093954'
|
||||
// })).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.dict.maintainType = response.data.records
|
||||
// }
|
||||
// })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
/* 上传按钮样式 */
|
||||
.uploadButton{
|
||||
width: 106px;
|
||||
height: 32px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
.uploadIcon{
|
||||
background: url('../../../assets/img/uploadIcon.png')no-repeat;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
</style>
|
||||
289
src/views/EquipmentManager/MaintainPlan/index.vue
Normal file
289
src/views/EquipmentManager/MaintainPlan/index.vue
Normal file
@@ -0,0 +1,289 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-08-09 12:15:13
|
||||
* @LastEditors: fzq
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\MaintainPlan\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="160" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tableHeight } from '@/utils/index'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
import { timeFormatter } from '@/filters'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'issue',
|
||||
btnName: i18n.t('module.equipmentManager.maintainplan.checklog')
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
// 暂时隐藏
|
||||
const tableProps = [{
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.equipmentId')
|
||||
// filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'maintenanceOrderNumber',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintenanceOrderNumber')
|
||||
},
|
||||
// {
|
||||
// prop: 'status',
|
||||
// label: i18n.t('module.equipmentManager.maintainplan.status'),
|
||||
// filter: dataDict('doneStatus')
|
||||
// },
|
||||
// {
|
||||
// prop: 'groupName',
|
||||
// label: i18n.t('module.equipmentManager.maintainplan.EquipmentGrouping'),
|
||||
// isFixed: true
|
||||
// },
|
||||
{
|
||||
prop: 'maintainStartTime',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintainStartTime'),
|
||||
filter: timeFormatter
|
||||
},
|
||||
{
|
||||
prop: 'maintainEndTime',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintainEndTime'),
|
||||
filter: timeFormatter
|
||||
},
|
||||
{
|
||||
prop: 'maintainDuration',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintainDuration')
|
||||
}, {
|
||||
prop: 'maintenancePeriod',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintenancePeriodId')
|
||||
},
|
||||
{
|
||||
prop: 'maintainType',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.maintainType')
|
||||
// filter: dataDict('doneStatus')
|
||||
},
|
||||
{
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.maintainplan.remark')
|
||||
}
|
||||
]
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import { objFilter } from '@/utils'
|
||||
// edit here
|
||||
import { getMaintainPlanPage, delMaintainPlan } from '@/api/equipment/maintain'
|
||||
import { getRepairDictDevice } from '@/api/dict'
|
||||
// import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
tableH: tableHeight(280),
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
status: null,
|
||||
equipmentId: null,
|
||||
startTime: null,
|
||||
endTime: null
|
||||
},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainplan.placeholderequipmentId'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentName'
|
||||
},
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: this.$t('module.equipmentManager.maintainplan.searchPlaceholder'),
|
||||
// selectOptions: [{ id: '0', name: i18n.t('module.equipmentManager.repair.undone') }, { id: '1', name: i18n.t('module.equipmentManager.repair.done') }],
|
||||
// param: 'status'
|
||||
// },
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '',
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd hh:mm:ss',
|
||||
valueFormat: 'yyyy-MM-dd hh:mm:ss',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.equipmentManager.maintainplan.startTime'),
|
||||
endPlaceholder: this.$t('module.equipmentManager.maintainplan.endTime'),
|
||||
param: 'searchTime'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.add',
|
||||
// name: 'add',
|
||||
// color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
this.getDict()
|
||||
},
|
||||
mounted() {
|
||||
// 固定表头，表格的最大高度随页面的高度自动调整
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleNodeClick() {},
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delMaintainPlan({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
}
|
||||
this.getList()
|
||||
})
|
||||
break
|
||||
case 'detail':
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'issue':
|
||||
this.$router.push({
|
||||
name: 'MaintainLog',
|
||||
query: {
|
||||
orderId: raw.data.id
|
||||
}
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getRepairDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
// console.log(result)
|
||||
this.headFormConfig[0].selectOptions = result
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.status = this.headFormValue.status
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName
|
||||
this.listQuery.id = this.headFormValue.id
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : ''
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : ''
|
||||
// console.log(objFilter(this.listQuery))
|
||||
const res = await getMaintainPlanPage(objFilter(this.listQuery))
|
||||
// 接口问题，接口没有返回total等
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
// console.log(this.list)
|
||||
console.log(res)
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
} else if (this.headFormValue.btnName === 'add') {
|
||||
this.showDialog = true// 新增
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.showDialog = true// 新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,429 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.repair.repairExpertAdd')" class="dialog" width="45%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairOrderNumber')" prop="repairOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.repairOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceStatus')" prop="maintenanceStatus">
|
||||
<el-select
|
||||
v-model="formData.maintenanceStatus"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceStatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
label="未完成"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
label="已完成"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceWorker')" prop="maintenanceWorker">
|
||||
<el-select
|
||||
v-model="formData.maintenanceWorker"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceWorker')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-input v-model="formData.equipmentPosition" :placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.workerContactInformation')" prop="workerContactInformation">
|
||||
<el-input
|
||||
v-model="formData.workerContactInformation"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderworkerContactInformation')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timeOfFailure')" prop="timeOfFailure">
|
||||
<el-date-picker
|
||||
v-model="formData.timeOfFailure"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-ddTHH:mm:ss"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdertimeOfFailure')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultLevel')" prop="faultLevel">
|
||||
<el-select v-model="formData.faultLevel" :placeholder="$t('module.equipmentManager.repair.placeholderfaultLevel')" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.faultLevel"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="15">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timerange')" prop="maintenanceStartTime">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="datetimerange"
|
||||
:style="{width: '100%'}"
|
||||
:start-placeholder="$t('module.equipmentManager.repair.startDate')"
|
||||
:end-placeholder="$t('module.equipmentManager.repair.endDate')"
|
||||
clearable
|
||||
@change="dateChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairMode')" prop="repairMode">
|
||||
<el-select
|
||||
v-model="formData.repairMode"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairMode')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.repairType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultDetail')" prop="faultDetail">
|
||||
<el-input
|
||||
v-model="formData.faultDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderfaultDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:maxlength="200"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceDetail')" prop="maintenanceDetail">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:maxlength="200"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.annex')" prop="annex">
|
||||
<single-file :file-id="formData.annex" @done="uploadSuccess" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairTools')" prop="repairTools">
|
||||
<el-input v-model="formData.repairTools" :placeholder="$t('module.equipmentManager.repair.placeholderrepairTools')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.repair.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { add } from '@/api/equipment/knowledge'
|
||||
import { getDictDevice, getDictRepairType, getDictWorker, faultLevelList } from '@/api/dict'
|
||||
import SingleFile from '@/components/Upload/SingleFile'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {
|
||||
SingleFile
|
||||
},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
repairOrderNumber: undefined,
|
||||
equipmentId: undefined,
|
||||
equipmentName: undefined,
|
||||
maintenanceWorker: [],
|
||||
maintenanceStatus: undefined,
|
||||
equipmentPosition: undefined,
|
||||
workerContactInformation: undefined,
|
||||
timeOfFailure: undefined,
|
||||
faultLevel: undefined,
|
||||
maintenanceStartTime: null,
|
||||
maintenanceFinishTime: null,
|
||||
repairMode: undefined,
|
||||
faultDetail: undefined,
|
||||
maintenanceDetail: undefined,
|
||||
annex: '',
|
||||
repairTools: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
dateRange: null,
|
||||
rules: {
|
||||
repairOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairOrderNumber'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceWorker: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceWorker'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStatus: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceStatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentPosition: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentPosition'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
workerContactInformation: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderworkerContactInformation'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
timeOfFailure: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdertimeOfFailure'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultLevel: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultLevel'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
repairMode: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairMode'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStartTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholdertime'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceFinishTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholdertime'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
annexAction: uploadPath,
|
||||
annexfileList: [],
|
||||
dict: {
|
||||
device: [],
|
||||
repairType: [],
|
||||
worker: [],
|
||||
faultLevel: []
|
||||
},
|
||||
deviceObj: {}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {},
|
||||
onClose() {
|
||||
// this.$refs['elForm'].resetFields()
|
||||
this.resetForm()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
uploadSuccess(id) {
|
||||
console.log(id)
|
||||
this.formData.annex = id
|
||||
},
|
||||
dateChange(date) {
|
||||
console.log(date)
|
||||
this.formData.maintenanceStartTime = date[0]
|
||||
this.formData.maintenanceFinishTime = date[1]
|
||||
},
|
||||
submitForm() {
|
||||
console.log(this.formData)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
this.formData.equipmentName = this.deviceObj[this.formData.equipmentId]
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.join(',')
|
||||
}
|
||||
const result = await add(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.dateRange = null
|
||||
this.formData.maintenanceStartTime = null
|
||||
this.formData.maintenanceFinishTime = null
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message.error('文件大小超过 10MB')
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
result.map(item => {
|
||||
this.deviceObj[item.id] = item.name
|
||||
})
|
||||
const result2 = await getDictRepairType()
|
||||
this.dict.repairType = result2
|
||||
const result3 = await getDictWorker()
|
||||
this.dict.worker = result3
|
||||
const result4 = await faultLevelList()
|
||||
this.dict.faultLevel = result4
|
||||
// const result5 = await getCode()
|
||||
// this.formData.repairOrderNumber = result5.data
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
}
|
||||
// equipmentIdChange(index) {
|
||||
// this.formData.equipmentName = this.dict.device[index]
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
// .page-form-container {
|
||||
// padding: 20px;
|
||||
// .method-btn-area {
|
||||
// padding: 15px 30px;
|
||||
// margin: 10px 0 20px 0;
|
||||
// border: 1px solid #dfe6ec;
|
||||
// }
|
||||
// }
|
||||
// .form-container {
|
||||
// padding-top: 40px;
|
||||
// }
|
||||
// .el-upload__tip {
|
||||
// line-height: 1.2;
|
||||
// }
|
||||
.form-container {
|
||||
padding: 30px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,446 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="readonly ? $t('module.equipmentManager.repair.repairExpertDetail') : $t('module.equipmentManager.repair.repairExpertEdit')" class="dialog" width="45%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairOrderNumber')" prop="repairOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.repairOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceStatus')" prop="maintenanceStatus">
|
||||
<el-select
|
||||
v-model="formData.maintenanceStatus"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceStatus')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
label="未完成"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
label="已完成"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceWorker')" prop="maintenanceWorker">
|
||||
<el-select
|
||||
v-model="formData.maintenanceWorker"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceWorker')"
|
||||
clearable
|
||||
multiple
|
||||
:disabled="readonly"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-input v-model="formData.equipmentPosition" :placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.workerContactInformation')" prop="workerContactInformation">
|
||||
<el-input
|
||||
v-model="formData.workerContactInformation"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderworkerContactInformation')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timeOfFailure')" prop="timeOfFailure">
|
||||
<el-date-picker
|
||||
v-model="formData.timeOfFailure"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdertimeOfFailure')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultLevel')" prop="faultLevel">
|
||||
<el-select v-model="formData.faultLevel" :placeholder="$t('module.equipmentManager.repair.placeholderfaultLevel')" clearable :style="{width: '100%'}" :disabled="readonly">
|
||||
<el-option
|
||||
v-for="(item, index) in dict.faultLevel"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="15">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timerange')" prop="maintenanceStartTime">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="datetimerange"
|
||||
:style="{width: '100%'}"
|
||||
:start-placeholder="$t('module.equipmentManager.repair.startDate')"
|
||||
:end-placeholder="$t('module.equipmentManager.repair.endDate')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
@change="dateChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairMode')" prop="repairMode">
|
||||
<el-select
|
||||
v-model="formData.repairMode"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairMode')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.repairType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultDetail')" prop="faultDetail">
|
||||
<el-input
|
||||
v-model="formData.faultDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderfaultDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
:maxlength="200"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceDetail')" prop="maintenanceDetail">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
:maxlength="200"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.annex')" prop="annex">
|
||||
<single-file :file-id="formData.annex" :disabled="readonly" @done="uploadSuccess" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairTools')" prop="repairTools">
|
||||
<el-input v-model="formData.repairTools" :disabled="readonly" :placeholder="$t('module.equipmentManager.repair.placeholderrepairTools')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.repair.placeholderremark')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button v-if="!readonly" type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!readonly" @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
<el-button v-if="readonly" @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { edit, getInfo } from '@/api/equipment/knowledge'
|
||||
import { getDictDevice, getDictRepairType, getDictWorker, faultLevelList } from '@/api/dict'
|
||||
import SingleFile from '@/components/Upload/SingleFile'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {
|
||||
SingleFile
|
||||
},
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
repairOrderNumber: undefined,
|
||||
equipmentId: undefined,
|
||||
maintenanceWorker: [],
|
||||
maintenanceStatus: null,
|
||||
equipmentPosition: undefined,
|
||||
workerContactInformation: undefined,
|
||||
timeOfFailure: undefined,
|
||||
faultLevel: undefined,
|
||||
maintenanceStartTime: null,
|
||||
maintenanceFinishTime: null,
|
||||
repairMode: undefined,
|
||||
faultDetail: undefined,
|
||||
maintenanceDetail: undefined,
|
||||
annex: '',
|
||||
repairTools: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
dateRange: null,
|
||||
rules: {
|
||||
repairOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairOrderNumber'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceWorker: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceWorker'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStatus: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceStatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentPosition: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentPosition'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
workerContactInformation: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderworkerContactInformation'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
timeOfFailure: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdertimeOfFailure'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultLevel: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultLevel'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
repairMode: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairMode'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStartTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholdertime'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceFinishTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholdertime'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
dict: {
|
||||
device: [],
|
||||
repairType: [],
|
||||
worker: [],
|
||||
faultLevel: []
|
||||
},
|
||||
deviceObj: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// readonly() {
|
||||
// return this.$route.query.type === 'readonly'
|
||||
// },
|
||||
id() {
|
||||
// return this.$route.query.id
|
||||
return this.targetInfo.id
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
// this.getDict()
|
||||
// this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDict()
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
uploadSuccess(id) {
|
||||
console.log(id)
|
||||
this.formData.annex = id
|
||||
},
|
||||
dateChange(date) {
|
||||
this.formData.maintenanceStartTime = date[0]
|
||||
this.formData.maintenanceFinishTime = date[1]
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.dateRange) {
|
||||
this.formData.maintenanceStartTime = this.dateRange[0]
|
||||
this.formData.maintenanceFinishTime = this.dateRange[1]
|
||||
} else {
|
||||
this.formData.maintenanceStartTime = ''
|
||||
this.formData.maintenanceFinishTime = ''
|
||||
}
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.join(',')
|
||||
}
|
||||
this.formData.equipmentName = this.deviceObj[this.formData.equipmentId]
|
||||
const result = await edit(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.dateRange = null
|
||||
this.formData.maintenanceStartTime = null
|
||||
this.formData.maintenanceFinishTime = null
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
result.map(item => {
|
||||
this.deviceObj[item.id] = item.name
|
||||
})
|
||||
const result2 = await getDictRepairType()
|
||||
this.dict.repairType = result2
|
||||
const result3 = await getDictWorker()
|
||||
this.dict.worker = result3
|
||||
const result4 = await faultLevelList()
|
||||
this.dict.faultLevel = result4
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getInfo({
|
||||
id: this.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
if (this.formData.maintenanceStartTime && this.formData.maintenanceFinishTime) {
|
||||
this.dateRange = [this.formData.maintenanceStartTime, this.formData.maintenanceFinishTime]
|
||||
}
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.split(',')
|
||||
}
|
||||
}
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.page-form-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.form-container {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,50 @@
|
||||
<!--
|
||||
* @Date: 2021-02-20 10:45:21
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2022-06-15 14:57:06
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\MaintenanceExpertlibrary\components\DataDictFilter.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<span @click="emitClick">
|
||||
{{ result }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { dictChange } from '@/utils'
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dict: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
result() {
|
||||
return this.injectData[this.injectData.prop].split(',').map(item => {
|
||||
return this.dict[item]
|
||||
}).join(',')
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
emitClick() {
|
||||
console.log(this.injectData)
|
||||
},
|
||||
async getDict() {
|
||||
if (this.injectData.filter) {
|
||||
const result = await this.injectData.filter()
|
||||
this.dict = dictChange(result, { key: 'id', value: 'name' })
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
300
src/views/EquipmentManager/MaintenanceExpertlibrary/index.vue
Normal file
300
src/views/EquipmentManager/MaintenanceExpertlibrary/index.vue
Normal file
@@ -0,0 +1,300 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-08-25 17:04:53
|
||||
* @LastEditors: fzq
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\MaintenanceExpertlibrary\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="120" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<!-- total > listQuery.size -->
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<!-- 新增弹窗 -->
|
||||
<!-- :order-id="{orderId: orderId}" -->
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<!-- 编辑/详情弹窗 -->
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
import DictFilter from './components/DataDictFilter'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
import { timeFormatter } from '@/filters'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'createTime',
|
||||
label: i18n.t('module.equipmentManager.repair.createTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'repairOrderNumber',
|
||||
label: i18n.t('module.equipmentManager.repair.repairOrderNumber')
|
||||
}, {
|
||||
prop: 'maintenanceStartTime',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceStartTime'),
|
||||
filter: timeFormatter
|
||||
}, {
|
||||
prop: 'maintenanceFinishTime',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceFinishTime'),
|
||||
filter: timeFormatter
|
||||
// }, {
|
||||
// prop: 'maintenanceStatus',
|
||||
// label: i18n.t('module.equipmentManager.repair.maintenanceStatus'),
|
||||
// filter: dataDict('doneStatus')
|
||||
}, {
|
||||
prop: 'maintenanceDuration',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceDuration')
|
||||
}, {
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.repair.equipmentName')
|
||||
}, {
|
||||
prop: 'maintenanceWorker',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceWorker'),
|
||||
subcomponent: DictFilter,
|
||||
filter: getDictWorker
|
||||
}, {
|
||||
prop: 'workerContactInformation',
|
||||
label: i18n.t('module.equipmentManager.repair.workerContactInformation')
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.repair.remark')
|
||||
}]
|
||||
import AddForm from './AddMaintenanceExpertLibrary'
|
||||
import EditForm from './EditMaintenanceExpertLibrary'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { objFilter } from '@/utils'
|
||||
import { getRepairDictDevice } from '@/api/dict'
|
||||
import { list, del } from '@/api/equipment/knowledge'
|
||||
import { getDictWorker } from '@/api/dict'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
datepicker: [],
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
equipmentName: '',
|
||||
equipmentId: '',
|
||||
id: '',
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
maintenanceStatus: 1
|
||||
},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
param: 'equipmentName'
|
||||
},
|
||||
// {
|
||||
// type: 'input',
|
||||
// label: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
// placeholder: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
// param: 'equipmentName'
|
||||
// },
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: i18n.t('module.basicData.staff.State'),
|
||||
// selectOptions: [
|
||||
// { id: 1, name: i18n.t('module.equipmentManager.repair.done') },
|
||||
// { id: 0, name: i18n.t('module.equipmentManager.repair.undone') }
|
||||
// ],
|
||||
// param: 'maintenanceStatus'
|
||||
// },
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '',
|
||||
dateType: 'daterange',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.equipmentManager.repair.startDate'),
|
||||
endPlaceholder: this.$t('module.equipmentManager.repair.endDate'),
|
||||
param: 'searchTime'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.add',
|
||||
// name: 'add',
|
||||
// color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.export',
|
||||
// name: 'export',
|
||||
// color: 'success'
|
||||
// }
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDict()
|
||||
// this.listLoading = false
|
||||
this.getList()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
// console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await del({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
// this.$router.push({
|
||||
// name: 'EditMaintenanceExpertLibrary',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'detail':
|
||||
// this.$router.push({
|
||||
// name: 'EditMaintenanceExpertLibrary',
|
||||
// query: {
|
||||
// id: raw.data.id,
|
||||
// type: 'readonly'
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
console.log(this.headFormValue)
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
this.listQuery.maintenanceStatus = this.headFormValue.maintenanceStatus
|
||||
const res = await list(objFilter(this.listQuery))
|
||||
console.log(res)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records || []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getRepairDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.headFormConfig[0].selectOptions = result
|
||||
this.getList()
|
||||
},
|
||||
toAddPage() {
|
||||
this.$router.push({
|
||||
name: 'AddMaintenanceExpertLibrary'
|
||||
})
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
} else if (this.headFormValue.btnName === 'add') {
|
||||
// this.toAddPage()
|
||||
this.showDialog = true// 弹窗新增
|
||||
} else if (this.headFormValue.btnName === 'export') {
|
||||
this.exportExcel()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
// this.toAddPage()// 新增
|
||||
this.showDialog = true// 弹窗新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
127
src/views/EquipmentManager/ProcessData/Details.vue
Normal file
127
src/views/EquipmentManager/ProcessData/Details.vue
Normal file
@@ -0,0 +1,127 @@
|
||||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-06-26 16:53:05
|
||||
* @LastEditTime: 2021-06-29 17:30:31
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\ProcessData\Details.vue
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<div id="main" style="width: 1000px;height: 800px;" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getProcess } from '@/api/equipment/process'
|
||||
// import * as echarts from 'echarts'
|
||||
import echarts from 'echarts'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
eventId: this.$route.query.eventId,
|
||||
ParameterName: this.$route.query.ParameterName,
|
||||
charts: '',
|
||||
opinionData: ['3', '2', '4', '4', '5'],
|
||||
time: [],
|
||||
value: [],
|
||||
upperLimit: '',
|
||||
lowerLimit: '',
|
||||
y: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
async getData() {
|
||||
const result = await getProcess({
|
||||
eventId: this.eventId
|
||||
})
|
||||
if (result.code === 0) {
|
||||
console.log(result.data)
|
||||
this.lowerLimit = result.data[1].lowerLimit
|
||||
this.upperLimit = result.data[1].upperLimit
|
||||
this.y = [this.lowerLimit - 10, this.lowerLimit - 5, this.lowerLimit, this.lowerLimit * 1 + 5, this.upperLimit, this.upperLimit * 1 + 5, this.upperLimit * 1 + 10]
|
||||
console.log(this.y)
|
||||
result.data.forEach(element => {
|
||||
this.time.unshift(element.createTime.slice(11))
|
||||
this.value.unshift(element.parameterValue)
|
||||
})
|
||||
console.log(this.value)
|
||||
var data = [
|
||||
[this.time[0], this.value[0]],
|
||||
[this.time[1], this.value[1]],
|
||||
[this.time[2], this.value[2]],
|
||||
[this.time[3], this.value[3]],
|
||||
[this.time[4], this.value[4]],
|
||||
[this.time[5], this.value[5]],
|
||||
[this.time[6], this.value[6]],
|
||||
[this.time[7], this.value[7]],
|
||||
[this.time[8], this.value[8]],
|
||||
[this.time[9], this.value[9]],
|
||||
[this.time[10], this.value[10]]
|
||||
]
|
||||
var chartDom = document.getElementById('main')
|
||||
var myChart = echarts.init(chartDom)
|
||||
var option
|
||||
option = {
|
||||
xAxis: {
|
||||
name: '时间/分钟',
|
||||
axisLabel: {
|
||||
show: true,
|
||||
inside: false, // 是否朝内
|
||||
rotate: 0, // 旋转角度
|
||||
margin: 5, // 刻度标签与轴线之间的距离
|
||||
color: '#999'
|
||||
},
|
||||
data: this.time
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
// scale: true,
|
||||
name: this.ParameterName,
|
||||
min: this.lowerLimit * 1 - 10,
|
||||
max: this.upperLimit * 1 + 10
|
||||
},
|
||||
legend: {
|
||||
data: ['标准值']
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
series: [{
|
||||
data: data,
|
||||
type: 'scatter',
|
||||
markArea: {
|
||||
data: [
|
||||
[{
|
||||
yAxis: this.lowerLimit * 1,
|
||||
itemStyle: {
|
||||
color: '#81b22f'
|
||||
}
|
||||
}, {
|
||||
yAxis: this.upperLimit
|
||||
}]
|
||||
]
|
||||
}
|
||||
}]
|
||||
}
|
||||
option && myChart.setOption(option)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
303
src/views/EquipmentManager/ProcessData/ProcessData.vue
Normal file
303
src/views/EquipmentManager/ProcessData/ProcessData.vue
Normal file
@@ -0,0 +1,303 @@
|
||||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-06-25 10:17:15
|
||||
* @LastEditTime: 2021-06-29 21:17:15
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\ProcessData\ProcessData.vue
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<div class="image">
|
||||
<img class="Toughened" src="../../../assets/img/Toughenedfurnace.png" alt="">
|
||||
<div class="box t-data">
|
||||
<el-tag class="one">上部1: {{ top }}℃</el-tag>
|
||||
<el-tag class="two">上部2:{{ top }} ℃</el-tag>
|
||||
<el-tag class="three">上部3:{{ top }} ℃</el-tag>
|
||||
</div>
|
||||
<div class="box b-data">
|
||||
<el-tag class="one" style="height:50px">下部1: {{ bottom }}℃ <br> 下部风栅高度 5 mm </el-tag>
|
||||
<el-tag class="five" style="height:50px">下部2:{{ bottom }}℃ <br> 下部风栅高度 5 mm </el-tag>
|
||||
<el-tag class="six" style="height:50px">下部3:{{ bottom }}℃ <br> 下部风栅高度 5 mm</el-tag>
|
||||
</div>
|
||||
<div class="box rate">
|
||||
<el-tag size=" medium">传输速率:0.05m/ms </el-tag>
|
||||
</div>
|
||||
</div>
|
||||
<div class="left">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-card class="box-card">
|
||||
<div class="text item">
|
||||
高压风机1电流: 11A
|
||||
</div>
|
||||
<div class="text item">
|
||||
高压风机2电流: 11A
|
||||
</div>
|
||||
<div class="text item">
|
||||
低压风机1电流: 11A
|
||||
</div>
|
||||
<div class="text item">
|
||||
低压风机2电流: 11A
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-card class="box-card">
|
||||
<div class="text item">
|
||||
自检合格率:98%
|
||||
</div>
|
||||
<div class="text item">
|
||||
人工检合格率:99%
|
||||
</div>
|
||||
<div class="text item">
|
||||
下电包装合格率:99.8%
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<el-col :span="16">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
width="200"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="ParameterName"
|
||||
label="参数名称"
|
||||
width="200"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="ParametersCode"
|
||||
label="参数编码"
|
||||
width="200"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="currentValue"
|
||||
label="当前值"
|
||||
width="200"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="StandardValues"
|
||||
label="标准值"
|
||||
width="200"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="o">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="handleShow(o.row)"
|
||||
>
|
||||
详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tem: [715, 710, 705, 700, 690],
|
||||
tem1: [725, 720, 715, 705, 695],
|
||||
top: '',
|
||||
bottom: '',
|
||||
current: [11, 13, 15, 14, 18],
|
||||
cur: '',
|
||||
qualified: [99, 99.8, 99.1, 99.5, 99.6],
|
||||
qua: '',
|
||||
list: [],
|
||||
listLoading: true,
|
||||
height: [5, 4, 3, 8, 6],
|
||||
gaodu: '',
|
||||
tableData: [{
|
||||
ParameterName: '上部温度℃',
|
||||
ParametersCode: '213123213',
|
||||
currentValue: '710',
|
||||
StandardValues: '715',
|
||||
eventId: 10001
|
||||
}, {
|
||||
ParameterName: '下部温度℃',
|
||||
ParametersCode: '2131231',
|
||||
currentValue: '705',
|
||||
StandardValues: '710',
|
||||
eventId: 10002
|
||||
}, {
|
||||
ParameterName: '急冷风压',
|
||||
ParametersCode: '3123214',
|
||||
currentValue: '6500',
|
||||
StandardValues: '710',
|
||||
eventId: 10003
|
||||
}, {
|
||||
ParameterName: '冷却时间',
|
||||
ParametersCode: '443434343',
|
||||
currentValue: '50',
|
||||
StandardValues: '710',
|
||||
eventId: 10004
|
||||
}, {
|
||||
ParameterName: '冷却风压',
|
||||
ParametersCode: '434343434',
|
||||
currentValue: '4500',
|
||||
StandardValues: '710',
|
||||
eventId: 10005
|
||||
}]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.changeOne()
|
||||
this.changeTwo()
|
||||
this.changeCurrent()
|
||||
this.changeQualified()
|
||||
this.changeheight()
|
||||
},
|
||||
methods: {
|
||||
changeOne() {
|
||||
setInterval(() => {
|
||||
for (let i = 0; i < this.tem.length; i++) {
|
||||
setTimeout(() => {
|
||||
this.top = this.tem[i]
|
||||
}, 500 * i)
|
||||
}
|
||||
}, 500)
|
||||
},
|
||||
changeTwo() {
|
||||
setInterval(() => {
|
||||
for (let i = 0; i < this.tem.length; i++) {
|
||||
setTimeout(() => {
|
||||
this.bottom = this.tem[i]
|
||||
// console.log(this.tem[i])
|
||||
}, 500 * i)
|
||||
}
|
||||
}, 2500)
|
||||
},
|
||||
changeQualified() {
|
||||
setInterval(() => {
|
||||
for (let i = 0; i < this.qualified.length; i++) {
|
||||
setTimeout(() => {
|
||||
this.qua = this.qualified[i]
|
||||
}, 500 * i)
|
||||
}
|
||||
}, 2500)
|
||||
},
|
||||
handleShow(obj) {
|
||||
const eventId = obj.eventId
|
||||
const ParameterName = obj.ParameterName
|
||||
console.log(eventId)
|
||||
console.log(ParameterName)
|
||||
this.$router.push({
|
||||
path: 'Details',
|
||||
query: {
|
||||
eventId: eventId,
|
||||
ParameterName: ParameterName }
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.image{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.two{
|
||||
margin-left: 150px;
|
||||
}
|
||||
.el-tag{
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
.three{
|
||||
margin-left: 80px;
|
||||
}
|
||||
.five{
|
||||
margin-left: 70px;
|
||||
}
|
||||
.six{
|
||||
margin-left: 50px;
|
||||
}
|
||||
.Toughened{
|
||||
width: 80%;
|
||||
|
||||
}
|
||||
.box {
|
||||
width: 800px;
|
||||
|
||||
.top {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
clear: both;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.left .el-tooltip__popper,
|
||||
.right .el-tooltip__popper {
|
||||
padding: 8px 10px;
|
||||
}
|
||||
}
|
||||
.t-data{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 23%;
|
||||
}
|
||||
.b-data{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
}
|
||||
.rate{
|
||||
position: absolute;
|
||||
left: 30%;
|
||||
top: 50%;
|
||||
}
|
||||
.left{
|
||||
position: absolute;
|
||||
top: 25%;
|
||||
left: 3%;
|
||||
}
|
||||
.right{
|
||||
position: absolute;
|
||||
top: 20%;
|
||||
left: 87%;
|
||||
}
|
||||
</style>
|
||||
132
src/views/EquipmentManager/ProcessData/Processequipment.vue
Normal file
132
src/views/EquipmentManager/ProcessData/Processequipment.vue
Normal file
@@ -0,0 +1,132 @@
|
||||
<!--
|
||||
* @Date: 2022-04-19
|
||||
* @LastEditTime: 2022-04-19
|
||||
* @LastEditors: juzi
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\ProcessData\Processequipment.vue
|
||||
*/
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
/>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import i18n from '@/lang'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableProps = [{
|
||||
prop: 'name',
|
||||
label: '产品名称',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'ParametersCode',
|
||||
label: '规格说明',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'Devicename',
|
||||
label: '设备名称',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'processname',
|
||||
label: '工艺名称',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'processcode',
|
||||
label: '工艺编码',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'Processversion',
|
||||
label: '工艺版本',
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'pass',
|
||||
label: '合格率(%)',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'eventId',
|
||||
label: '分析',
|
||||
align: 'center'
|
||||
}]
|
||||
export default {
|
||||
components: { TopTitle, HeadForm, Pagination, BaseTable },
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
total: 0,
|
||||
list: [{
|
||||
name: '35611325',
|
||||
ParametersCode: '213123213',
|
||||
Devicename: '钢化炉',
|
||||
processname: '715',
|
||||
processcode: '154812',
|
||||
Processversion: '1.02',
|
||||
pass: '99.9',
|
||||
eventId: 10001
|
||||
}],
|
||||
listLoading: false,
|
||||
tableProps,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.equipmentManager.processequipment.productInfo'),
|
||||
placeholder: this.$t('module.equipmentManager.processequipment.productInfo'),
|
||||
param: 'productInfo'
|
||||
},
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.equipmentManager.processequipment.processname'),
|
||||
placeholder: this.$t('module.equipmentManager.processequipment.processname'),
|
||||
param: 'processname'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
// this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
106
src/views/EquipmentManager/ProcessData/Three.vue
Normal file
106
src/views/EquipmentManager/ProcessData/Three.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<!--
|
||||
* @Author: your name
|
||||
* @Date: 2021-06-28 15:31:00
|
||||
* @LastEditTime: 2021-06-29 21:05:31
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @Description: In User Settings Edit
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\ProcessData\Three.vue
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<div id="main" style="width: 1000px;height: 800px;" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
key: 11111
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
async getData() {
|
||||
var chartDom = document.getElementById('main')
|
||||
var myChart = echarts.init(chartDom)
|
||||
var option
|
||||
option = {
|
||||
title: {
|
||||
text: '钢化炉影响因素对比图',
|
||||
top: 10,
|
||||
left: 10
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
backgroundColor: 'rgba(0,0,250,0.2)'
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
bottom: 10,
|
||||
data: (function() {
|
||||
var list = []
|
||||
for (var i = 1; i < 10; i++) {
|
||||
list.push('产品' + i)
|
||||
}
|
||||
return list
|
||||
})()
|
||||
},
|
||||
visualMap: {
|
||||
top: 'middle',
|
||||
right: 10,
|
||||
show: false,
|
||||
color: ['red', 'blue'],
|
||||
calculable: true
|
||||
},
|
||||
radar: {
|
||||
indicator: [
|
||||
{ text: '上部温度', max: 1 },
|
||||
{ text: '下部温度', max: 1 },
|
||||
{ text: '急冷风压', max: 1 },
|
||||
{ text: '急冷时间', max: 1 },
|
||||
{ text: '冷却风压', max: 1 }
|
||||
]
|
||||
},
|
||||
series: (function() {
|
||||
var series = []
|
||||
for (var i = 1; i < 10; i++) {
|
||||
series.push({
|
||||
name: '',
|
||||
type: 'radar',
|
||||
symbol: 'none',
|
||||
lineStyle: {
|
||||
width: 1
|
||||
},
|
||||
emphasis: {
|
||||
areaStyle: {
|
||||
color: 'rgba(0,250,0,0.3)'
|
||||
}
|
||||
},
|
||||
data: [{
|
||||
value: [
|
||||
(10 - i) * 0.2 * 0.5,
|
||||
(10 - i) * 0.11,
|
||||
i * 0.2 * 0.4,
|
||||
i / 8 * 0.5,
|
||||
i * 0.1
|
||||
],
|
||||
name: '产品' + i
|
||||
}]
|
||||
})
|
||||
}
|
||||
return series
|
||||
})()
|
||||
}
|
||||
option && myChart.setOption(option)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
146
src/views/EquipmentManager/RecipeManager/AddForm.vue
Normal file
146
src/views/EquipmentManager/RecipeManager/AddForm.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<!--
|
||||
* @Date: 2021-02-01 16:12:13
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 16:43:32
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\AddForm.vue
|
||||
* @Description: 添加设备类型配方
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.recipe.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.name')" prop="name">
|
||||
<el-input v-model="formData.name" :placeholder="$t('module.equipmentManager.recipe.placeholdername')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.recipe.placeholderdevice')"
|
||||
clearable
|
||||
filterable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.deviceId"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.code')" prop="code">
|
||||
<el-input v-model="formData.code" :placeholder="$t('module.equipmentManager.recipe.placeholdercode')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.description')" prop="description">
|
||||
<el-input v-model="formData.description" :placeholder="$t('module.equipmentManager.recipe.placeholderdescription')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.activationState')" prop="activationState" required>
|
||||
<el-switch v-model="formData.activationState" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.recipe.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
import { addDeviceRecipe, getDeviceRecipeCode } from '@/api/equipment/recipe'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: [],
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
name: undefined,
|
||||
equipmentId: undefined,
|
||||
code: undefined,
|
||||
description: undefined,
|
||||
activationState: 0,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
name: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
code: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [{
|
||||
required: false,
|
||||
message: '请输入配方描述',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
deviceId: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
async onOpen() {
|
||||
const result = await getDeviceRecipeCode()
|
||||
if (result.code === 0) {
|
||||
this.formData.code = result.data
|
||||
}
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addDeviceRecipe(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.deviceId = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
159
src/views/EquipmentManager/RecipeManager/EditForm.vue
Normal file
159
src/views/EquipmentManager/RecipeManager/EditForm.vue
Normal file
@@ -0,0 +1,159 @@
|
||||
<!--
|
||||
* @Date: 2021-02-01 16:12:13
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-05-10 16:56:32
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\EditForm.vue
|
||||
* @Description: 编辑设备类型配方
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.recipe.editDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.name')" prop="name">
|
||||
<el-input v-model="formData.name" :placeholder="$t('module.equipmentManager.recipe.placeholdername')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.recipe.placeholderdevice')"
|
||||
clearable
|
||||
filterable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.deviceId"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.code')" prop="code">
|
||||
<el-input v-model="formData.code" :placeholder="$t('module.equipmentManager.recipe.placeholdercode')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.description')" prop="description">
|
||||
<el-input v-model="formData.description" :placeholder="$t('module.equipmentManager.recipe.placeholderdescription')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.activationState')" prop="activationState" required>
|
||||
<el-switch v-model="formData.activationState" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.recipe.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
import { editDeviceRecipe, getDeviceRecipe } from '@/api/equipment/recipe'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
name: undefined,
|
||||
equipmentId: undefined,
|
||||
code: undefined,
|
||||
description: undefined,
|
||||
activationState: 1,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
name: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
code: [{
|
||||
required: true,
|
||||
message: i18n.t('module.quality.plan.notEmpty'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [{
|
||||
required: false,
|
||||
message: '请输入配方描述',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
deviceId: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
console.log(this.formData.activationState)
|
||||
console.log(this.formData.enabled)
|
||||
const result = await editDeviceRecipe(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceRecipe({
|
||||
// eslint-disable-next-line no-undef
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.deviceId = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
231
src/views/EquipmentManager/RecipeManager/index.vue
Normal file
231
src/views/EquipmentManager/RecipeManager/index.vue
Normal file
@@ -0,0 +1,231 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-04-18
|
||||
* @LastEditors: juzi
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dataDict from '@/filters/DataDict'
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableProps = [{
|
||||
prop: 'equipmentId',
|
||||
label: i18n.t('module.equipmentManager.recipe.equipmentId'),
|
||||
align: 'center',
|
||||
subcomponent: DictFilter,
|
||||
filter: getDictDevice
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.recipe.name'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.recipe.code'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'activationState',
|
||||
label: i18n.t('module.equipmentManager.recipe.activationState'),
|
||||
align: 'center',
|
||||
filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'enabled',
|
||||
label: i18n.t('module.equipmentManager.recipe.enabled'),
|
||||
align: 'center',
|
||||
filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.recipe.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import { objFilter } from '@/utils'
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
// edit here
|
||||
import { getDeviceRecipeList, delDeviceRecipe } from '@/api/equipment/recipe'
|
||||
import DictFilter from '@/components/BaseTable/subcomponents/DataDictFilter'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { TopTitle, HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentId: null,
|
||||
equipmentRecipeName: ''
|
||||
},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.basicData.visual.keyword'),
|
||||
placeholder: this.$t('module.equipmentManager.recipe.searchPlaceholder'),
|
||||
param: 'equipmentRecipeName'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.recipe.deviceselect'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentId'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDict()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleNodeClick() {},
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceRecipe({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'detail':
|
||||
this.$router.push({
|
||||
name: 'RecipeParamManage',
|
||||
query: {
|
||||
id: raw.data.id
|
||||
}
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.equipmentRecipeName = this.headFormValue.equipmentRecipeName
|
||||
const res = await getDeviceRecipeList(objFilter(this.listQuery))
|
||||
if (res.code === 0) {
|
||||
console.log(res)
|
||||
this.list = res.data
|
||||
// this.total = res.data.total err:返回值没有返回分页信息
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.headFormConfig[1].selectOptions = result
|
||||
this.getList()
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.showDialog = true// 新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
118
src/views/EquipmentManager/RecipeManager/subpage/AddForm.vue
Normal file
118
src/views/EquipmentManager/RecipeManager/subpage/AddForm.vue
Normal file
@@ -0,0 +1,118 @@
|
||||
<!--
|
||||
* @Date: 2021-01-09 16:25:11
|
||||
* @LastEditors: guo
|
||||
* @LastEditTime: 2021-03-20 15:46:42
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\subpage\AddForm.vue
|
||||
* @Description: 设备配方添加参数
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.recipeDetail.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.recipeParam')" prop="equipmentParameterId">
|
||||
<el-select
|
||||
v-model="formData.equipmentParameterId"
|
||||
:placeholder="$t('module.equipmentManager.recipeDetail.placeholderrecipeParam')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.param"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.paramValue')" prop="paramValue">
|
||||
<el-input v-model="formData.paramValue" :placeholder="$t('module.equipmentManager.recipeDetail.placeholderparamValue')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.recipeDetail.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addDeviceRecipeParam } from '@/api/equipment/recipe'
|
||||
import { equipmentTypeParam } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
equipmentParameterId: undefined,
|
||||
equipmentRecipeId: null,
|
||||
paramValue: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentParameterId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.recipeDetail.placeholderrecipeParam'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
paramValue: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.recipeDetail.placeholderparamValue'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
param: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentRecipeId = this.targetInfo?.id
|
||||
this.getDict(this.targetInfo?.equipmentType)
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addDeviceRecipeParam(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict(id) {
|
||||
const result = await equipmentTypeParam(id)
|
||||
this.dict.param = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
127
src/views/EquipmentManager/RecipeManager/subpage/EditForm.vue
Normal file
127
src/views/EquipmentManager/RecipeManager/subpage/EditForm.vue
Normal file
@@ -0,0 +1,127 @@
|
||||
<!--
|
||||
* @Date: 2021-01-09 16:25:11
|
||||
* @LastEditors: guo
|
||||
* @LastEditTime: 2021-03-20 15:56:09
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\subpage\EditForm.vue
|
||||
* @Description: 设备配方添加参数
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.recipeDetail.editDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="120px">
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.recipeParam')" prop="equipmentParameterId">
|
||||
<el-select
|
||||
v-model="formData.equipmentParameterId"
|
||||
:placeholder="$t('module.equipmentManager.recipeDetail.placeholderrecipeParam')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.param"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.paramValue')" prop="paramValue">
|
||||
<el-input v-model="formData.paramValue" :placeholder="$t('module.equipmentManager.recipeDetail.placeholderparamValue')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipeDetail.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.recipeDetail.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editDeviceRecipeParam, getDeviceRecipeParam } from '@/api/equipment/recipe'
|
||||
import { equipmentTypeParam } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
equipmentParameterId: undefined,
|
||||
equipmentRecipeId: null,
|
||||
paramValue: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
rules: {
|
||||
equipmentParameterId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.recipeDetail.placeholderrecipeParam'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
paramValue: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.recipeDetail.placeholderparamValue'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
dict: {
|
||||
param: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
// this.formData.equipmentRecipeId = this.targetInfo?.id
|
||||
this.getInfo()
|
||||
this.getDict(this.targetInfo?.equipmentType)
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editDeviceRecipeParam(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict(id) {
|
||||
const result = await equipmentTypeParam(id)
|
||||
this.dict.param = result
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceRecipeParam({
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
269
src/views/EquipmentManager/RecipeManager/subpage/detail.vue
Normal file
269
src/views/EquipmentManager/RecipeManager/subpage/detail.vue
Normal file
@@ -0,0 +1,269 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 16:45:56
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RecipeManager\subpage\detail.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="bom-form-container">
|
||||
<div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<el-form ref="elForm" :model="formData" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.recipe.placeholderdevice')"
|
||||
clearable
|
||||
disabled
|
||||
filterable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.deviceId"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.code')" prop="code">
|
||||
<el-input v-model="formData.code" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.name')" prop="name">
|
||||
<el-input v-model="formData.name" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.description')" prop="description">
|
||||
<el-input v-model="formData.description" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.activationState')" prop="activationState" required>
|
||||
<el-switch v-model="formData.activationState" :disabled="pagetype" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.enabled')" prop="enabled" required>
|
||||
<el-switch v-model="formData.enabled" :disabled="pagetype" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.recipe.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :style="{width: '100%'}" :disabled="pagetype" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- <div class="sub-table-container">
|
||||
<el-divider>{{ $t('module.equipmentManager.recipeDetail.title') }}</el-divider>
|
||||
<div class="method-btn-area">
|
||||
<el-button type="primary" style="float: right;margin: 0 20px;" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
</div> -->
|
||||
<!-- <pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" /> -->
|
||||
<!-- <add-form :visible.sync="showDialog" :target-info="{id: listQuery.equipmentRecipeId, equipmentType: formData.equipmentType }" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, fatherId: listQuery.equipmentRecipeId, equipmentType: formData.equipmentType}" @done="getList" /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import CheckDetail from '@/components/BaseTable/subcomponents/CheckDetail'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'paramCode',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.paramCode'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'paramName',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.paramName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'type',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.type'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'minValue',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.minValue'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'maxValue',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.maxValue'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'defaultValue',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.defaultValue'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'unit',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.unit'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.recipeDetail.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
// import AddForm from './AddForm'
|
||||
// import EditForm from './EditForm'
|
||||
// import BaseTable from '@/components/BaseTable'
|
||||
// import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
// edit here
|
||||
// import { objFilter } from '@/utils'
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
import { getDeviceRecipeParamList, getDeviceRecipe, delDeviceRecipeParam } from '@/api/equipment/recipe'
|
||||
// import { dictChange } from '@/utils'
|
||||
// import Pagination from '@/components/Pagination'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'BOMForm',
|
||||
// components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
enabled: 1,
|
||||
equipmentRecipeId: null,
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
formData: {
|
||||
equipmentCode: undefined,
|
||||
equipmentName: undefined,
|
||||
code: undefined,
|
||||
name: undefined,
|
||||
enabled: 1,
|
||||
remark: undefined
|
||||
},
|
||||
dict: {
|
||||
deviceId: {}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
pagetype() {
|
||||
return true
|
||||
// return false
|
||||
},
|
||||
typeName() {
|
||||
if (this.dict.equipmentTypeTable) {
|
||||
return this.dict.equipmentTypeTable[this.formData.equipmentType]
|
||||
} else {
|
||||
return this.formData.equipmentType
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
console.log(this.$route.query)
|
||||
this.listQuery.equipmentRecipeId = this.$route.query.id
|
||||
this.getDict()
|
||||
this.getDetail()
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceRecipeParam({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
const res = await getDeviceRecipeParamList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDetail() {
|
||||
const result = await getDeviceRecipe({
|
||||
id: this.listQuery.equipmentRecipeId
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// console.log(result)
|
||||
}
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
saveForm() {},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.deviceId = result
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/styles/mixin.scss";
|
||||
.bom-form-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
@include clearfix;
|
||||
}
|
||||
.sub-table-container {
|
||||
margin-top: 80px;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
449
src/views/EquipmentManager/RepairManager/AddRepair.vue
Normal file
449
src/views/EquipmentManager/RepairManager/AddRepair.vue
Normal file
@@ -0,0 +1,449 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.repair.repairAdd')" class="dialog" width="60%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- 返回键 -->
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairOrderNumber')" prop="repairOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.repairOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<!-- :value="{ 'equipmentId': item.id, 'equipmentName': item.name }" -->
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
@click.native="getEquipmentName(item)"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceStatus')" prop="maintenanceStatus">
|
||||
<el-select
|
||||
v-model="formData.maintenanceStatus"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceStatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.undone')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.done')"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceWorker')" prop="maintenanceWorker">
|
||||
<el-select
|
||||
v-model="formData.maintenanceWorker"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceWorker')"
|
||||
multiple
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.workerContactInformation')" prop="workerContactInformation">
|
||||
<el-input
|
||||
v-model="formData.workerContactInformation"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderworkerContactInformation')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultLevel')" prop="faultLevel">
|
||||
<el-select v-model="formData.faultLevel" :placeholder="$t('module.equipmentManager.repair.placeholderfaultLevel')" clearable :style="{width: '100%'}">
|
||||
<!-- <el-option
|
||||
v-for="(item, index) in dict.faultLevel"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/> -->
|
||||
<el-option
|
||||
v-for="item in faultLevelList"
|
||||
:key="item.dataCode"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-input v-model="formData.equipmentPosition" :placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-select
|
||||
v-model="formData.equipmentPosition"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.workshop"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timeOfFailure')" prop="timeOfFailure">
|
||||
<el-date-picker
|
||||
v-model="formData.timeOfFailure"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-ddTHH:mm:ss"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdertimeOfFailure')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row>
|
||||
<el-col :span="15">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timerange')" prop="maintenanceStartTime">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="datetimerange"
|
||||
:style="{width: '100%'}"
|
||||
:start-placeholder="$t('module.equipmentManager.repair.startDate')"
|
||||
:end-placeholder="$t('module.equipmentManager.repair.endDate')"
|
||||
clearable
|
||||
@change="dateChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairMode')" prop="repairMode">
|
||||
<el-select
|
||||
v-model="formData.repairMode"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairMode')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.repairType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultDetail')" prop="faultDetail">
|
||||
<el-input
|
||||
v-model="formData.faultDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderfaultDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:maxlength="200"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceDetail')" prop="maintenanceDetail">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:maxlength="200"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.annex')" prop="annex">
|
||||
<single-file :file-id="formData.annex" @done="uploadSuccess" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairTools')" prop="repairTools">
|
||||
<el-input v-model="formData.repairTools" :placeholder="$t('module.equipmentManager.repair.placeholderrepairTools')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.repair.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { addRepairInfo } from '@/api/equipment/repair'
|
||||
import { getDictDevice, getDictRepairType, getDictWorker, getWorkshop } from '@/api/dict'
|
||||
import SingleFile from '@/components/Upload/SingleFile'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {
|
||||
SingleFile
|
||||
},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
repairOrderNumber: undefined,
|
||||
equipmentId: undefined,
|
||||
equipmentName: undefined,
|
||||
maintenanceWorker: undefined,
|
||||
maintenanceStatus: undefined,
|
||||
equipmentPosition: undefined,
|
||||
workerContactInformation: undefined,
|
||||
timeOfFailure: undefined,
|
||||
faultLevel: undefined,
|
||||
maintenanceStartTime: null,
|
||||
maintenanceFinishTime: null,
|
||||
repairMode: undefined,
|
||||
faultDetail: undefined,
|
||||
maintenanceDetail: undefined,
|
||||
annex: '',
|
||||
repairTools: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
dateRange: null,
|
||||
rules: {
|
||||
repairOrderNumber: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairOrderNumber'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceWorker: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceWorker'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStatus: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceStatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentPosition: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentPosition'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
workerContactInformation: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderworkerContactInformation'),
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.mobile'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
timeOfFailure: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdertimeOfFailure'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultLevel: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultLevel'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
repairMode: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairMode'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceStartTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairMode'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
annexAction: uploadPath,
|
||||
annexfileList: [],
|
||||
faultLevelList: JSON.parse(localStorage.getItem('dictObj'))['1382922999706947585'],
|
||||
dict: {
|
||||
device: [],
|
||||
repairType: [],
|
||||
worker: [],
|
||||
faultLevel: [],
|
||||
workshop: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
uploadSuccess(id) {
|
||||
console.log(id)
|
||||
this.formData.annex = id
|
||||
},
|
||||
dateChange(date) {
|
||||
console.log(date)
|
||||
this.formData.maintenanceStartTime = date[0]
|
||||
this.formData.maintenanceFinishTime = date[1]
|
||||
},
|
||||
submitForm() {
|
||||
console.log(this.formData)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.join(',')
|
||||
}
|
||||
// TODO 提交表单
|
||||
const result = await addRepairInfo(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.dateRange = null
|
||||
this.formData.maintenanceStartTime = null
|
||||
this.formData.maintenanceFinishTime = null
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.larger'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const result2 = await getDictRepairType()
|
||||
this.dict.repairType = result2
|
||||
const result3 = await getDictWorker()
|
||||
this.dict.worker = result3
|
||||
// const result4 = await faultLevelList()
|
||||
// this.dict.faultLevel = result4
|
||||
// const result5 = await getCode()
|
||||
// this.formData.repairOrderNumber = result5.data
|
||||
const result5 = await getWorkshop({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.workshop = result5
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
getEquipmentName(val) {
|
||||
console.log(val)
|
||||
this.formData.equipmentName = val.name
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.page-form-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.form-container {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
</style>
|
||||
485
src/views/EquipmentManager/RepairManager/EditRepair.vue
Normal file
485
src/views/EquipmentManager/RepairManager/EditRepair.vue
Normal file
@@ -0,0 +1,485 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="readonly ? $t('module.equipmentManager.repair.repairDetail') : $t('module.equipmentManager.repair.repairEdit')" class="dialog" width="60%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<!-- <el-row :gutter="15" class="page-form-container"> -->
|
||||
<!-- 返回键 -->
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairOrderNumber')" prop="repairOrderNumber">
|
||||
<el-input
|
||||
v-model="formData.repairOrderNumber"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairOrderNumber')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentId')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
@click.native="getEquipmentName(item)"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceStatus')" prop="maintenanceStatus">
|
||||
<el-select
|
||||
v-model="formData.maintenanceStatus"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceStatus')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.undone')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('module.equipmentManager.repair.done')"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceWorker')" prop="maintenanceWorker">
|
||||
<el-select
|
||||
v-model="formData.maintenanceWorker"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceWorker')"
|
||||
clearable
|
||||
multiple
|
||||
:disabled="readonly"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.workerContactInformation')" prop="workerContactInformation">
|
||||
<el-input
|
||||
v-model="formData.workerContactInformation"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderworkerContactInformation')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timeOfFailure')" prop="timeOfFailure">
|
||||
<el-date-picker
|
||||
v-model="formData.timeOfFailure"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdertimeOfFailure')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultLevel')" prop="faultLevel">
|
||||
<el-select v-model="formData.faultLevel" :placeholder="$t('module.equipmentManager.repair.placeholderfaultLevel')" clearable :style="{width: '100%'}" :disabled="readonly">
|
||||
<!-- <el-option
|
||||
v-for="(item, index) in dict.faultLevel"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/> -->
|
||||
<el-option
|
||||
v-for="item in faultLevelList"
|
||||
:key="item.dataCode"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-input v-model="formData.equipmentPosition" :placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.equipmentPosition')" prop="equipmentPosition">
|
||||
<el-select
|
||||
v-model="formData.equipmentPosition"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderequipmentPosition')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.workshop"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-row>
|
||||
<el-col :span="15">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.timerange')" prop="maintenanceStartTime">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="datetimerange"
|
||||
:style="{width: '100%'}"
|
||||
:start-placeholder="$t('module.equipmentManager.repair.startDate')"
|
||||
:end-placeholder="$t('module.equipmentManager.repair.endDate')"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
@change="dateChange"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="9">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairMode')" prop="repairMode">
|
||||
<el-select
|
||||
v-model="formData.repairMode"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderrepairMode')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.repairType"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.faultDetail')" prop="faultDetail">
|
||||
<el-input
|
||||
v-model="formData.faultDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholderfaultDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
:maxlength="200"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.maintenanceDetail')" prop="maintenanceDetail">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDetail"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.repair.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
:maxlength="200"
|
||||
:disabled="readonly"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.annex')" prop="annex">
|
||||
<single-file :file-id="formData.annex" :disabled="readonly" @done="uploadSuccess" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.repairTools')" prop="repairTools">
|
||||
<el-input v-model="formData.repairTools" :disabled="readonly" :placeholder="$t('module.equipmentManager.repair.placeholderrepairTools')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.repair.placeholderremark')" clearable :style="{width: '100%'}" :disabled="readonly" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button v-if="!readonly" type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!readonly" @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
<el-button v-if="readonly" @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editRepairInfo, getRepairInfo } from '@/api/equipment/repair'
|
||||
import { getDictDevice, getDictRepairType, getDictWorker, faultLevelList, getWorkshop } from '@/api/dict'
|
||||
import SingleFile from '@/components/Upload/SingleFile'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {
|
||||
SingleFile
|
||||
},
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
repairOrderNumber: undefined,
|
||||
equipmentId: undefined,
|
||||
maintenanceWorker: undefined,
|
||||
maintenanceStatus: null,
|
||||
equipmentPosition: undefined,
|
||||
workerContactInformation: undefined,
|
||||
timeOfFailure: undefined,
|
||||
faultLevel: undefined,
|
||||
maintenanceStartTime: null,
|
||||
maintenanceFinishTime: null,
|
||||
repairMode: undefined,
|
||||
faultDetail: undefined,
|
||||
maintenanceDetail: undefined,
|
||||
annex: '',
|
||||
repairTools: undefined,
|
||||
remark: undefined
|
||||
},
|
||||
dateRange: null,
|
||||
rules: {
|
||||
repairOrderNumber: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairOrderNumber'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceWorker: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceWorker'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceStatus: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceStatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
equipmentPosition: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderequipmentPosition'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
workerContactInformation: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderworkerContactInformation'),
|
||||
trigger: 'blur'
|
||||
}, {
|
||||
pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.mobile'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
timeOfFailure: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdertimeOfFailure'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultLevel: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultLevel'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
repairMode: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderrepairMode'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
faultDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderfaultDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDetail: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.repair.placeholderremark'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
faultLevelList: JSON.parse(localStorage.getItem('dictObj'))['1382922999706947585'],
|
||||
dict: {
|
||||
device: [],
|
||||
repairType: [],
|
||||
worker: [],
|
||||
faultLevel: [],
|
||||
workshop: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// readonly() {
|
||||
// // return this.$route.query.type === 'readonly'
|
||||
// return this.targetInfo.readonly === 'readonly'
|
||||
// },
|
||||
id() {
|
||||
// return this.$route.query.id
|
||||
return this.targetInfo.id
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
// this.getDict()
|
||||
// this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDict()
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
uploadSuccess(id) {
|
||||
console.log(id)
|
||||
this.formData.annex = id
|
||||
},
|
||||
dateChange(date) {
|
||||
this.formData.maintenanceStartTime = date[0]
|
||||
this.formData.maintenanceFinishTime = date[1]
|
||||
},
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.dateRange) {
|
||||
this.formData.maintenanceStartTime = this.dateRange[0]
|
||||
this.formData.maintenanceFinishTime = this.dateRange[1]
|
||||
} else {
|
||||
this.formData.maintenanceStartTime = ''
|
||||
this.formData.maintenanceFinishTime = ''
|
||||
}
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.join(',')
|
||||
}
|
||||
const result = await editRepairInfo(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.dateRange = null
|
||||
this.formData.maintenanceStartTime = null
|
||||
this.formData.maintenanceFinishTime = null
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.larger'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const result2 = await getDictRepairType()
|
||||
this.dict.repairType = result2
|
||||
const result3 = await getDictWorker()
|
||||
this.dict.worker = result3
|
||||
const result4 = await faultLevelList()
|
||||
this.dict.faultLevel = result4
|
||||
const result5 = await getWorkshop({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.workshop = result5
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getRepairInfo({
|
||||
id: this.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
this.formData.faultLevel = result.data.faultLevel ? result.data.faultLevel + '' : ''
|
||||
if (this.formData.maintenanceStartTime && this.formData.maintenanceFinishTime) {
|
||||
this.dateRange = [this.formData.maintenanceStartTime, this.formData.maintenanceFinishTime]
|
||||
}
|
||||
if (this.formData.maintenanceWorker) {
|
||||
this.formData.maintenanceWorker = this.formData.maintenanceWorker.split(',')
|
||||
}
|
||||
}
|
||||
console.log(this.formData)
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
getEquipmentName(val) {
|
||||
console.log(val)
|
||||
this.formData.equipmentName = val.name
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.page-form-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.form-container {
|
||||
padding-top: 40px;
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,45 @@
|
||||
<!--
|
||||
* @Author: gtz
|
||||
* @Date: 2022-04-08 11:08:46
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-02 11:12:27
|
||||
* @Description: file content
|
||||
* @FilePath: \mt-bus-fe\src\views\FactoryManage\components\Alarm-status.vue
|
||||
-->
|
||||
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="injectData.maintenanceStatus == 0||injectData.maintenanceStatus == 1" size="mini" :type="injectData.maintenanceStatus == 0||injectData.maintenanceStatus == 1 ? statusTypeList[injectData.maintenanceStatus] : ''">
|
||||
{{ injectData.maintenanceStatus == 0||injectData.maintenanceStatus == 1 ? statusList[injectData.maintenanceStatus] : '' }}
|
||||
</el-tag>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusList: {
|
||||
0: i18n.t('module.equipmentManager.repair.undone'),
|
||||
1: i18n.t('module.equipmentManager.repair.done')
|
||||
},
|
||||
statusTypeList: {
|
||||
0: 'danger',
|
||||
1: 'success'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
386
src/views/EquipmentManager/RepairManager/index.vue
Normal file
386
src/views/EquipmentManager/RepairManager/index.vue
Normal file
@@ -0,0 +1,386 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-09-02 10:33:18
|
||||
* @LastEditors: fzq
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\RepairManager\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="trueWidth" :method-list="tableBtn" :is-fixed="true" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<!-- 新增弹窗 -->
|
||||
<!-- :order-id="{orderId: orderId}" -->
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<!-- 编辑/详情弹窗 -->
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tableHeight } from '@/utils/index'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// import DictFilter from '@/components/BaseTable/subcomponents/DataDictFilter'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
import { timeFormatter } from '@/filters'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'createTime',
|
||||
label: i18n.t('module.equipmentManager.repair.createTime'),
|
||||
filter: timeFormatter,
|
||||
width: '180px'
|
||||
}, {
|
||||
prop: 'repairOrderNumber',
|
||||
label: i18n.t('module.equipmentManager.repair.repairOrderNumber')
|
||||
}, {
|
||||
prop: 'maintenanceStartTime',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceStartTime'),
|
||||
filter: timeFormatter,
|
||||
width: '180px'
|
||||
}, {
|
||||
prop: 'maintenanceFinishTime',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceFinishTime'),
|
||||
filter: timeFormatter,
|
||||
width: '180px'
|
||||
}, {
|
||||
prop: 'maintenanceStatus',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceStatus'),
|
||||
// filter: dataDict('doneStatus')
|
||||
subcomponent: Status
|
||||
}, {
|
||||
prop: 'maintenanceDuration',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceDuration')
|
||||
}, {
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.repair.equipmentName')
|
||||
// filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'maintenanceWorker',
|
||||
label: i18n.t('module.equipmentManager.repair.maintenanceWorker')
|
||||
// subcomponent: DictFilter,
|
||||
// filter: getDictWorker
|
||||
}, {
|
||||
prop: 'workerContactInformation',
|
||||
label: i18n.t('module.equipmentManager.repair.workerContactInformation')
|
||||
// filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.repair.remark')
|
||||
}]
|
||||
import AddForm from './AddRepair'
|
||||
import EditForm from './EditRepair'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { objFilter } from '@/utils'
|
||||
import { getRepairDictDevice } from '@/api/dict'
|
||||
import { getRepairList, delRepairInfo } from '@/api/equipment/repair'
|
||||
// import { getDictWorker } from '@/api/dict'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
import Status from './components/Status.vue'
|
||||
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
tableH: tableHeight(280),
|
||||
datepicker: [],
|
||||
list: [],
|
||||
total: 0,
|
||||
trueWidth: 120,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
equipmentName: '',
|
||||
// equipmentId: '',
|
||||
id: '',
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
maintenanceStatus: 1
|
||||
},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
param: 'equipmentName',
|
||||
selectOptions: [],
|
||||
defaultSelect: ''
|
||||
},
|
||||
// {
|
||||
// type: 'input',
|
||||
// label: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
// placeholder: this.$t('module.equipmentManager.repair.searchPlaceholder'),
|
||||
// param: 'equipmentName'
|
||||
// },
|
||||
{
|
||||
type: 'select',
|
||||
label: i18n.t('module.basicData.staff.State'),
|
||||
selectOptions: [
|
||||
{ id: 1, name: i18n.t('module.equipmentManager.repair.done') },
|
||||
{ id: 0, name: i18n.t('module.equipmentManager.repair.undone') }
|
||||
],
|
||||
param: 'maintenanceStatus'
|
||||
},
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '',
|
||||
dateType: 'daterange',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.equipmentManager.repair.startDate'),
|
||||
endPlaceholder: this.$t('module.equipmentManager.repair.endDate'),
|
||||
param: 'searchTime',
|
||||
format: 'yyyy-MM-dd hh:mm:ss',
|
||||
valueFormat: 'yyyy-MM-dd hh:mm:ss'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.add',
|
||||
// name: 'add',
|
||||
// color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.export',
|
||||
// name: 'export',
|
||||
// color: 'success'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getDict()
|
||||
// this.listLoading = false
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
// 固定表头，表格的最大高度随页面的高度自动调整
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delRepairInfo({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
// this.$router.push({
|
||||
// name: 'EditRepair',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'detail':
|
||||
// this.$router.push({
|
||||
// name: 'EditRepair',
|
||||
// query: {
|
||||
// id: raw.data.id,
|
||||
// type: 'readonly'
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
// console.log(this.headFormValue)
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName
|
||||
// this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
// this.listQuery.id = this.headFormValue.id
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
this.listQuery.maintenanceStatus = this.headFormValue.maintenanceStatus
|
||||
const res = await getRepairList(objFilter(this.listQuery))
|
||||
// console.log(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
console.log(res)
|
||||
if (this.list.maintenanceWorker) {
|
||||
this.list.maintenanceWorker = this.list.maintenanceWorker.split(',')
|
||||
}
|
||||
// 采用map方法也可以提取json变为数组格式
|
||||
// this.headFormConfig[0].selectOptions = this.list.map(function(val) {
|
||||
// return {
|
||||
// name: val.equipmentName,
|
||||
// id: val.id
|
||||
// }
|
||||
// })
|
||||
// console.log(this.headFormConfig[0].selectOptions[0])
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getRepairDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
// console.log(this.headFormConfig[0].selectOptions)
|
||||
// console.log(result)
|
||||
this.headFormConfig[0].selectOptions = result
|
||||
this.getList()
|
||||
},
|
||||
// querySearch(queryString, cb) {
|
||||
// var dataList = this.dataList
|
||||
// var results = queryString ? dataList.filter(this.createFilter(queryString)) : dataList
|
||||
// // 调用 callback 返回建议列表的数据
|
||||
// cb(results)
|
||||
// },
|
||||
// createFilter(queryString) {
|
||||
// return (dataList) => {
|
||||
// return (dataList.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
|
||||
// }
|
||||
// },
|
||||
// loadAll() {
|
||||
// var arr = []
|
||||
// for (var i = 0; i < this.list.length; i++) {
|
||||
// arr.push({ 'value': this.list[i].equipmentName })
|
||||
// }
|
||||
// console.log(arr)
|
||||
// return arr
|
||||
// },
|
||||
// handleSelect(item) {
|
||||
// console.log(item)
|
||||
// },
|
||||
toAddPage() {
|
||||
this.$router.push({
|
||||
name: 'AddRepair'
|
||||
})
|
||||
},
|
||||
// exportExcel() {
|
||||
// const params = {
|
||||
// current: 1,
|
||||
// size: 999,
|
||||
// equipmentId: this.headFormValue.equipmentId,
|
||||
// equipmentName: this.headFormValue.equipmentName,
|
||||
// startTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null,
|
||||
// endTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
// }
|
||||
// this.$nextTick(() => {
|
||||
// exportFile(params).then(response => {
|
||||
// let fileName = ''
|
||||
// const contentDisposition = response.headers['content-disposition']
|
||||
// if (contentDisposition) {
|
||||
// fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
|
||||
// }
|
||||
// const blob = new Blob([response.data])
|
||||
// const reader = new FileReader()
|
||||
// reader.readAsDataURL(blob)
|
||||
// reader.onload = (e) => {
|
||||
// const a = document.createElement('a')
|
||||
// a.download = fileName
|
||||
// a.href = e.target.result
|
||||
// document.body.appendChild(a)
|
||||
// a.click()
|
||||
// document.body.removeChild(a)
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
} else if (this.headFormValue.btnName === 'add') {
|
||||
// this.toAddPage()
|
||||
this.showDialog = true// 弹窗新增
|
||||
} else if (this.headFormValue.btnName === 'export') {
|
||||
this.exportExcel()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
// this.toAddPage()// 新增
|
||||
this.showDialog = true// 弹窗新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
132
src/views/EquipmentManager/StatusSetting/EditForm.vue
Normal file
132
src/views/EquipmentManager/StatusSetting/EditForm.vue
Normal file
@@ -0,0 +1,132 @@
|
||||
<!--
|
||||
* @Date: 2021-01-11 09:24:41
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-05-11 10:54:22
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\StatusSetting\EditForm.vue
|
||||
* @Description: 子页面
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" title="修改设备状态" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-form-item :label="$t('module.equipmentManager.statusSetting.devicestatus')" prop="status">
|
||||
<el-select v-model="formData.status" :placeholder="$t('module.equipmentManager.statusSetting.placeholderdevicestatus')" clearable :style="{width: '600px'}">
|
||||
<el-option
|
||||
v-for="(item, index) in statusOptions"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
<div style="position: relative;">
|
||||
<el-tooltip placement="top" style="position: absolute;top: -34px;right: -18px;">
|
||||
<div slot="content"><img src="../../../assets/img/status.png" alt=""></div>
|
||||
<el-button type="text" icon="el-icon-question" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.statusSetting.controlStatus')" prop="controlStatus">
|
||||
<el-select v-model="formData.controlStatus" :placeholder="$t('module.equipmentManager.statusSetting.placeholdercontrolStatus')" clearable :style="{width: '630px'}">
|
||||
<el-option
|
||||
v-for="(item, index) in controlStatusOptions"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editStatusSetting } from '@/api/equipment/index'
|
||||
import { statusList } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
status: null,
|
||||
oldStatus: null,
|
||||
id: null,
|
||||
controlStatus: null
|
||||
},
|
||||
rules: {
|
||||
status: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.statusSetting.placeholderdevicestatus'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
controlStatus: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.statusSetting.placeholdercontrolStatus'),
|
||||
trigger: 'change'
|
||||
}]
|
||||
},
|
||||
statusOptions: [],
|
||||
controlStatusOptions: [
|
||||
{ name: this.$t('module.equipmentManager.statusSetting.controlStatusLocal'), value: 0 },
|
||||
{ name: this.$t('module.equipmentManager.statusSetting.controlStatusOnline'), value: 1 }
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.id = this.targetInfo.id
|
||||
this.formData.status = String(this.targetInfo.status)
|
||||
this.formData.oldStatus = String(this.targetInfo.status)
|
||||
this.formData.controlStatus = this.targetInfo.controlStatus
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editStatusSetting({
|
||||
...this.formData,
|
||||
// eslint-disable-next-line no-undef
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改状态成功!'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await statusList()
|
||||
this.statusOptions = result
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
209
src/views/EquipmentManager/StatusSetting/index.vue
Normal file
209
src/views/EquipmentManager/StatusSetting/index.vue
Normal file
@@ -0,0 +1,209 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-04-18
|
||||
* @LastEditors: juzi
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\StatusSetting\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
>
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, status: curStatus}" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
import ColorSqua from '@/components/BaseTable/subcomponents/ColorSqua'
|
||||
import equipment from '@/filters/equipment'
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
// const statusTableFilter = value => {
|
||||
// const table = {
|
||||
// '0': 'productive',
|
||||
// '1': 'standby',
|
||||
// '2': 'unscheduled downtime',
|
||||
// '3': 'scheduled downtime',
|
||||
// '4': 'engineering',
|
||||
// '5': 'non-scheduled'
|
||||
// }
|
||||
// return table[value] ? table[value] : value
|
||||
// }
|
||||
|
||||
// const colorTable = {
|
||||
// '0': 'rgb(155,187,89)',
|
||||
// '1': 'rgb(255,255,0)',
|
||||
// '2': 'rgb(192,80,77)',
|
||||
// '3': 'rgb(247,150,70)',
|
||||
// '4': 'rgb(79,129,189)',
|
||||
// '5': 'rgb(0,0,0)'
|
||||
// }
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.code'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.name'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'controlStatus',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.controlStatus'),
|
||||
align: 'center',
|
||||
filter: equipment('controlStatus')
|
||||
}, {
|
||||
prop: 'communication',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.communication'),
|
||||
align: 'center',
|
||||
filter: equipment('communication')
|
||||
}, {
|
||||
prop: 'equipmentStatusName',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.status'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'equipmentStatusColor',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.color'),
|
||||
align: 'center',
|
||||
subcomponent: ColorSqua
|
||||
// filter: dataDict('enableState')
|
||||
}, {
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.statusSetting.description'),
|
||||
align: 'center'
|
||||
}]
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getStatusSettingList } from '@/api/equipment'
|
||||
import { statusList } from '@/api/dict'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: {
|
||||
TopTitle,
|
||||
HeadForm,
|
||||
Pagination,
|
||||
BaseTable,
|
||||
MethodBtn,
|
||||
EditForm
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
curStatus: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentName: ''
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: this.$t('module.equipmentManager.statusSetting.searchPlaceholder'),
|
||||
placeholder: this.$t('module.equipmentManager.statusSetting.searchPlaceholder'),
|
||||
param: 'equipmentName'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.statusSetting.searchPlaceholder2'),
|
||||
selectOptions: [],
|
||||
param: 'status'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getDict()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
this.curStatus = raw.data.status
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
|
||||
this.listQuery.equipmentName = this.headFormValue.equipmentName
|
||||
this.listQuery.status = this.headFormValue.status
|
||||
if (this.listQuery.status === '') {
|
||||
delete this.listQuery.status
|
||||
}
|
||||
const res = await getStatusSettingList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records
|
||||
// this.list = res.data.records ? res.data.records.map(item => {
|
||||
// return {
|
||||
// ...item,
|
||||
// color: colorTable[item.status]
|
||||
// }
|
||||
// }) : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getDict() {
|
||||
const result = await statusList()
|
||||
|
||||
this.headFormConfig[1].selectOptions = result
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
55
src/views/EquipmentManager/TypeParamSetting/ColorSqua.vue
Normal file
55
src/views/EquipmentManager/TypeParamSetting/ColorSqua.vue
Normal file
@@ -0,0 +1,55 @@
|
||||
<!--
|
||||
* @Date: 2021-02-20 10:45:21
|
||||
* @LastEditors: guo
|
||||
* @LastEditTime: 2021-03-16 14:36:29
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\ColorSqua.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<span class="color-squa" :style="{'color': color}" @click="emitClick">
|
||||
{{ statusName }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const colorTable = {
|
||||
'0': 'rgb(155,187,89)',
|
||||
'1': 'rgb(255,255,0)',
|
||||
'2': 'rgb(192,80,77)',
|
||||
'3': 'rgb(247,150,70)',
|
||||
'4': 'rgb(79,129,189)',
|
||||
'5': 'rgb(0,0,0)'
|
||||
}
|
||||
const statusTableFilter = value => {
|
||||
const table = {
|
||||
'0': 'productive',
|
||||
'1': 'standby',
|
||||
'2': 'unscheduled downtime',
|
||||
'3': 'scheduled downtime',
|
||||
'4': 'engineering',
|
||||
'5': 'non-scheduled'
|
||||
}
|
||||
return table[value] ? table[value] : value
|
||||
}
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
color() {
|
||||
return colorTable[this.injectData.status]
|
||||
},
|
||||
statusName() {
|
||||
return statusTableFilter(this.injectData.status)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
emitClick() {
|
||||
console.log(this.injectData)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
86
src/views/EquipmentManager/TypeParamSetting/detail.vue
Normal file
86
src/views/EquipmentManager/TypeParamSetting/detail.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 15:48:58
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\detail.vue
|
||||
* @Description: 设备类型参数列表
|
||||
-->
|
||||
<template>
|
||||
<div class="usermanager-container">
|
||||
<div class="info-box">
|
||||
<span class="type">{{ $t('module.equipmentManager.baseinfo.name') }}: {{ info.name }}</span>
|
||||
<span class="code">{{ $t('module.equipmentManager.baseinfo.code') }}: {{ info.code }}</span>
|
||||
</div>
|
||||
<el-tabs type="border-card">
|
||||
<el-tab-pane :label="$t('module.equipmentManager.baseinfo.deviceTypeParam')">
|
||||
<param-page />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('module.equipmentManager.baseinfo.deviceTypeEvent')">
|
||||
<event-page />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('module.equipmentManager.baseinfo.deviceTypeAlarm')">
|
||||
<alarm-page />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDeviceInfo } from '@/api/equipment/param'
|
||||
import ParamPage from './subpage/param'
|
||||
import EventPage from './subpage/event'
|
||||
import AlarmPage from './subpage/alarm'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { ParamPage, EventPage, AlarmPage },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
info: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
id() {
|
||||
return this.$route.query.id
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
async getInfo() {
|
||||
const result = await getDeviceInfo({
|
||||
id: this.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.info = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.usermanager-container {
|
||||
padding: 20px;
|
||||
.info-box {
|
||||
padding: 40px 5px;
|
||||
.code {
|
||||
margin-left: 40px;
|
||||
}
|
||||
}
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
127
src/views/EquipmentManager/TypeParamSetting/index.vue
Normal file
127
src/views/EquipmentManager/TypeParamSetting/index.vue
Normal file
@@ -0,0 +1,127 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-06-29 19:25:49
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\index.vue
|
||||
* @Description: 设备类型参数列表
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.baseinfo.code'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.baseinfo.name'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.baseinfo.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
import { getDeviceList } from '@/api/equipment/param'
|
||||
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { TopTitle, HeadForm, Pagination, BaseTable, MethodBtn },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
name: '',
|
||||
code: ''
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.basicData.visual.keyword'),
|
||||
placeholder: this.$t('module.equipmentManager.baseinfo.searchPlaceholder'),
|
||||
param: 'keywords'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'detail':
|
||||
this.$router.push({
|
||||
name: 'TypeParamDetail',
|
||||
query: {
|
||||
id: raw.data.id
|
||||
}
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.name = this.headFormValue.keywords
|
||||
this.listQuery.code = this.headFormValue.keywords
|
||||
const res = await getDeviceList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
@@ -0,0 +1,132 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 15:57:43
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\alarm\addForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoalarm.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmId')" prop="alarmId">
|
||||
<el-input v-model="formData.alarmId" clearable :style="{width: '100%'}" type="number" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmName')" prop="alarmName">
|
||||
<el-input v-model="formData.alarmName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmCode')" prop="alarmCode">
|
||||
<el-input v-model="formData.alarmCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.category')" prop="category">
|
||||
<el-input v-model="formData.category" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.baseinfoalarm.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">确定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addDeviceAlarmSetting, getDeviceAlarmCode } from '@/api/equipment/param'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
alarmId: undefined,
|
||||
alarmName: undefined,
|
||||
alarmCode: undefined,
|
||||
category: undefined,
|
||||
enabled: 1,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
|
||||
},
|
||||
rules: {
|
||||
alarmId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
alarmName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
alarmCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholdercategory'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [],
|
||||
remark: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentId = this.targetInfo?.id
|
||||
this.getCode()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addDeviceAlarmSetting(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getCode() {
|
||||
const result = await getDeviceAlarmCode()
|
||||
if (result.code === 0) {
|
||||
this.formData.alarmCode = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,134 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 15:58:05
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\alarm\editForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoalarm.editDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmId')" prop="alarmId">
|
||||
<el-input v-model="formData.alarmId" clearable :style="{width: '100%'}" type="number" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmName')" prop="alarmName">
|
||||
<el-input v-model="formData.alarmName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.alarmCode')" prop="alarmCode">
|
||||
<el-input v-model="formData.alarmCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.category')" prop="category">
|
||||
<el-input v-model="formData.category" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.baseinfoalarm.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoalarm.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editDeviceAlarmSetting, getDeviceAlarmSetting } from '@/api/equipment/param'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
alarmId: undefined,
|
||||
alarmName: undefined,
|
||||
alarmCode: undefined,
|
||||
category: undefined,
|
||||
enabled: 1,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
rules: {
|
||||
alarmId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
alarmName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
alarmCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholderalarmCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoalarm.placeholdercategory'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [],
|
||||
remark: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentId = this.targetInfo.equipmentId
|
||||
this.formData.id = this.targetInfo.id
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editDeviceAlarmSetting(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceAlarmSetting({
|
||||
id: this.formData.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,153 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-06-29 20:29:18
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\alarm\index.vue
|
||||
* @Description: 设备类型参数列表
|
||||
-->
|
||||
<template>
|
||||
<div class="param-subpage-container">
|
||||
<div class="method-btn-area">
|
||||
<el-input v-model="listQuery.keywords" :placeholder="$t('module.equipmentManager.baseinfoalarm.searchPlaceholder')" style="width: 200px;" clearable />
|
||||
<el-button @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" :is-fixed="false" :width="180" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" :target-info="{id: listQuery.equipmentId}" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, equipmentId: listQuery.equipmentId }" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'alarmId',
|
||||
label: i18n.t('module.equipmentManager.baseinfoalarm.alarmId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'alarmName',
|
||||
label: i18n.t('module.equipmentManager.baseinfoalarm.alarmName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'alarmCode',
|
||||
label: i18n.t('module.equipmentManager.baseinfoalarm.alarmCode'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'category',
|
||||
label: i18n.t('module.equipmentManager.baseinfoalarm.category'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.baseinfoalarm.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getDeviceAlarmSettingList, delDeviceAlarmSetting } from '@/api/equipment/param'
|
||||
import AddForm from './addForm'
|
||||
import EditForm from './editForm'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentId: null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.equipmentId = this.$route.query.id
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceAlarmSetting({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList(val) {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
// console.log(this.listQuery
|
||||
console.log(val)
|
||||
console.log(this.listQuery.current)
|
||||
const res = await getDeviceAlarmSettingList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.param-subpage-container {
|
||||
padding: 40px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,131 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 15:59:17
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\event\addForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoevent.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventId')" prop="eventId">
|
||||
<el-input v-model="formData.eventId" clearable :style="{width: '100%'}" type="number" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventName')" prop="eventName">
|
||||
<el-input v-model="formData.eventName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventCode')" prop="eventCode">
|
||||
<el-input v-model="formData.eventCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.baseinfoevent.category')" prop="category">
|
||||
<el-input v-model="formData.category" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { addDeviceEventSetting, getDeviceEventCode } from '@/api/equipment/param'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
eventId: undefined,
|
||||
eventName: undefined,
|
||||
eventCode: undefined,
|
||||
category: undefined,
|
||||
enabled: 1,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
rules: {
|
||||
eventId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
eventName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
eventCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdercategory'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [],
|
||||
remark: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentId = this.targetInfo.id
|
||||
this.getCode()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addDeviceEventSetting(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getCode() {
|
||||
const result = await getDeviceEventCode()
|
||||
if (result.code === 0) {
|
||||
this.formData.eventCode = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,134 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-23 15:59:53
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\event\editForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoevent.editDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="150px">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventId')" prop="eventId">
|
||||
<el-input v-model="formData.eventId" clearable :style="{width: '100%'}" type="number" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventName')" prop="eventName">
|
||||
<el-input v-model="formData.eventName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.eventCode')" prop="eventCode">
|
||||
<el-input v-model="formData.eventCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.baseinfoevent.category')" prop="category">
|
||||
<el-input v-model="formData.category" clearable :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoevent.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { editDeviceEventSetting, getDeviceEventSetting } from '@/api/equipment/param'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
eventId: undefined,
|
||||
eventName: undefined,
|
||||
eventCode: undefined,
|
||||
category: undefined,
|
||||
enabled: 1,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
rules: {
|
||||
eventId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
eventName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
eventCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdereventCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoevent.placeholdercategory'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
description: [],
|
||||
remark: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentId = this.targetInfo.equipmentId
|
||||
this.formData.id = this.targetInfo.id
|
||||
this.getInfo()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editDeviceEventSetting(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceEventSetting({
|
||||
id: this.formData.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,161 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-06-29 20:26:56
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\event\index.vue
|
||||
* @Description: 设备类型参数列表
|
||||
-->
|
||||
<template>
|
||||
<div class="param-subpage-container">
|
||||
<div class="method-btn-area">
|
||||
<el-input v-model="listQuery.keywords" :placeholder="$t('module.equipmentManager.baseinfoevent.searchPlaceholder')" style="width: 200px;" clearable />
|
||||
<el-button @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" :is-fixed="false" :width="180" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" :target-info="{id: listQuery.equipmentId}" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, equipmentId: listQuery.equipmentId }" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dataDict from '@/filters/DataDict'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
// {
|
||||
// prop: 'category',
|
||||
// label: i18n.t('module.equipmentManager.baseinfoevent.category'),
|
||||
// align: 'center'
|
||||
// },
|
||||
const tableProps = [{
|
||||
prop: 'eventId',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.eventId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'eventCode',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.eventCode'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'eventName',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.eventName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'enabled',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.enabled'),
|
||||
align: 'center',
|
||||
filter: dataDict('yesOrNo')
|
||||
}, {
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.description'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.baseinfoevent.remark'),
|
||||
align: 'center'
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getDeviceEventSettingList, delDeviceEventSetting } from '@/api/equipment/param'
|
||||
import AddForm from './addForm'
|
||||
import EditForm from './editForm'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentId: null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.equipmentId = this.$route.query.id
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceEventSetting({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
console.log(this.listQuery)
|
||||
const res = await getDeviceEventSettingList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.param-subpage-container {
|
||||
padding: 40px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,274 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-06-29 15:21:21
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\param\addForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoparam.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-row :gutter="15">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" :label-width="language === 'zh' ? '120px' : '200px'">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramName')" prop="paramName">
|
||||
<el-input v-model="formData.paramName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramId')" prop="paramId">
|
||||
<el-input v-model="formData.paramId" type="number" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramCode')" prop="paramCode">
|
||||
<el-input v-model="formData.paramCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.format')" prop="format">
|
||||
<el-input v-model="formData.format" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.valueType')" prop="valueType">
|
||||
<el-input v-model="formData.valueType" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.unit')" prop="unit">
|
||||
<el-input v-model="formData.unit" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.maxValue')" prop="maxValue">
|
||||
<el-input v-model="formData.maxValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.minValue')" prop="minValue">
|
||||
<el-input v-model="formData.minValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.defaultValue')" prop="defaultValue">
|
||||
<el-input v-model="formData.defaultValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.category')" prop="category">
|
||||
<el-select v-model="formData.category" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in categoryOptions"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.dataWithPlc')" prop="dataWithPlc">
|
||||
<el-input v-model="formData.dataWithPlc" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.type')" prop="type">
|
||||
<!-- <el-input v-model="formData.type" clearable :style="{width: '100%'}" /> -->
|
||||
<el-select v-model="formData.type" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
label="SV"
|
||||
value="SV"
|
||||
/>
|
||||
<el-option
|
||||
label="DV"
|
||||
value="DV"
|
||||
/>
|
||||
<el-option
|
||||
label="ECV"
|
||||
value="ECV"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.uploadSpc')" prop="uploadSpc">
|
||||
<el-switch v-model="formData.uploadSpc" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.note')" prop="note">
|
||||
<el-input v-model="formData.note" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.isCollected')" prop="isCollected">
|
||||
<el-switch v-model="formData.isCollected" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
const categoryOptions = [{
|
||||
id: 'M',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.M')
|
||||
}, {
|
||||
id: 'V',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.V')
|
||||
}, {
|
||||
id: 'P',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.P')
|
||||
}, {
|
||||
id: 'R',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.R')
|
||||
}, {
|
||||
id: 'C',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.C')
|
||||
}, {
|
||||
id: 'I',
|
||||
name: i18n.t('module.equipmentManager.baseinfoparam.I')
|
||||
}]
|
||||
import { addDeviceParam, getDeviceParamCode } from '@/api/equipment/param'
|
||||
import { getLanguage } from '@/lang/index'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
paramName: undefined,
|
||||
paramId: undefined,
|
||||
paramCode: undefined,
|
||||
format: undefined,
|
||||
valueType: undefined,
|
||||
unit: undefined,
|
||||
maxValue: undefined,
|
||||
minValue: undefined,
|
||||
defaultValue: undefined,
|
||||
category: undefined,
|
||||
dataWithPlc: undefined,
|
||||
enabled: true,
|
||||
type: undefined,
|
||||
uploadSpc: true,
|
||||
note: undefined,
|
||||
isCollected: true,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
categoryOptions,
|
||||
rules: {
|
||||
paramName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
paramId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
paramCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
format: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderformat'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
valueType: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderValueType'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholdertype'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
dataWithPlc: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderdataWithPlc'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
unit: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderunit'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
language: getLanguage()
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.formData.equipmentId = this.targetInfo?.id
|
||||
this.getCode()
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await addDeviceParam(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '添加成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getCode() {
|
||||
const result = await getDeviceParamCode()
|
||||
if (result.code === 0) {
|
||||
this.formData.paramCode = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,278 @@
|
||||
<!--
|
||||
* @Date: 2021-01-18 10:47:42
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-04-21 14:49:19
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\TypeParamSetting\subpage\param\editForm.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.baseinfoparam.addDialogTitle')" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-row :gutter="15">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" :label-width="language === 'zh' ? '120px' : '200px'">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramName')" prop="paramName">
|
||||
<el-input v-model="formData.paramName" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramId')" prop="paramId">
|
||||
<el-input v-model="formData.paramId" type="number" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.paramCode')" prop="paramCode">
|
||||
<el-input v-model="formData.paramCode" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.format')" prop="format">
|
||||
<el-input v-model="formData.format" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.valueType')" prop="valueType">
|
||||
<el-input v-model="formData.valueType" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.unit')" prop="unit">
|
||||
<el-input v-model="formData.unit" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.maxValue')" prop="maxValue">
|
||||
<el-input v-model="formData.maxValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.minValue')" prop="minValue">
|
||||
<el-input v-model="formData.minValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.defaultValue')" prop="defaultValue">
|
||||
<el-input v-model="formData.defaultValue" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.category')" prop="category">
|
||||
<el-select v-model="formData.category" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
v-for="(item, index) in categoryOptions"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.dataWithPlc')" prop="dataWithPlc">
|
||||
<el-input v-model="formData.dataWithPlc" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.enabled')" prop="enabled">
|
||||
<el-switch v-model="formData.enabled" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.type')" prop="type">
|
||||
<el-select v-model="formData.type" clearable :style="{width: '100%'}">
|
||||
<el-option
|
||||
label="SV"
|
||||
value="SV"
|
||||
/>
|
||||
<el-option
|
||||
label="DV"
|
||||
value="DV"
|
||||
/>
|
||||
<el-option
|
||||
label="ECV"
|
||||
value="ECV"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.uploadSpc')" prop="uploadSpc">
|
||||
<el-switch v-model="formData.uploadSpc" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.note')" prop="note">
|
||||
<el-input v-model="formData.note" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.isCollected')" prop="isCollected">
|
||||
<el-switch v-model="formData.isCollected" :active-value="1" :inactive-value="0" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-form-item :label="$t('module.equipmentManager.baseinfoparam.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
const categoryOptions = [{
|
||||
id: 'M',
|
||||
name: 'Material Related Value'
|
||||
}, {
|
||||
id: 'V',
|
||||
name: 'Process Actual Value'
|
||||
}, {
|
||||
id: 'P',
|
||||
name: 'Recipe Parameter'
|
||||
}, {
|
||||
id: 'R',
|
||||
name: 'Material Related Value'
|
||||
}, {
|
||||
id: 'C',
|
||||
name: 'Consumable Value'
|
||||
}, {
|
||||
id: 'I',
|
||||
name: 'Interface Related'
|
||||
}]
|
||||
import { getDeviceParam, editDeviceParam } from '@/api/equipment/param'
|
||||
import { getLanguage } from '@/lang/index'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
paramName: undefined,
|
||||
paramId: undefined,
|
||||
paramCode: undefined,
|
||||
format: undefined,
|
||||
field103: undefined,
|
||||
unit: undefined,
|
||||
maxValue: undefined,
|
||||
minValue: undefined,
|
||||
defaultValue: undefined,
|
||||
type: undefined,
|
||||
dataWithPlc: undefined,
|
||||
enabled: true,
|
||||
field113: undefined,
|
||||
uploadSpc: true,
|
||||
field115: undefined,
|
||||
isCollected: true,
|
||||
description: undefined,
|
||||
remark: undefined,
|
||||
equipmentId: undefined
|
||||
},
|
||||
categoryOptions,
|
||||
rules: {
|
||||
paramName: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamName'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
paramId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamId'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
paramCode: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderparamCode'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
format: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderformat'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
valueType: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderValueType'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
category: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholdertype'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
dataWithPlc: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderdataWithPlc'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
unit: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.baseinfoparam.placeholderunit'),
|
||||
trigger: 'blur'
|
||||
}]
|
||||
},
|
||||
language: getLanguage()
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
console.log(this.language)
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getInfo()
|
||||
// this.formData.id = this.targetInfo?.id
|
||||
this.formData.equipmentId = this.targetInfo?.equipmentId
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
const result = await editDeviceParam(this.formData)
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getDeviceParam({
|
||||
id: this.targetInfo?.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,224 @@
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2022-07-25 10:42:19
|
||||
* @FilePath: \mt-bus-fe\src\views\EquipmentManager\TypeParamSetting\subpage\param\index.vue
|
||||
* @Description: 设备类型参数列表
|
||||
-->
|
||||
<template>
|
||||
<div class="param-subpage-container">
|
||||
<div class="method-btn-area">
|
||||
<el-input v-model="listQuery.paramName" :placeholder="$t('module.equipmentManager.baseinfoparam.searchPlaceholder')" style="width: 200px;" clearable />
|
||||
<el-button @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="showDialog = true">{{ 'btn.add' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size">
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-form :visible.sync="showDialog" :target-info="{id: listQuery.equipmentId}" @done="getList" />
|
||||
<edit-form :visible.sync="showEditDialog" :target-info="{id: curEditId, equipmentId: listQuery.equipmentId }" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import dataDict from '@/filters/DataDict'
|
||||
// import equipmentDict from '@/filters/equipment'
|
||||
// edit here
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
// {
|
||||
// prop: 'dataWithPlc',
|
||||
// label: i18n.t('module.equipmentManager.baseinfoparam.dataWithPlc'),
|
||||
// align: 'center',
|
||||
// width: '120px'
|
||||
// }, {
|
||||
// prop: 'category',
|
||||
// label: i18n.t('module.equipmentManager.baseinfoparam.category'),
|
||||
// align: 'center',
|
||||
// width: '120px',
|
||||
// filter: equipmentDict('category')
|
||||
// },
|
||||
const tableProps = [{
|
||||
prop: 'paramId',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.paramId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'paramName',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.paramName'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'paramCode',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.paramCode'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'format',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.format'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'unit',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.unit'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'maxValue',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.maxValue'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'minValue',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.minValue'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'defaultValue',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.defaultValue'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'valueType',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.valueType'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'enabled',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.enabled'),
|
||||
align: 'center',
|
||||
width: '120px',
|
||||
filter: dataDict('yesOrNo')
|
||||
}, {
|
||||
prop: 'type',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.type'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'uploadSpc',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.uploadSpc'),
|
||||
align: 'center',
|
||||
width: '120px',
|
||||
filter: dataDict('yesOrNo')
|
||||
}, {
|
||||
prop: 'isCollected',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.isCollected'),
|
||||
align: 'center',
|
||||
width: '120px',
|
||||
filter: dataDict('yesOrNo')
|
||||
}, {
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.description'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}, {
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.baseinfoparam.remark'),
|
||||
align: 'center',
|
||||
width: '120px'
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// edit here
|
||||
import { getDeviceParamList, delDeviceParam } from '@/api/equipment/param'
|
||||
import AddForm from './addForm'
|
||||
import EditForm from './editForm'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { Pagination, BaseTable, MethodBtn, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentId: null,
|
||||
paramName: null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.listQuery.equipmentId = this.$route.query.id
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delDeviceParam({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
break
|
||||
case 'edit':
|
||||
this.showEditDialog = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
}
|
||||
},
|
||||
async getList(val) {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
if (val) {
|
||||
this.listQuery.current = val.current
|
||||
}
|
||||
const res = await getDeviceParamList(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.param-subpage-container {
|
||||
padding: 40px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
BIN
src/views/EquipmentManager/assets/bg.png
Normal file
BIN
src/views/EquipmentManager/assets/bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 MiB |
190
src/views/EquipmentManager/components/EquipmentAnalysisBox.vue
Normal file
190
src/views/EquipmentManager/components/EquipmentAnalysisBox.vue
Normal file
@@ -0,0 +1,190 @@
|
||||
<template>
|
||||
<TechyBox class="equipment-analysis-box flex gap-16">
|
||||
<div class="equipment-analysis-box__title">
|
||||
{{ name }}
|
||||
</div>
|
||||
<div class="param-list grow flex flex-col gap-8 justify-center">
|
||||
<div class="flex items-center gap-8">
|
||||
<span class="param-name">OEE</span>
|
||||
<div class="progress-bar grow">
|
||||
<ProgreeBar :process="+oee * 100" />
|
||||
</div>
|
||||
<span class="param-value">{{ oee | noDecimalFilter }}%</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-8">
|
||||
<span class="param-name">MTBR</span>
|
||||
<div class="progress-bar grow">
|
||||
<ProgreeBar :process="+mtbr * 100" :colors="['#2EC6B4', '#85F6E9']" />
|
||||
</div>
|
||||
<span class="param-value">{{ mtbr | noDecimalFilter }}%</span>
|
||||
</div>
|
||||
<div class="flex items-center gap-8">
|
||||
<span class="param-name">MTBF</span>
|
||||
<div class="progress-bar grow">
|
||||
<ProgreeBar :process="+mtbf * 100" :colors="['#EB46A1', '#FF8BC3']" />
|
||||
</div>
|
||||
<span class="param-value">{{ mtbf | noDecimalFilter }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
</TechyBox>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TechyBox from './TechyBox.vue'
|
||||
|
||||
const ProgreeBar = {
|
||||
name: 'ProgressBar',
|
||||
props: {
|
||||
process: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
colors: {
|
||||
type: Array,
|
||||
default: () => ['#1295FF', '#9DD5FF']
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
render: function(h) {
|
||||
return h(
|
||||
'div',
|
||||
{
|
||||
style: {
|
||||
height: '0.5vh',
|
||||
width: '100%',
|
||||
borderRadius: '8px',
|
||||
position: 'relative',
|
||||
background: '#1E2D4590',
|
||||
// background: 'red',
|
||||
overflow: 'hidden'
|
||||
}
|
||||
},
|
||||
[
|
||||
h(
|
||||
'div',
|
||||
{
|
||||
style: {
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: 0,
|
||||
width: this.process + '%',
|
||||
height: '100%',
|
||||
borderRadius: '8px',
|
||||
background: `linear-gradient(to right, ${this.colors[0]}, ${this.colors[1]})`
|
||||
}
|
||||
},
|
||||
''
|
||||
)
|
||||
]
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'EquipmentAnalysisBox',
|
||||
components: { TechyBox, ProgreeBar },
|
||||
filters: {
|
||||
noDecimalFilter(val) {
|
||||
// val: string or number
|
||||
if (typeof val === 'string') val = parseFloat(val)
|
||||
return (val * 100).toFixed(0)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
name: String,
|
||||
oee: [String, Number],
|
||||
mtbf: [String, Number],
|
||||
mtbr: [String, Number]
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.equipment-analysis-box {
|
||||
color: white;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.equipment-analysis-box__title {
|
||||
font-size: 1.25vh;
|
||||
line-height: 2vh;
|
||||
letter-spacing: 1px;
|
||||
width: 3vw;
|
||||
overflow-wrap: break-word;
|
||||
align-self: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.param-list {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.param-name {
|
||||
opacity: 70%;
|
||||
text-align: right;
|
||||
/* font-size: 12px;
|
||||
line-height: 14px;
|
||||
width: 36px; */
|
||||
font-size: 1vh;
|
||||
line-height: 1.2;
|
||||
width: 2vw;
|
||||
}
|
||||
.param-value {
|
||||
opacity: 70%;
|
||||
text-align: left;
|
||||
/* font-size: 12px;
|
||||
line-height: 14px;
|
||||
width: 24px; */
|
||||
font-size: 1vh;
|
||||
line-height: 1.2;
|
||||
width: 1.5vw;
|
||||
}
|
||||
|
||||
.param-list::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -11px;
|
||||
top: 10%;
|
||||
width: 1px;
|
||||
/* height: 100%; */
|
||||
height: 80%;
|
||||
background: linear-gradient(to bottom, transparent, #ffffff8c, transparent);
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.grow {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.gap-8 {
|
||||
/* gap: 8px; */
|
||||
gap: 0.8vh;
|
||||
}
|
||||
.gap-16 {
|
||||
/* gap: 16px; */
|
||||
gap: 1.6vh;
|
||||
}
|
||||
</style>
|
||||
131
src/views/EquipmentManager/components/TechyAnalysisHeader.vue
Normal file
131
src/views/EquipmentManager/components/TechyAnalysisHeader.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div class="techy-analysis-header">
|
||||
<span v-html="titleLeftSVG" />
|
||||
<span class="techy-analysis-header__title">
|
||||
<slot />
|
||||
</span>
|
||||
<span v-html="titleRightSVG" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const titleLeftSVG = `<svg
|
||||
width="56px"
|
||||
height="13px"
|
||||
viewBox="0 0 56 13"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
>
|
||||
<title>left</title>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-5质量管理" transform="translate(-419.000000, -808.000000)" fill="#31A6AE">
|
||||
<g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
|
||||
<g id="编组-20备份" transform="translate(24.000000, 277.000000)">
|
||||
<g id="编组-13备份" transform="translate(35.000000, 16.000000)">
|
||||
<g
|
||||
id="编组-2备份"
|
||||
transform="translate(28.000000, 8.500000) scale(1, -1) translate(-28.000000, -8.500000) translate(0.000000, 2.000000)"
|
||||
>
|
||||
<polygon
|
||||
id="路径-11"
|
||||
points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份"
|
||||
opacity="0.8"
|
||||
points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-3"
|
||||
opacity="0.4"
|
||||
points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-2"
|
||||
opacity="0.601434"
|
||||
points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-4"
|
||||
opacity="0.201434"
|
||||
points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
|
||||
></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
const titleRightSVG = `<svg
|
||||
width="56px"
|
||||
height="13px"
|
||||
viewBox="0 0 56 13"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
>
|
||||
<title>right</title>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-5质量管理" transform="translate(-653.000000, -808.000000)" fill="#31A6AE">
|
||||
<g id="编组-16备份-7" transform="translate(360.000000, 513.000000)">
|
||||
<g id="编组-20备份" transform="translate(24.000000, 277.000000)">
|
||||
<g id="编组-13备份" transform="translate(35.000000, 16.000000)">
|
||||
<g
|
||||
id="编组-2备份-2"
|
||||
transform="translate(262.000000, 8.500000) scale(-1, -1) translate(-262.000000, -8.500000) translate(234.000000, 2.000000)"
|
||||
>
|
||||
<polygon
|
||||
id="路径-11"
|
||||
points="47.1645736 7.79376563e-14 43 0 52.2664792 13 56 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份"
|
||||
opacity="0.8"
|
||||
points="36.1645736 7.79376563e-14 32 0 41.2664792 13 45 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-3"
|
||||
opacity="0.4"
|
||||
points="14.1645736 7.79376563e-14 10 0 19.2664792 13 23 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-2"
|
||||
opacity="0.601434"
|
||||
points="25.1645736 7.79376563e-14 21 0 30.2664792 13 34 13"
|
||||
></polygon>
|
||||
<polygon
|
||||
id="路径-11备份-4"
|
||||
opacity="0.201434"
|
||||
points="4.16457365 7.79376563e-14 5.06480115e-16 0 9.26647921 13 13 13"
|
||||
></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g></svg>`
|
||||
|
||||
export default {
|
||||
name: 'TechyAnalysisHeader',
|
||||
data() {
|
||||
return { titleLeftSVG, titleRightSVG }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.techy-analysis-header {
|
||||
text-align: center;
|
||||
/* margin-bottom: 16px; */
|
||||
/* margin-top: 1.125vh; */
|
||||
margin-bottom: 0.5vh;
|
||||
}
|
||||
|
||||
.techy-analysis-header__title {
|
||||
color: #01cfcc;
|
||||
font-size: 1.25vh;
|
||||
line-height: 18px;
|
||||
}
|
||||
</style>
|
||||
20
src/views/EquipmentManager/components/TechyBox.vue
Normal file
20
src/views/EquipmentManager/components/TechyBox.vue
Normal file
@@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<div class="techy-box">
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.techy-box {
|
||||
background: transparent;
|
||||
box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.2);
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
</style>
|
||||
114
src/views/EquipmentManager/components/TechyContainer.vue
Normal file
114
src/views/EquipmentManager/components/TechyContainer.vue
Normal file
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<div class="techy-container">
|
||||
<template v-if="showCorner">
|
||||
<div class="line top left vertical" />
|
||||
<div class="line top left horizontal" />
|
||||
<div class="line top right vertical" />
|
||||
<div class="line top right horizontal " />
|
||||
<div class="line bottom right horizontal" />
|
||||
<div class="line bottom right vertical" />
|
||||
<div class="line bottom left vertical" />
|
||||
<div class="line bottom left horizontal" />
|
||||
</template>
|
||||
|
||||
<div class="container-title-wrapper">
|
||||
<span class="container-icon" v-html="icon" />
|
||||
<span class="container-title">{{ title }}</span>
|
||||
</div>
|
||||
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TechyContainer',
|
||||
props: {
|
||||
title: String,
|
||||
icon: String,
|
||||
showCorner: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
mounted() {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.techy-container {
|
||||
border: 2px solid #52fff1;
|
||||
border-image: linear-gradient(90deg, rgba(82, 255, 241, 0.6), rgba(95, 190, 249, 0), rgba(82, 255, 241, 0.6)) 2 2;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
/* padding: 24px; */
|
||||
padding: calc(100vw / 1920 * 22);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-shadow: inset 0px 0px 20px 0px rgba(255,255,255,0.15);
|
||||
}
|
||||
|
||||
.line {
|
||||
position: absolute;
|
||||
background-color: #52fff1;
|
||||
}
|
||||
|
||||
.horizontal {
|
||||
/* height: 4px;
|
||||
width: 24px; */
|
||||
/* height: 0.325vh;
|
||||
width: 3vh; */
|
||||
height: calc(100vw / 1920 * 4);
|
||||
width: calc(100vw / 1920 * 30);
|
||||
}
|
||||
|
||||
.vertical {
|
||||
/* height: 24px;
|
||||
width: 4px; */
|
||||
/* height: 3vh;
|
||||
width: 0.325vh; */
|
||||
height: calc(100vw / 1920 * 30);
|
||||
width: calc(100vw / 1920 * 4);
|
||||
}
|
||||
|
||||
.top {
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.left {
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.right {
|
||||
right: -3px;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
bottom: -3px;
|
||||
}
|
||||
|
||||
.container-title-wrapper {
|
||||
color: #52fff1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
/* font-size: 18px;
|
||||
line-height: 1;
|
||||
height: 24px;
|
||||
margin-bottom: 8px; */
|
||||
/* font-size: 1.25vh;
|
||||
line-height: 1;
|
||||
height: 1.5vh;
|
||||
margin-bottom: 1.25vh; */
|
||||
font-size: calc((100vw / 1920) * 16);
|
||||
line-height: 1;
|
||||
height: calc((100vw / 1920) * 20);
|
||||
margin-bottom: 1.25vh;
|
||||
}
|
||||
|
||||
.container-title {
|
||||
margin-left: 4px;
|
||||
}
|
||||
</style>
|
||||
92
src/views/EquipmentManager/components/TechyHeader.vue
Normal file
92
src/views/EquipmentManager/components/TechyHeader.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<header class="techy-header">
|
||||
<img class="logo-img" src="./logo.png" alt="cnbm">
|
||||
<span style="display: line-block; margin-left: calc(100vw / 1920 * 8); letter-spacing: 3px;">{{ headTitle }}</span>
|
||||
|
||||
<span class="fullscreen-btn" @click="handleClick('fullscreen')">
|
||||
<span v-if="isFullScreen" v-html="unfullScreenSvg" />
|
||||
<span v-else v-html="fullScreenSvg" />
|
||||
</span>
|
||||
</header>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const fullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组 54备份</title>
|
||||
<g id="2MES。2-6蓝底-7、8白底" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="2-4设备管理" transform="translate(-1864.000000, -162.000000)">
|
||||
<g id="编组-54备份" transform="translate(1864.000000, 162.000000)">
|
||||
<rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="31" height="31"></rect>
|
||||
<path d="M26.7638125,1.45454545 L27.0177905,1.4628567 C27.4387521,1.49054436 27.8474996,1.58732758 28.2359531,1.75197014 C28.6866948,1.94029725 29.0896137,2.2117619 29.4389259,2.56107409 C29.7857111,2.90785927 30.0584977,3.31352185 30.2477734,3.76343947 C30.4456009,4.23019115 30.5454545,4.72555866 30.5454545,5.23618754 L30.5454545,5.23618754 L30.5454545,26.7638125 L30.5371433,27.0177905 C30.5094556,27.4387521 30.4126724,27.8474996 30.2480299,28.2359531 C30.0597028,28.6866948 29.7882381,29.0896137 29.4389259,29.4389259 C29.0921407,29.7857111 28.6864782,30.0584977 28.2365605,30.2477734 C27.7698088,30.4456009 27.2744413,30.5454545 26.7638125,30.5454545 L26.7638125,30.5454545 L5.23618754,30.5454545 L4.98220952,30.5371433 C4.56124792,30.5094556 4.15250044,30.4126724 3.7640469,30.2480299 C3.31330516,30.0597028 2.91038628,29.7882381 2.56107409,29.4389259 C2.21428891,29.0921407 1.94150232,28.6864782 1.75222663,28.2365605 C1.55439906,27.7698088 1.45454545,27.2744413 1.45454545,26.7638125 L1.45454545,26.7638125 L1.45454545,5.23618754 L1.4628567,4.98220952 C1.49054436,4.56124792 1.58732758,4.15250044 1.75197014,3.7640469 C1.94029725,3.31330516 2.2117619,2.91038628 2.56107409,2.56107409 C2.90785927,2.21428891 3.31352185,1.94150232 3.76343947,1.75222663 C4.23019115,1.55439906 4.72555866,1.45454545 5.23618754,1.45454545 L5.23618754,1.45454545 L26.7638125,1.45454545 Z M26.7638125,3.33876293 L5.23618754,3.33876293 L5.08796584,3.34447462 C4.10971624,3.42016081 3.33876293,4.23861746 3.33876293,5.23618754 L3.33876293,5.23618754 L3.33876293,26.7638125 L3.34447462,26.9120342 C3.42016081,27.8902838 4.23861746,28.6612371 5.23618754,28.6612371 L5.23618754,28.6612371 L26.7638125,28.6612371 L26.9120342,28.6555254 C27.8902838,28.5798392 28.6612371,27.7613825 28.6612371,26.7638125 L28.6612371,26.7638125 L28.6612371,5.23618754 L28.6555254,5.08796584 C28.5798392,4.10971624 27.7613825,3.33876293 26.7638125,3.33876293 L26.7638125,3.33876293 Z M6.64116798,17.2700375 L6.74890704,17.2784355 C7.20902464,17.3410097 7.56504512,17.7372269 7.56504512,18.2121946 L7.56504512,18.2121946 L7.56504512,23.06998 L12.2154875,18.4195377 L12.3038841,18.341579 C12.6723846,18.0557307 13.2096238,18.0817169 13.5474445,18.4195377 C13.9134169,18.7855101 13.9134169,19.3855223 13.5474445,19.7514947 L13.5474445,19.7514947 L8.86035653,24.4349549 L13.6953555,24.4349549 L13.8090001,24.4414765 C14.2937488,24.4974586 14.6711425,24.9068233 14.6639054,25.3965331 C14.6534571,25.9083109 14.2345395,26.3191724 13.7217698,26.3191724 L13.7217698,26.3191724 L6.64604887,26.3191724 L6.53329365,26.3126932 C6.05255502,26.2570589 5.68082765,25.8499062 5.68082765,25.3539511 L5.68082765,25.3539511 L5.68082765,18.2353071 L5.68737703,18.1218678 C5.74358847,17.6379293 6.15445128,17.2603996 6.64116798,17.2700375 L6.64116798,17.2700375 Z M25.3605547,5.68082765 L25.4723738,5.68728667 C25.9492196,5.74274215 26.3191724,6.14846553 26.3191724,6.6394453 L26.3191724,6.6394453 L26.3191724,13.7613912 L26.312623,13.8748304 C26.2564115,14.3587689 25.8455487,14.7362986 25.358832,14.7266607 C24.8478544,14.716179 24.4349549,14.2960073 24.4349549,13.7845036 L24.4349549,13.7845036 L24.4349549,8.93001999 L19.7845125,13.5804623 L19.6961159,13.658421 C19.3276154,13.9442693 18.7903762,13.9182831 18.4525555,13.5804623 C18.0865831,13.2144899 18.0865831,12.6144777 18.4525555,12.2485053 L18.4525555,12.2485053 L23.1360157,7.56504512 L18.3013427,7.56504512 L18.1876721,7.55852521 C17.7028859,7.50255928 17.3264448,7.09334546 17.3360737,6.60468076 C17.3465429,6.0916891 17.7654605,5.68082765 18.2782302,5.68082765 L18.2782302,5.68082765 L25.3605547,5.68082765 Z" id="形状结合" fill="#52FFF1" fill-rule="nonzero" opacity="0.79078311"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
|
||||
const unfullScreenSvg = `<svg width="32px" height="32px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组 54备份 2</title>
|
||||
<g id="3WMS。1、2、3、4、5、6" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<g id="编组-54备份-2">
|
||||
<rect id="矩形" stroke="#979797" fill="#D8D8D8" opacity="0" x="0.5" y="0.5" width="31" height="31"></rect>
|
||||
<path d="M26.7638125,1.45454545 L27.0177905,1.4628567 C27.4387521,1.49054436 27.8474996,1.58732758 28.2359531,1.75197014 C28.6866948,1.94029725 29.0896137,2.2117619 29.4389259,2.56107409 C29.7857111,2.90785927 30.0584977,3.31352185 30.2477734,3.76343947 C30.4456009,4.23019115 30.5454545,4.72555866 30.5454545,5.23618754 L30.5454545,5.23618754 L30.5454545,26.7638125 L30.5371433,27.0177905 C30.5094556,27.4387521 30.4126724,27.8474996 30.2480299,28.2359531 C30.0597028,28.6866948 29.7882381,29.0896137 29.4389259,29.4389259 C29.0921407,29.7857111 28.6864782,30.0584977 28.2365605,30.2477734 C27.7698088,30.4456009 27.2744413,30.5454545 26.7638125,30.5454545 L26.7638125,30.5454545 L5.23618754,30.5454545 L4.98220952,30.5371433 C4.56124792,30.5094556 4.15250044,30.4126724 3.7640469,30.2480299 C3.31330516,30.0597028 2.91038628,29.7882381 2.56107409,29.4389259 C2.21428891,29.0921407 1.94150232,28.6864782 1.75222663,28.2365605 C1.55439906,27.7698088 1.45454545,27.2744413 1.45454545,26.7638125 L1.45454545,26.7638125 L1.45454545,5.23618754 L1.4628567,4.98220952 C1.49054436,4.56124792 1.58732758,4.15250044 1.75197014,3.7640469 C1.94029725,3.31330516 2.2117619,2.91038628 2.56107409,2.56107409 C2.90785927,2.21428891 3.31352185,1.94150232 3.76343947,1.75222663 C4.23019115,1.55439906 4.72555866,1.45454545 5.23618754,1.45454545 L5.23618754,1.45454545 L26.7638125,1.45454545 Z M26.7638125,3.33876293 L5.23618754,3.33876293 L5.08796584,3.34447462 C4.10971624,3.42016081 3.33876293,4.23861746 3.33876293,5.23618754 L3.33876293,5.23618754 L3.33876293,26.7638125 L3.34447462,26.9120342 C3.42016081,27.8902838 4.23861746,28.6612371 5.23618754,28.6612371 L5.23618754,28.6612371 L26.7638125,28.6612371 L26.9120342,28.6555254 C27.8902838,28.5798392 28.6612371,27.7613825 28.6612371,26.7638125 L28.6612371,26.7638125 L28.6612371,5.23618754 L28.6555254,5.08796584 C28.5798392,4.10971624 27.7613825,3.33876293 26.7638125,3.33876293 L26.7638125,3.33876293 Z M13.6987866,17.269857 L13.8115418,17.2763362 C14.2922804,17.3319705 14.6640078,17.7391232 14.6640078,18.2350783 L14.6640078,18.2350783 L14.6640078,25.3537223 L14.6574584,25.4671616 C14.6012469,25.9511001 14.1903841,26.3286298 13.7036674,26.3189919 L13.7036674,26.3189919 L13.5959284,26.3105939 C13.1358108,26.2480197 12.7797903,25.8518025 12.7797903,25.3768348 L12.7797903,25.3768348 L12.7797903,20.5190494 L8.12934794,25.1694917 L8.04095127,25.2474504 C7.67245079,25.5332987 7.13521162,25.5073124 6.79739091,25.1694917 C6.43141847,24.8035193 6.43141847,24.2035071 6.79739091,23.8375347 L6.79739091,23.8375347 L11.4844789,19.1540745 L6.64947993,19.1540745 L6.53583534,19.1475529 C6.05108664,19.0915708 5.67369292,18.6822061 5.68093001,18.1924962 C5.69137836,17.6807185 6.11029591,17.269857 6.62306566,17.269857 L6.62306566,17.269857 L13.6987866,17.269857 Z M18.2962333,5.68100813 C18.807211,5.69148979 19.2201105,6.11166149 19.2201105,6.62316519 L19.2201105,6.62316519 L19.2201105,11.4776488 L23.8705528,6.82720649 L23.9589495,6.74924786 C24.32745,6.46339956 24.8646892,6.48938577 25.2025099,6.82720649 C25.5684823,7.19317893 25.5684823,7.79319108 25.2025099,8.15916352 L25.2025099,8.15916352 L20.5190497,12.8426237 L25.3537226,12.8426237 L25.4673933,12.8491436 C25.9521795,12.9051095 26.3286206,13.3143234 26.3189917,13.8029881 C26.3085224,14.3159797 25.8896049,14.7268412 25.3768351,14.7268412 L25.3768351,14.7268412 L18.2945107,14.7268412 L18.1826915,14.7203822 C17.7058457,14.6649267 17.335893,14.2592033 17.335893,13.7682235 L17.335893,13.7682235 L17.335893,6.64627767 L17.3424424,6.53283844 C17.3986538,6.04889994 17.8095166,5.67137018 18.2962333,5.68100813 Z" id="形状结合" fill="#52FFF1" fill-rule="nonzero" opacity="0.79078311"></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>`
|
||||
|
||||
export default {
|
||||
name: 'TechyHeader',
|
||||
props: ['headTitle'],
|
||||
data() {
|
||||
return {
|
||||
fullScreenSvg,
|
||||
unfullScreenSvg,
|
||||
isFullScreen: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleClick(source) {
|
||||
if (source === 'fullscreen') {
|
||||
this.isFullScreen = !this.isFullScreen
|
||||
this.$emit('toggle-full-screen', { full: this.isFullScreen })
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.techy-header {
|
||||
background: transparent;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
color: white;
|
||||
/* font-size: 24px; */
|
||||
font-size: 2vh;
|
||||
padding: calc(100vw / 1920 * 16) 0;
|
||||
line-height: 1;
|
||||
background: url(./header-new.png) no-repeat;
|
||||
/** 背景图片好像左右不对称 : */
|
||||
/* background-position: bottom left 40px; */
|
||||
/* background-size: cover; */
|
||||
background-size: 100% 100%;
|
||||
background-position: bottom left calc(100vw / 1920 * 40);
|
||||
height: calc(100vw / 1920 * 80);
|
||||
}
|
||||
|
||||
.logo-img {
|
||||
width: calc(100vw / 1920 * 24);
|
||||
}
|
||||
|
||||
.fullscreen-btn {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
/* right: 24px; */
|
||||
/** techy-body 的内部 padding 值 */
|
||||
right: calc(100vw / 1920 * 24);
|
||||
bottom: 0;
|
||||
}
|
||||
</style>
|
||||
213
src/views/EquipmentManager/components/TechyTable.vue
Normal file
213
src/views/EquipmentManager/components/TechyTable.vue
Normal file
@@ -0,0 +1,213 @@
|
||||
<!--
|
||||
* @Date: 2020-12-14 09:07:03
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2022-06-14 11:12:39
|
||||
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="visual-base-table-container">
|
||||
<el-table
|
||||
v-loading="isLoading"
|
||||
:header-cell-style="{
|
||||
background: 'rgba(79,114,136,0.29)',
|
||||
color: '#fff',
|
||||
height: 'calc(100vh / 1920 * 48)',
|
||||
lineHeight: 'calc(100vh / 1920 * 48)',
|
||||
padding: 0,
|
||||
fontSize: 'calc(100vh / 1920 * 20)'
|
||||
}"
|
||||
:row-style="setRowStyle"
|
||||
:data="renderData"
|
||||
border
|
||||
style="width: 100%; background: transparent"
|
||||
:cell-style="{
|
||||
height: 'calc(100vh / 1920 * 48)',
|
||||
lineHeight: 'calc(100vh / 1920 * 48)',
|
||||
padding: 0,
|
||||
fontSize: 'calc(100vh / 1920 * 20)'
|
||||
}"
|
||||
>
|
||||
<el-table-column
|
||||
v-if="page && limit && showIndex"
|
||||
prop="_pageIndex"
|
||||
:label="'tableHeader.index' | i18nFilter"
|
||||
:width="70 * beilv"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
v-for="(item, index) in renderTableHeadList"
|
||||
:key="item.prop"
|
||||
:show-overflow-tooltip="showOverflow"
|
||||
v-bind="item"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<component
|
||||
:is="item.subcomponent"
|
||||
v-if="item.subcomponent"
|
||||
:key="index"
|
||||
:inject-data="{ ...scope.row, ...item }"
|
||||
@emitData="emitData"
|
||||
/>
|
||||
<span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<slot name="content" />
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { isObject, isString } from 'lodash'
|
||||
export default {
|
||||
name: 'TechyTable',
|
||||
filters: {
|
||||
commonFilter: (source, filterType = a => a) => {
|
||||
return filterType(source)
|
||||
}
|
||||
},
|
||||
props: {
|
||||
tableData: {
|
||||
type: Array,
|
||||
required: true,
|
||||
validator: val => val.filter(item => !isObject(item)).length === 0
|
||||
},
|
||||
tableConfig: {
|
||||
type: Array,
|
||||
required: true,
|
||||
validator: val => val.filter(item => !isString(item.prop) || !isString(item.label)).length === 0
|
||||
},
|
||||
isLoading: {
|
||||
type: Boolean,
|
||||
required: false
|
||||
},
|
||||
page: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 1
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 5
|
||||
},
|
||||
beilv: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
showOverflow: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
showIndex: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableConfigBak: [],
|
||||
selectedBox: new Array(100).fill(true)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
renderData() {
|
||||
if (this.tableData.length && !this.tableData[0]._pageIndex) {
|
||||
this.tableData.forEach((item, index) => {
|
||||
item._pageIndex = (this.page - 1) * this.limit + index + 1
|
||||
})
|
||||
}
|
||||
return this.tableData.slice((this.page - 1) * this.limit, this.page * this.limit)
|
||||
},
|
||||
renderTableHeadList() {
|
||||
return this.tableConfig.filter((item, index) => {
|
||||
return this.selectedBox[index]
|
||||
})
|
||||
}
|
||||
},
|
||||
beforeMount() {
|
||||
this.selectedBox = new Array(100).fill(true)
|
||||
},
|
||||
methods: {
|
||||
emitData(val) {
|
||||
this.$emit('emitFun', val)
|
||||
},
|
||||
setRowStyle(v) {
|
||||
if (v.rowIndex % 2 === 0) {
|
||||
return {
|
||||
background: 'rgba(76,97,123,0.2)',
|
||||
color: 'rgba(255,255,255,0.5)',
|
||||
height: 26 * this.beilv + 'px',
|
||||
lineHeight: 26 * this.beilv + 'px',
|
||||
padding: 0,
|
||||
fontSize: 12 * this.beilv + 'px'
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
background: 'rgba(79,114,136,0.29)',
|
||||
color: 'rgba(255,255,255,0.5)',
|
||||
height: 26 * this.beilv + 'px',
|
||||
lineHeight: 26 * this.beilv + 'px',
|
||||
padding: 0,
|
||||
fontSize: 12 * this.beilv + 'px'
|
||||
}
|
||||
}
|
||||
},
|
||||
setCellStyle(v) {
|
||||
return {
|
||||
lineHeight: 23 * this.beilv + 'px'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
@import '~@/styles/index.scss';
|
||||
.visual-base-table-container {
|
||||
.el-table {
|
||||
border: 0;
|
||||
}
|
||||
.el-table::before,
|
||||
.el-table--border::after {
|
||||
background-color: transparent;
|
||||
}
|
||||
.el-table th,
|
||||
td {
|
||||
border-color: #0d1728 !important;
|
||||
padding: 0;
|
||||
}
|
||||
.el-table tr {
|
||||
background: transparent;
|
||||
}
|
||||
.el-table__row:hover > td {
|
||||
background-color: rgba(79, 114, 136, 0.29) !important;
|
||||
}
|
||||
|
||||
.el-table__row--striped:hover > td {
|
||||
background-color: rgba(79, 114, 136, 0.29) !important;
|
||||
}
|
||||
}
|
||||
.setting {
|
||||
text-align: right;
|
||||
padding: 15px;
|
||||
.setting-box {
|
||||
width: 100px;
|
||||
}
|
||||
i {
|
||||
color: #aaa;
|
||||
@extend .pointer;
|
||||
}
|
||||
}
|
||||
.p-0 {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.p-0 >>> .cell {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.font-and-height {
|
||||
font-size: calc(100vh / 1920 * 32);
|
||||
}
|
||||
</style>
|
||||
100
src/views/EquipmentManager/components/TechyVerticalTable.vue
Normal file
100
src/views/EquipmentManager/components/TechyVerticalTable.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div class="techy-vertical-table">
|
||||
<div v-for="(row, index) in tableProps" :key="'row' + index" class="trow">
|
||||
<span class="thead">{{ row.label }}</span>
|
||||
<span v-for="(item, idx) in dataList" :key="'item_' + index + idx" class="tbody">
|
||||
<template v-if="!row.subcomponent">
|
||||
{{ item[row.prop] }}
|
||||
</template>
|
||||
<template v-else>
|
||||
<component :is="row.subcomponent" :inject-data="item" />
|
||||
</template>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TechyVerticalTable',
|
||||
props: {
|
||||
tableProps: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
dataList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dataListT: []
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.techy-vertical-table {
|
||||
height: calc(100% - 2.5vh);
|
||||
overflow: hidden;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.trow {
|
||||
/* height: calc(100% / 6); */
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: stretch;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.thead,
|
||||
.tbody {
|
||||
min-width: calc(100vw / 1920 * 96);
|
||||
background-color: #20376080;
|
||||
/* background-color: red; */
|
||||
/* height: 100%; */
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
margin-right: 1px;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.thead {
|
||||
width: 25%;
|
||||
font-size: 14px;
|
||||
line-height: 1.81;
|
||||
/* padding: 8px 16px; */
|
||||
/* font-size: 1vh; */
|
||||
/* line-height: 2; */
|
||||
/* font-weight: 400; */
|
||||
}
|
||||
|
||||
.tbody {
|
||||
width: 24%;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 12px;
|
||||
line-height: 2;
|
||||
/* padding: 8px 12px; */
|
||||
/* padding-left: 8px; */
|
||||
/* font-size: 1vh; */
|
||||
/* line-height: 2; */
|
||||
/* font-weight: 400; */
|
||||
}
|
||||
|
||||
.tbody:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.techy-vertical-table .tbody:nth-of-type(even) {
|
||||
background-color: #0e203e80 !important;
|
||||
}
|
||||
</style>
|
||||
205
src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue
Normal file
205
src/views/EquipmentManager/components/charts/pl-JDL-Chart.vue
Normal file
@@ -0,0 +1,205 @@
|
||||
<template>
|
||||
<div ref="pl-jdl-chart" class="pl-jdl-chart" style="width: 100%; height: 100%;" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
|
||||
export default {
|
||||
name: 'ProductionLineJDLChart',
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
chart: null,
|
||||
options: {
|
||||
// tooltip: {
|
||||
// trigger: 'axis',
|
||||
// axisPointer: {
|
||||
// type: 'shadow'
|
||||
// }
|
||||
// },
|
||||
grid: {
|
||||
top: '10%',
|
||||
left: '2%',
|
||||
right: '5%',
|
||||
bottom: 0,
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: ['A', 'B', 'C', 'D', 'E'],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#ffffff3d'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff'
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: '#ffffff3d'
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#ffffff3d'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#ffffff9d'
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 10,
|
||||
itemStyle: { barBorderRadius: [4, 4, 0, 0] },
|
||||
data: [
|
||||
{
|
||||
value: 110,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#9DD5FF'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#1295FF'
|
||||
}
|
||||
],
|
||||
global: false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 52,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#FF8BC3'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#EB46A1'
|
||||
}
|
||||
],
|
||||
global: false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 200,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#85F6E9'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#2EC6B4'
|
||||
}
|
||||
],
|
||||
global: false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 320,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#C79DFF'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#A490FF'
|
||||
}
|
||||
],
|
||||
global: false
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 95,
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear',
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: '#FFE873'
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: '#E7AE2A'
|
||||
}
|
||||
],
|
||||
global: false
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
if (this.chart) this.chart.resize()
|
||||
})
|
||||
|
||||
this.$nextTick(() => {
|
||||
if (!this.chart) this.chart = echarts.init(this.$refs['pl-jdl-chart'])
|
||||
this.chart.setOption(this.options)
|
||||
})
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
BIN
src/views/EquipmentManager/components/header-new.png
Normal file
BIN
src/views/EquipmentManager/components/header-new.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
BIN
src/views/EquipmentManager/components/logo.png
Normal file
BIN
src/views/EquipmentManager/components/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
BIN
src/views/EquipmentManager/components/logo2x.png
Normal file
BIN
src/views/EquipmentManager/components/logo2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
@@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<el-drawer
|
||||
:append-to-body="true"
|
||||
:show-close="false"
|
||||
:visible.sync="visible"
|
||||
size="40%"
|
||||
>
|
||||
<div slot="title" style=" background-color:#02BCFF;font-size:1.5em;color:white;padding:5px 20px">
|
||||
{{ !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }}
|
||||
</div>
|
||||
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
|
||||
<el-form-item :label="$t('module.equipmentManager.eqManagerManage.equipmentName')" prop="equipmentId">
|
||||
<el-select v-model="dataForm.equipmentId" :placeholder="$i18nForm(['placeholder.select', $t('module.equipmentManager.eqManagerManage.equipmentName')])" clearable>
|
||||
<el-option v-for="item in eqList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.eqManagerManage.equipmentCode')" prop="equipmentId">
|
||||
<el-select v-model="dataForm.equipmentId" :placeholder="$i18nForm(['placeholder.select', $t('module.equipmentManager.eqManagerManage.equipmentCode')])" clearable disabled>
|
||||
<el-option v-for="item in eqList" :key="item.id" :value="item.id" :label="item.code" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.eqManagerManage.worker')" prop="workerId">
|
||||
<el-select v-model="dataForm.workerId" :placeholder="$i18nForm(['placeholder.select', $t('module.equipmentManager.eqManagerManage.worker')])" clearable @change="changeWorker">
|
||||
<el-option v-for="item in roleList" :key="item.id" :value="item.userId" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="drawer-footer">
|
||||
<el-button @click="visible = false">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" :loading="btnLoading" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getInfo, add, edit } from '@/api/equipment/eqManager'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
workerList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
eqList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
roleList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
btnLoading: false,
|
||||
dataForm: {
|
||||
id: 0,
|
||||
equipmentId: '',
|
||||
workerId: ''
|
||||
},
|
||||
roleId: '',
|
||||
dataRule: {
|
||||
equipmentId: [
|
||||
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.eqManagerManage.equipmentName')]), trigger: 'blur' }
|
||||
],
|
||||
workerId: [
|
||||
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.eqManagerManage.worker')]), trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
roleObj: {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
roleList: function(val) {
|
||||
this.roleObj = {}
|
||||
val.map(item => {
|
||||
this.roleObj[item.id] = item.dataName
|
||||
})
|
||||
}
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
init(id) {
|
||||
this.dataForm.id = id || ''
|
||||
this.btnLoading = false
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].resetFields()
|
||||
if (this.dataForm.id) {
|
||||
getInfo({ id: this.dataForm.id }).then(res => {
|
||||
this.dataForm.equipmentId = res.data.equipmentId
|
||||
this.dataForm.workerId = res.data.workerId
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.btnLoading = true
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
const data = {
|
||||
'equipmentId': this.dataForm.equipmentId,
|
||||
'workerId': this.dataForm.workerId,
|
||||
'id': this.dataForm.id
|
||||
}
|
||||
if (this.dataForm.id) {
|
||||
edit(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.btnLoading = false
|
||||
this.visible = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
add(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.$refs['dataForm'].resetFields()
|
||||
this.btnLoading = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
changeWorker(v) {
|
||||
for (let i = 0; i < this.workerList.length; i++) {
|
||||
if (v === this.workerList[i].id) {
|
||||
this.roleId = this.workerList[i].roleId
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.drawer-footer {
|
||||
width: 100%;
|
||||
margin-top: 50px;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
padding: 10px 50px;
|
||||
text-align: left;
|
||||
background: #fff;
|
||||
}
|
||||
</style>
|
||||
218
src/views/EquipmentManager/equipmentManagerManage/index.vue
Normal file
218
src/views/EquipmentManager/equipmentManagerManage/index.vue
Normal file
@@ -0,0 +1,218 @@
|
||||
<!--
|
||||
/*
|
||||
* @Author: gtz
|
||||
* @Date: 2021-04-16 16:05:31
|
||||
* @LastEditTime: 2022-04-19
|
||||
* @LastEditors: juzi
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :method-list="tableBtn" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<add-or-edit-form ref="addorEditDrawer" :role-list="roleList" :worker-list="workerList" :eq-list="eqList" :visible.sync="showAddorEditDialog" @done="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}, {
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}]
|
||||
const tableProps = [{
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.eqManagerManage.equipmentName'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'equipmentCode',
|
||||
label: i18n.t('module.equipmentManager.eqManagerManage.equipmentCode'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'equipmentDesc',
|
||||
label: i18n.t('module.equipmentManager.eqManagerManage.description'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'workerName',
|
||||
label: i18n.t('module.equipmentManager.eqManagerManage.worker'),
|
||||
align: 'center'
|
||||
}]
|
||||
// , {
|
||||
// prop: 'remark',
|
||||
// label: i18n.t('module.equipmentManager.eqManagerManage.remark'),
|
||||
// align: 'center'
|
||||
// }
|
||||
import AddOrEditForm from './AddorEditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// edit here
|
||||
import { page, del, getEqList, getWorkerList, getRoleList } from '@/api/equipment/eqManager'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: {
|
||||
TopTitle,
|
||||
HeadForm,
|
||||
Pagination,
|
||||
BaseTable,
|
||||
MethodBtn,
|
||||
AddOrEditForm
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
curStatus: null,
|
||||
showAddorEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
equipmentId: null,
|
||||
workerId: null
|
||||
},
|
||||
eqList: [],
|
||||
workerList: [],
|
||||
roleList: [],
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.eqManagerManage.worker'),
|
||||
selectOptions: [],
|
||||
param: 'workerId'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.eqManagerManage.equipmentName'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentId'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.getListQuery()
|
||||
},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
switch (raw.type) {
|
||||
case 'edit':
|
||||
this.showAddorEditDialog = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addorEditDrawer.init(raw.data.id)
|
||||
})
|
||||
break
|
||||
case 'delete':
|
||||
this.$confirm(`${this.$t('module.basicData.visual.TipsBefore')}?`, this.$t('module.basicData.visual.Tips'), {
|
||||
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
del({ id: raw.data.id }).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
}).catch(() => {})
|
||||
}
|
||||
},
|
||||
handleAdd() {
|
||||
this.showAddorEditDialog = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addorEditDrawer.init()
|
||||
})
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.workerId = this.headFormValue.workerId
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
const res = await page(this.listQuery)
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async getListQuery() {
|
||||
const resEq = await getEqList({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.eqList = resEq.data.records
|
||||
this.headFormConfig[1].selectOptions = this.eqList
|
||||
const resWorker = await getWorkerList({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.workerList = resWorker.data.records
|
||||
const resRole = await getRoleList()
|
||||
this.roleList = resRole.data
|
||||
this.headFormConfig[0].selectOptions = this.roleList
|
||||
this.getList()
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.handleAdd()// 新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
240
src/views/EquipmentManager/equipmentMonitoring/currentState.vue
Normal file
240
src/views/EquipmentManager/equipmentMonitoring/currentState.vue
Normal file
@@ -0,0 +1,240 @@
|
||||
<!--
|
||||
* @Author: lb
|
||||
* @Date: 2022-07-11 15:36:52
|
||||
* @LastEditors: lb
|
||||
* @LastEditTime: 2022-07-11 15:36:52
|
||||
* @FilePath:
|
||||
* @Description: 设备管理-设备当前状态页面
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-config="tableProps"
|
||||
:table-data="dataList"
|
||||
@emitFun="handleTableEvents"
|
||||
>
|
||||
<!-- @clickTopBtn="clickTopBtn" -->
|
||||
<!-- :is-loading="listLoading" -->
|
||||
<!-- <method-btn slot="handleBtn" :width="trueWidth" :method-list="tableBtn" @clickBtn="handleClick" /> -->
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, getProductLineList, getEquipmentList } from '@/api/factory-manage/equipmentMonitoring'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination'
|
||||
// import { timeFormatter } from '@/filters'
|
||||
// import i18n from '@/lang'
|
||||
import commonBtn from '@/components/BaseTable/subcomponents/CommonBtn.vue'
|
||||
/**
|
||||
* 表格表头配置项 TypeScript接口注释
|
||||
* tableConfig<ConfigItem> = []
|
||||
*
|
||||
* Interface ConfigItem = {
|
||||
* prop: string,
|
||||
* label: string,
|
||||
* width: string,
|
||||
* align: string,
|
||||
* subcomponent: function,
|
||||
* filter: function
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
// const tableBtn = [
|
||||
// {
|
||||
// type: 'detail',
|
||||
// btnName: 'btn.detail'
|
||||
// },
|
||||
// {
|
||||
// type: 'edit',
|
||||
// btnName: 'btn.alarmHandle',
|
||||
// showParam: {
|
||||
// type: '&',
|
||||
// data: [
|
||||
// {
|
||||
// name: 'status',
|
||||
// type: 'unequal',
|
||||
// value: 3
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'eqName',
|
||||
label: '设备名称'
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: '运行状态'
|
||||
},
|
||||
{
|
||||
prop: 'error',
|
||||
label: '是否故障'
|
||||
},
|
||||
{
|
||||
prop: '报警记录',
|
||||
label: '报警记录',
|
||||
subcomponent: commonBtn,
|
||||
buttonContent: '查看报警记录',
|
||||
actionName: 'view-alarm-record',
|
||||
emitFullData: true
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'EquipmentCurrentStateMonitoring',
|
||||
components: { Pagination, BaseTable, HeadForm },
|
||||
data() {
|
||||
return {
|
||||
// addOrUpdateVisible: false,
|
||||
// showDetail: false,
|
||||
// tableBtn,
|
||||
// trueWidth: 80,
|
||||
tableProps,
|
||||
dataList: [],
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: '产线',
|
||||
placeholder: '产线',
|
||||
selectOptions: [],
|
||||
param: 'lineId',
|
||||
defaultSelect: ''
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: '设备名称', // 输入过滤
|
||||
placeholder: '设备名称',
|
||||
filterable: true,
|
||||
valueField: 'name',
|
||||
param: 'eqName',
|
||||
selectOptions: [],
|
||||
defaultSelect: ''
|
||||
},
|
||||
// {
|
||||
// type: 'datePicker',
|
||||
// label: this.$t('module.factory.abnormalAlarm.timeQuantum'),
|
||||
// dateType: 'daterange',
|
||||
// rangeSeparator: '-',
|
||||
// startPlaceholder: this.$t('module.orderManage.order.StartTime'),
|
||||
// endPlaceholder: this.$t('module.orderManage.order.StartTime'),
|
||||
// param: 'timeSlot'
|
||||
// },
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.fetchList('product-line')
|
||||
this.fetchList('equipment')
|
||||
},
|
||||
methods: {
|
||||
fetchList(type) {
|
||||
switch (type) {
|
||||
case 'product-line':
|
||||
return getProductLineList().then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
this.headFormConfig[0].selectOptions = res.data.map(item => ({ id: item.id, name: item.name }))
|
||||
} else {
|
||||
this.headFormConfig[0].selectOptions.splice(0)
|
||||
}
|
||||
})
|
||||
case 'equipment':
|
||||
return getEquipmentList().then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
this.headFormConfig[1].selectOptions = res.data.map(item => ({ id: item.id, name: item.name }))
|
||||
} else {
|
||||
this.headFormConfig[1].selectOptions.splice(0)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
const pdlId = this.headFormValue.lineId || ''
|
||||
const name = this.headFormValue.eqName || ''
|
||||
|
||||
list({ ...this.listQuery, pdlId, name }).then(response => {
|
||||
if (response.data.records) {
|
||||
this.dataList = response.data.records
|
||||
} else {
|
||||
this.dataList.splice(0)
|
||||
}
|
||||
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
|
||||
handleTableEvents({ action, data }) {
|
||||
// 跳转到<厂务>-<设备报警> 那边
|
||||
this.$router.push({
|
||||
name: 'EquipmentAlarm',
|
||||
params: {
|
||||
eqName: data.eqName
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 新增 / 修改
|
||||
// addNew(id) {
|
||||
// this.addOrUpdateVisible = true
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.addOrUpdate.init(id)
|
||||
// })
|
||||
// },
|
||||
// clickTopBtn(val) {
|
||||
// if (val === 'add') {
|
||||
// this.addNew() // 新增
|
||||
// }
|
||||
// }
|
||||
// handleClick(raw) {
|
||||
// if (raw.type === 'edit') {
|
||||
// this.addNew(raw.data.id)
|
||||
// } else if (raw.type === 'detail') {
|
||||
// this.showDetail = true
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.detailShow.emitClick(raw.data.id)
|
||||
// })
|
||||
// }
|
||||
// },
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,75 @@
|
||||
<!--
|
||||
* @Author: gtz
|
||||
* @Date: 2021-06-17 16:54:55
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-06-17 17:19:56
|
||||
* @Description: file content
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :visible.sync="visible" :title="$t('module.equipmentManager.equipmentParams.choiceParam')" @open="onOpen" @close="onClose">
|
||||
<el-checkbox-group
|
||||
v-model="checkedItems"
|
||||
:min="0"
|
||||
:max="100"
|
||||
>
|
||||
<el-checkbox v-for="item in items" :key="item.id" :label="item.id">{{ item.name }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
paramNameList: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
checkParams: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
items: [],
|
||||
checkedItems: [],
|
||||
visible: false
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {
|
||||
isShow: function(val) {
|
||||
this.visible = val
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.items = JSON.parse(JSON.stringify(this.paramNameList))
|
||||
this.checkedItems = JSON.parse(JSON.stringify(this.checkParams))
|
||||
},
|
||||
onClose() {},
|
||||
close() {
|
||||
this.$emit('close')
|
||||
},
|
||||
handelConfirm() {
|
||||
this.$emit('handelConfirm', this.checkedItems)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
185
src/views/EquipmentManager/equipmentParams/index.vue
Normal file
185
src/views/EquipmentManager/equipmentParams/index.vue
Normal file
@@ -0,0 +1,185 @@
|
||||
<!--
|
||||
* @Author: gtz
|
||||
* @Date: 2021-06-17 09:49:03
|
||||
* @LastEditors: gtz
|
||||
* @LastEditTime: 2021-06-17 17:53:30
|
||||
* @Description: file content
|
||||
-->
|
||||
<!--
|
||||
* @Date: 2020-12-15 15:36:52
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-05-25 08:57:51
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\MaintainLog\index.vue
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="usermanager-container">
|
||||
<div class="method-btn-area">
|
||||
{{ $t('module.equipmentManager.equipmentParams.startAndEndTime') }}：
|
||||
<el-date-picker
|
||||
v-model="date"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
:start-placeholder="$t('module.equipmentManager.equipmentParams.startTime')"
|
||||
:end-placeholder="$t('module.equipmentManager.equipmentParams.endTime')"
|
||||
@change="changeTime"
|
||||
/>
|
||||
<el-button type="primary" @click="showChoiceParam">{{ $t('module.equipmentManager.equipmentParams.choiceParam') }}</el-button>
|
||||
<el-button type="primary" @click="getList">{{ 'btn.search' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="4">
|
||||
<div class="tree-select-container">
|
||||
<Tree :tree-type="treeType" @lastNodeClick="eqChange" />
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<base-table :table-config="tableProps" :table-data="list" :is-loading="listLoading" :page="listQuery.current" :limit="listQuery.size" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
<pagination v-show="total > listQuery.size" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size" @pagination="getList" />
|
||||
<choice-dialog :param-name-list="paramNameList" :check-params="checkParamName" :is-show="choiceParamShow" @handleConfirm="handleConfirm" @close="closeDialog" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { timeFormatter } from '@/filters'
|
||||
import Tree from '@/components/Tree'
|
||||
const tableProps = [{
|
||||
prop: 'substrateId',
|
||||
label: i18n.t('module.equipmentManager.equipmentParams.substrateId'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'createTime',
|
||||
label: i18n.t('module.equipmentManager.equipmentParams.createTime'),
|
||||
align: 'center',
|
||||
filter: timeFormatter
|
||||
}]
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import choiceDialog from './choiceParamModel.vue'
|
||||
// edit here
|
||||
import { getParamNameList, getParamList } from '@/api/equipment/equipmentParams'
|
||||
|
||||
import Pagination from '@/components/Pagination'
|
||||
import i18n from '@/lang'
|
||||
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
components: { Pagination, BaseTable, Tree, choiceDialog },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
tableProps,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: false,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10,
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
equipmentId: null,
|
||||
paramNameList: ''
|
||||
},
|
||||
paramNameList: [],
|
||||
paramNameObj: {},
|
||||
checkParamName: [],
|
||||
date: null,
|
||||
treeType: 'equipment',
|
||||
choiceParamShow: false
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
this.tableProps = tableProps
|
||||
this.checkParamName.map(item => {
|
||||
this.tableProps.push({
|
||||
prop: this.paramNameObj[item],
|
||||
label: this.paramNameObj[item],
|
||||
align: 'center'
|
||||
})
|
||||
})
|
||||
// edit here
|
||||
const result = await getParamList(this.listQuery)
|
||||
if (result.code === 0) {
|
||||
this.list = result.data.records.map(item => {
|
||||
item.paramList.map(i => {
|
||||
item[i.name] = i.value
|
||||
})
|
||||
return item
|
||||
})
|
||||
this.total = result.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
async eqChange(data) {
|
||||
this.listQuery.equipmentId = data.id
|
||||
this.date = [new Date() - 1000 * 60 * 60 * 24, new Date()]
|
||||
const result = await getParamNameList({ equipmentId: data.id })
|
||||
if (result.code === 0) {
|
||||
this.paramNameList = result.data
|
||||
this.paramNameList(item => {
|
||||
this.paramNameObj[item.id] = item.name
|
||||
})
|
||||
if (this.paramNameList.length > 100) {
|
||||
this.listQuery.paramNameList = this.paramNameList.slice(0, 100).join(',')
|
||||
this.checkParamName = this.paramNameList.slice(0, 100).map(item => {
|
||||
return item.id
|
||||
})
|
||||
} else {
|
||||
this.listQuery.paramNameList = 'all'
|
||||
this.checkParamName = JSON.parse(JSON.stringify(this.ParamNameList)).map(item => {
|
||||
return item.id
|
||||
})
|
||||
}
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
showChoiceParam() {
|
||||
this.choiceParamShow = true
|
||||
},
|
||||
changeTime(val) {
|
||||
this.listQuery.startTime = val ? val[0] : null
|
||||
this.listQuery.endTime = val ? val[1] : null
|
||||
},
|
||||
handleConfirm(data) {
|
||||
this.checkParamName = data
|
||||
this.listQuery.paramNameList = data.join(',')
|
||||
this.choiceParamShow = false
|
||||
},
|
||||
closeDialog() {
|
||||
this.choiceParamShow = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.usermanager-container {
|
||||
padding: 20px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
.tree-select-container {
|
||||
border: 1px solid #dfe6ec;
|
||||
min-height: 400px;
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,285 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 15:41:11
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-07-21 14:17:27
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form
|
||||
:model="formData"
|
||||
:inline="true"
|
||||
size="medium"
|
||||
label-width="80px"
|
||||
>
|
||||
<el-form-item>
|
||||
<el-radio-group v-model="formData.timeType">
|
||||
<el-radio-button label="Year">{{ $t('module.equipmentManager.equipmentVisualization.Year') }}</el-radio-button>
|
||||
<el-radio-button label="Quarter">{{ $t('module.equipmentManager.equipmentVisualization.Quarter') }}</el-radio-button>
|
||||
<el-radio-button label="Month">{{ $t('module.equipmentManager.equipmentVisualization.Month') }}</el-radio-button>
|
||||
<el-radio-button label="Week">{{ $t('module.equipmentManager.equipmentVisualization.Week') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.equipmentVisualization.timeSlot')" label-width="100px" prop="time">
|
||||
<el-date-picker
|
||||
v-model="formData.timeSlot"
|
||||
type="daterange"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:start-placeholder="$t('module.orderManage.order.StartTime')"
|
||||
:end-placeholder="$t('module.orderManage.order.StartTime')"
|
||||
:range-separator="$t('module.orderManage.order.To')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.orderManage.order.WorkOrderName')" prop="workOrderId">
|
||||
<el-select v-model="formData.workOrderId" filterable :placeholder="$i18nForm(['placeholder.input', $t('module.orderManage.order.WorkOrderName')])" clearable>
|
||||
<el-option
|
||||
v-for="item in WorkOrderList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList()"> {{ 'btn.search' | i18nFilter }} </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-radio-group v-model="barType" @change="setBarType">
|
||||
<el-radio-button label="Electric">{{ $t('module.equipmentManager.equipmentVisualization.Electric') }}</el-radio-button>
|
||||
<el-radio-button label="Water">{{ $t('module.equipmentManager.equipmentVisualization.Water') }}</el-radio-button>
|
||||
<el-radio-button label="Gas">{{ $t('module.equipmentManager.equipmentVisualization.Gas') }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
<el-card style="margin-top:10px">
|
||||
<echarts-bar
|
||||
v-if="BarVisible"
|
||||
ref="BarRef"
|
||||
:color="color"
|
||||
:bar-style="barStyle"
|
||||
:title="barTitle"
|
||||
:legend="legend"
|
||||
:x-axis="xAxis"
|
||||
:y-axis="yAxis"
|
||||
:series="series"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</el-card>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-card style="margin-top:10px;width:100%">
|
||||
<echarts-bar-one
|
||||
v-if="BarVisible1"
|
||||
:id="bar1"
|
||||
ref="BarRef1"
|
||||
:bar-style="barStyle1"
|
||||
:title="barTitle1"
|
||||
:legend="legend1"
|
||||
:x-axis="xAxis1"
|
||||
:y-axis="yAxis1"
|
||||
:series="series1"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card style="margin-top:10px;width:100%,">
|
||||
<echarts-gauge
|
||||
:id="gauge"
|
||||
:gauge-style="gaugeStyle"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
<div style="height:115px">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8"><div class="grid-content bg-purple">今日用电:10837</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">昨日用电:18832</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">前日用电:10837</div></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8"><div class="grid-content bg-purple">本周用电:80237</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">上周用电:17552</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">前周用电:657828</div></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8"><div class="grid-content bg-purple">本月用电:767837</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">上月用电:785879</div></el-col>
|
||||
<el-col :span="8"><div class="grid-content bg-purple">前月用电:765868</div></el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { workOrderList } from '@/api/orderManage/workOrder/workOrder'
|
||||
import echartsBar from './components/echarts-Bar.vue'
|
||||
import echartsBarOne from './components/echarts-Bar.vue'
|
||||
import echartsGauge from './components/echarts-Gauge.vue'
|
||||
/**
|
||||
* 表格表头配置项 TypeScript接口注释
|
||||
* tableConfig<ConfigItem> = []
|
||||
*
|
||||
* Interface ConfigItem = {
|
||||
* prop: string,
|
||||
* label: string,
|
||||
* width: string,
|
||||
* align: string,
|
||||
* subcomponent: function,
|
||||
* filter: function
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'EquipmentEnergyMonitor',
|
||||
components: { echartsBar, echartsBarOne, echartsGauge },
|
||||
data() {
|
||||
return {
|
||||
BarVisible: false,
|
||||
BarVisible1: true,
|
||||
WorkOrderList: [],
|
||||
barType: 'Electric',
|
||||
formData: {
|
||||
WorkOrderId: '',
|
||||
timeType: 'Month',
|
||||
timeSlot: []
|
||||
},
|
||||
// 假数据
|
||||
barStyle: {
|
||||
height: '400px',
|
||||
width: '100%',
|
||||
margin: '20px'
|
||||
},
|
||||
color: [
|
||||
'#5470C6', '#91CC75'
|
||||
],
|
||||
barTitle: {
|
||||
text: '能耗数据',
|
||||
subtext: '同环能耗数据'
|
||||
},
|
||||
legend: {
|
||||
data: ['综合线', '镀膜线']
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [{
|
||||
name: '综合线',
|
||||
data: [],
|
||||
type: 'bar'
|
||||
}, {
|
||||
name: '镀膜线',
|
||||
data: [],
|
||||
type: 'bar'
|
||||
}],
|
||||
// 假数据
|
||||
bar1: 'barChart1',
|
||||
barStyle1: {
|
||||
height: '515px',
|
||||
width: '100%',
|
||||
margin: '20px'
|
||||
},
|
||||
barTitle1: {
|
||||
text: '设备加工数量',
|
||||
subtext: '设备加工数量柱状图'
|
||||
},
|
||||
legend1: {
|
||||
data: []
|
||||
},
|
||||
xAxis1: {
|
||||
type: 'value'
|
||||
},
|
||||
yAxis1: {
|
||||
type: 'category',
|
||||
data: ['磨片机', '转片台', '磨边机', '清洗机', '钻孔机', '翻板机', '清洗机']
|
||||
},
|
||||
series1: [{
|
||||
name: '电量消耗',
|
||||
data: [323.234, 323.841, 755.45, 251.453, 454.786, 484.786, 154.786],
|
||||
barWidth: '60%',
|
||||
type: 'bar'
|
||||
}],
|
||||
gauge: 'gauge1',
|
||||
gaugeStyle: {
|
||||
height: '400px',
|
||||
width: '100%',
|
||||
margin: '20px'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.setBarType()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
const listQuery = {
|
||||
current: 1,
|
||||
size: 500
|
||||
}
|
||||
this.WorkOrderList.splice(0, this.WorkOrderList.length)
|
||||
workOrderList(listQuery).then(response => {
|
||||
if (response.data.records) {
|
||||
this.WorkOrderList = response.data.records
|
||||
}
|
||||
})
|
||||
if (this.formData.timeSlot) {
|
||||
this.formData.startTime = this.formData.timeSlot[0]
|
||||
this.formData.endTime = this.formData.timeSlot[1]
|
||||
} else {
|
||||
this.formData.startTime = ''
|
||||
this.formData.endTime = ''
|
||||
}
|
||||
},
|
||||
setBarData() {
|
||||
this.series[0].data.splice(0, this.series[0].data.length)
|
||||
this.series[1].data.splice(0, this.series[1].data.length)
|
||||
for (let i = 0; i < 12; i++) {
|
||||
this.series[0].data.push(Math.round(Math.random() * 1500))
|
||||
this.series[1].data.push(Math.round(Math.random() * 1500))
|
||||
}
|
||||
},
|
||||
setBarType() {
|
||||
this.setBarData()
|
||||
this.BarVisible = true
|
||||
// 获取柱状图数据
|
||||
// getBarData(Object.assign(this.formData, { barType: this.barType })).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.getBarData = response.data.records
|
||||
// }
|
||||
// })
|
||||
this.$nextTick(() => {
|
||||
this.$refs.BarRef.init()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
.bg-purple {
|
||||
background: #d3dce6;
|
||||
}
|
||||
.grid-content {
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,185 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 15:41:11
|
||||
* @LastEditors: juzi
|
||||
* @LastEditTime: 2022-04-19
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<top-title />
|
||||
<head-form
|
||||
:form-config="headFormConfig"
|
||||
@headBtnClick="btnClick"
|
||||
/>
|
||||
<el-card>
|
||||
<el-menu
|
||||
:default-active="activeIndex"
|
||||
mode="horizontal"
|
||||
background-color="#545c64"
|
||||
text-color="#fff"
|
||||
active-text-color="#ffd04b"
|
||||
@select="handleSelect"
|
||||
>
|
||||
<el-menu-item index="1">{{ $t('module.equipmentManager.equipmentVisualization.DataTable') }}</el-menu-item>
|
||||
<el-menu-item index="2">{{ $t('module.equipmentManager.equipmentVisualization.Histogram') }}</el-menu-item>
|
||||
</el-menu>
|
||||
</el-card>
|
||||
<EquipmentProcessingQuantity-table v-if="tableVisible" ref="tableRef" @refreshDataList="getList" />
|
||||
<echarts-bar
|
||||
v-if="BarVisible"
|
||||
ref="BarRef"
|
||||
:bar-style="barStyle"
|
||||
:title="barTitle"
|
||||
:legend="legend"
|
||||
:x-axis="xAxis"
|
||||
:y-axis="yAxis"
|
||||
:series="series"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import EquipmentProcessingQuantityTable from './components/EquipmentProcessingQuantity-table'
|
||||
import echartsBar from './components/echarts-Bar.vue'
|
||||
import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
/**
|
||||
* 表格表头配置项 TypeScript接口注释
|
||||
* tableConfig<ConfigItem> = []
|
||||
*
|
||||
* Interface ConfigItem = {
|
||||
* prop: string,
|
||||
* label: string,
|
||||
* width: string,
|
||||
* align: string,
|
||||
* subcomponent: function,
|
||||
* filter: function
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'EquipmentProcessingQuantity',
|
||||
components: { TopTitle, HeadForm, EquipmentProcessingQuantityTable, echartsBar },
|
||||
data() {
|
||||
return {
|
||||
tableVisible: false,
|
||||
BarVisible: false,
|
||||
activeIndex: '1',
|
||||
formData: {
|
||||
timeSlot: [],
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
// 假数据
|
||||
barStyle: {
|
||||
height: '500px',
|
||||
width: '100%',
|
||||
margin: '20px'
|
||||
},
|
||||
barTitle: {
|
||||
text: '设备加工数量',
|
||||
subtext: '设备加工数量柱状图'
|
||||
},
|
||||
legend: {
|
||||
data: []
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['磨片机', '转片台', '磨边机', '清洗机', '钻孔机', '翻板机', '清洗机', '预热段', '固化炉', '冷却机', '丝印机', '固化炉', '钢化炉', '风栅段', '清洗剂', '在线检测段', '下片机械手', '铺纸机', '磨边机', '转片台', '磨边机', '清洗机', '清洗机', '预热段', '固化炉', '冷却机', '固化炉', '钢化炉', '风栅段', '清洗剂', '在线检测段', '下片机械手', '铺纸机'],
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
formatter: function(value) {
|
||||
return value.split('').join('\n')
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [{
|
||||
data: [120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, 150, 160, 140, 170, 155, 140],
|
||||
type: 'scatter',
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: 'rgba(220, 220, 220, 0.8)'
|
||||
}
|
||||
}],
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: this.$t('module.equipmentManager.equipmentVisualization.timeSlot'),
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd',
|
||||
valueFormat: 'yyyy-MM-dd',
|
||||
rangeSeparator: this.$t('module.orderManage.order.To'),
|
||||
startPlaceholder: this.$t('module.orderManage.order.StartTime'),
|
||||
endPlaceholder: this.$t('module.orderManage.order.EndTime'),
|
||||
param: 'timeSlot'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.handleSelect('1')
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
if (this.formData.timeSlot) {
|
||||
this.formData.startTime = this.headFormValue.timeSlot[0]
|
||||
this.formData.endTime = this.headFormValue.timeSlot[1]
|
||||
} else {
|
||||
this.formData.startTime = ''
|
||||
this.formData.endTime = ''
|
||||
}
|
||||
},
|
||||
handleSelect(key, keyPath) {
|
||||
this.tableVisible = false
|
||||
this.BarVisible = false
|
||||
switch (key) {
|
||||
case '1':
|
||||
this.tableVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.tableRef.init()
|
||||
})
|
||||
break
|
||||
case '2':
|
||||
this.BarVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.BarRef.init()
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
225
src/views/EquipmentManager/equipmentVisualization/Visualized.vue
Normal file
225
src/views/EquipmentManager/equipmentVisualization/Visualized.vue
Normal file
@@ -0,0 +1,225 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 15:41:11
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-07-21 14:58:20
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form
|
||||
:model="formData"
|
||||
:inline="true"
|
||||
size="medium"
|
||||
label-width="80px"
|
||||
>
|
||||
<el-form-item :label="$t('module.equipmentManager.equipmentVisualization.timeSlot')" label-width="100px" prop="time">
|
||||
<el-date-picker
|
||||
v-model="formData.timeSlot"
|
||||
type="daterange"
|
||||
format="yyyy-MM-dd"
|
||||
value-format="yyyy-MM-dd"
|
||||
:start-placeholder="$t('module.orderManage.order.StartTime')"
|
||||
:end-placeholder="$t('module.orderManage.order.StartTime')"
|
||||
:range-separator="$t('module.orderManage.order.To')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList()"> {{ 'btn.search' | i18nFilter }} </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-a
|
||||
id="pieA"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title1"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-b
|
||||
id="pieB"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title2"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-c
|
||||
id="pieC"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title3"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-d
|
||||
id="pieD"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title4"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-e
|
||||
id="pieE"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title5"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div>
|
||||
<echarts-pie-f
|
||||
id="pieF"
|
||||
ref="BarRef"
|
||||
:pie-style="pieStyle"
|
||||
:title="title6"
|
||||
:legend="legend"
|
||||
:name="name"
|
||||
:data="pieData"
|
||||
@refreshDataList="getList"
|
||||
/>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echartsPieA from './components/echarts-Pie.vue'
|
||||
import echartsPieB from './components/echarts-Pie.vue'
|
||||
import echartsPieC from './components/echarts-Pie.vue'
|
||||
import echartsPieD from './components/echarts-Pie.vue'
|
||||
import echartsPieE from './components/echarts-Pie.vue'
|
||||
import echartsPieF from './components/echarts-Pie.vue'
|
||||
/**
|
||||
* 表格表头配置项 TypeScript接口注释
|
||||
* tableConfig<ConfigItem> = []
|
||||
*
|
||||
* Interface ConfigItem = {
|
||||
* prop: string,
|
||||
* label: string,
|
||||
* width: string,
|
||||
* align: string,
|
||||
* subcomponent: function,
|
||||
* filter: function
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
|
||||
export default {
|
||||
name: 'EquipmentProcessingQuantity',
|
||||
components: { echartsPieA, echartsPieB, echartsPieC, echartsPieD, echartsPieE, echartsPieF },
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
timeSlot: [],
|
||||
current: 1,
|
||||
size: 10
|
||||
},
|
||||
// 假数据
|
||||
pieStyle: {
|
||||
height: '350px',
|
||||
width: '100%',
|
||||
margin: '20px'
|
||||
},
|
||||
title1: {
|
||||
text: '磨边机',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
title2: {
|
||||
text: '转片台',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
title3: {
|
||||
text: '清洗机',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
title4: {
|
||||
text: '清洗机',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
title5: {
|
||||
text: '钻孔机',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
title6: {
|
||||
text: '钢化炉',
|
||||
subtext: '运行状态良好'
|
||||
},
|
||||
legend: {
|
||||
top: 'bottom',
|
||||
left: 'center'
|
||||
},
|
||||
name: '时间',
|
||||
pieData: [
|
||||
{ value: Math.round(Math.random() * 200), name: '运行时间' },
|
||||
{ value: Math.round(Math.random() * 200), name: '维修时间' },
|
||||
{ value: Math.round(Math.random() * 200), name: '维护时间' },
|
||||
{ value: Math.round(Math.random() * 200), name: '停机时间' }
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
if (this.formData.timeSlot) {
|
||||
this.formData.startTime = this.formData.timeSlot[0]
|
||||
this.formData.endTime = this.formData.timeSlot[1]
|
||||
} else {
|
||||
this.formData.startTime = ''
|
||||
this.formData.endTime = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,129 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 15:41:11
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2021-07-21 14:58:37
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import i18n from '@/lang'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
// import { timeFormatter } from '@/filters'
|
||||
/**
|
||||
* 表格表头配置项 TypeScript接口注释
|
||||
* tableConfig<ConfigItem> = []
|
||||
*
|
||||
* Interface ConfigItem = {
|
||||
* prop: string,
|
||||
* label: string,
|
||||
* width: string,
|
||||
* align: string,
|
||||
* subcomponent: function,
|
||||
* filter: function
|
||||
* }
|
||||
*
|
||||
*
|
||||
*/
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'name',
|
||||
label: i18n.t('module.basicData.equipment.EquipmentName'),
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.basicData.equipment.EquipmentCode'),
|
||||
align: 'center'
|
||||
}, {
|
||||
prop: 'ProcessingQuantity',
|
||||
label: i18n.t('module.equipmentManager.equipmentVisualization.ProcessingQuantity'),
|
||||
align: 'center'
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
name: '',
|
||||
components: { BaseTable },
|
||||
props: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tableProps,
|
||||
list: [],
|
||||
listLoading: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.listQuery = {
|
||||
current: 1,
|
||||
size: 10
|
||||
}
|
||||
this.getList()
|
||||
},
|
||||
getList() {
|
||||
this.list = [
|
||||
{
|
||||
'name': '磨边机',
|
||||
'code': 'SB20210203000028',
|
||||
'ProcessingQuantity': '361'
|
||||
},
|
||||
{
|
||||
'name': '转片台',
|
||||
'code': 'SB20210203000105',
|
||||
'ProcessingQuantity': '2'
|
||||
},
|
||||
{
|
||||
'name': '钢化炉',
|
||||
'code': 'SB20210203000208',
|
||||
'ProcessingQuantity': '987'
|
||||
},
|
||||
{
|
||||
'name': '清洗机',
|
||||
'code': 'SB20210203000450',
|
||||
'ProcessingQuantity': '65'
|
||||
},
|
||||
{
|
||||
'name': '钻孔机',
|
||||
'code': 'SB20210203000768',
|
||||
'ProcessingQuantity': '7645'
|
||||
}
|
||||
]
|
||||
// this.listLoading = true
|
||||
// staffList(this.listQuery).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.list = response.data.records
|
||||
// } else {
|
||||
// this.list.splice(0, this.list.length)
|
||||
// }
|
||||
// this.listLoading = false
|
||||
// })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.edit-input {
|
||||
padding-right: 100px;
|
||||
}
|
||||
.cancel-btn {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,108 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2021-03-03 16:39:34
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2021-04-22 16:30:12
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :id="id" :style="barStyle" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return 'barChart'
|
||||
}
|
||||
},
|
||||
barStyle: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
series: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
},
|
||||
color: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return ['#5470C6']
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.chart = echarts.init(document.getElementById(this.id))
|
||||
|
||||
this.chart.setOption({
|
||||
color: this.color,
|
||||
title: this.title,
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: this.legend,
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: this.xAxis,
|
||||
yAxis: this.yAxis,
|
||||
series: this.series
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,125 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2021-03-03 16:39:34
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2021-04-22 18:06:50
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :id="id" :style="gaugeStyle" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return 'barChart'
|
||||
}
|
||||
},
|
||||
gaugeStyle: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.chart = echarts.init(document.getElementById(this.id))
|
||||
|
||||
this.chart.setOption({
|
||||
title: {
|
||||
text: '实时能耗',
|
||||
subtext: 'Kwh'
|
||||
},
|
||||
series: [{
|
||||
type: 'gauge',
|
||||
center: ['50%', '70%'],
|
||||
startAngle: 180,
|
||||
endAngle: 0,
|
||||
min: 0,
|
||||
max: 500000,
|
||||
splitNumber: 10,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
width: 10,
|
||||
opacity: 0.5,
|
||||
color: [
|
||||
[0.4, '#1CB727'],
|
||||
[0.7, '#E0980C'],
|
||||
[1, '#fd666d']
|
||||
]
|
||||
}
|
||||
},
|
||||
pointer: {
|
||||
itemStyle: {
|
||||
opacity: 0.5
|
||||
}
|
||||
},
|
||||
progress: {
|
||||
show: true,
|
||||
width: 10
|
||||
},
|
||||
axisTick: {
|
||||
distance: -45,
|
||||
splitNumber: 2,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: '#999'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
distance: -32,
|
||||
length: 20,
|
||||
lineStyle: {
|
||||
width: 3,
|
||||
color: '#999'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: 'auto',
|
||||
distance: -65,
|
||||
fontSize: 15
|
||||
},
|
||||
detail: {
|
||||
valueAnimation: true,
|
||||
offsetCenter: [0, '-15%'],
|
||||
formatter: function(value) {
|
||||
return '{value|' + value.toFixed(0) + 'Kwh}'
|
||||
},
|
||||
color: 'auto',
|
||||
rich: {
|
||||
value: {
|
||||
fontSize: 20,
|
||||
fontWeight: 'bolder'
|
||||
}
|
||||
}
|
||||
},
|
||||
data: [{
|
||||
value: 81175
|
||||
}]
|
||||
}]
|
||||
}, true)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,103 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2021-03-03 16:39:34
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2021-04-22 18:59:58
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :id="id" :style="pieStyle" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return 'barChart'
|
||||
}
|
||||
},
|
||||
pieStyle: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return ''
|
||||
}
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.chart = echarts.init(document.getElementById(this.id))
|
||||
|
||||
this.chart.setOption({
|
||||
title: this.title,
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
},
|
||||
legend: this.legend,
|
||||
series: [
|
||||
{
|
||||
name: this.name,
|
||||
type: 'pie',
|
||||
radius: ['40%', '70%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: '20',
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
},
|
||||
data: this.data
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,390 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" :title="(!dataForm.id ? 'btn.add' : (isDetail ? 'btn.detail' :'btn.edit')) | i18nFilter" class="dialog" @close="close">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-width="80px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
:label="this.$t('module.equipmentManager.inspectionManage.equipmentName')"
|
||||
prop="equipmentId"
|
||||
>
|
||||
<el-select
|
||||
v-model="dataForm.equipmentId"
|
||||
filterable
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.equipmentName')"
|
||||
:disabled="isDetail || (dataForm.id ? true : false)"
|
||||
@change="selectOrder()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.equipmentCode')" prop="equipmentCode">
|
||||
<el-input
|
||||
v-model="dataForm.equipmentCode"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.equipmentCode')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionWorker')" prop="inspectionWorker">
|
||||
<el-input
|
||||
v-model="dataForm.inspectionWorker"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionWorkerTip')])"
|
||||
:disabled="isDetail"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.basicData.knowledge.time')" prop="timeStr">
|
||||
<el-date-picker
|
||||
v-model="dataForm.timeStr"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
format="yyyy-MM-dd HH:mm:ss"
|
||||
value-format="yyyy-MM-ddTHH:mm:ss"
|
||||
:start-placeholder="$t('module.basicData.knowledge.startTime')"
|
||||
:end-placeholder="$t('module.basicData.knowledge.endTime')"
|
||||
:disabled="isDetail"
|
||||
style="width:384px"
|
||||
@change="selectSource"
|
||||
@input="selectSource"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.source')" prop="source">
|
||||
<el-select
|
||||
v-model="dataForm.source"
|
||||
filterable
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.source')"
|
||||
:disabled="isDetail"
|
||||
@change="selectSource"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in sourceList"
|
||||
:key="item.dataCode"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
v-if="dataForm.id ? false : true"
|
||||
:label="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
|
||||
prop="id"
|
||||
>
|
||||
<el-select
|
||||
v-model="dataForm.itemList"
|
||||
filterable
|
||||
multiple
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in itemList"
|
||||
:key="item.id"
|
||||
:label="item.inspectionItem"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.totalDetail')" prop="inspectionWorker">
|
||||
<el-input
|
||||
v-model="dataForm.inspectionDesc"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 4, maxRows: 8}"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.totalDetail')])"
|
||||
:disabled="isDetail"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.basicData.knowledge.annex')">
|
||||
<el-upload
|
||||
v-if="!isDetail"
|
||||
:multiple="false"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:headers="{ token }"
|
||||
:on-success="succrssFun"
|
||||
:on-error="errorFun"
|
||||
:action="uploadPath"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:show-file-list="false"
|
||||
style="display: inline-block"
|
||||
>
|
||||
<el-button type="primary" :loading="showLoading">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
<span v-if="dataForm.annexUrl" style="cursor: pointer; margin-left:20px;" @click="downloadFile">{{ $t('module.basicData.knowledge.download') }}</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="text-align: right">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!isDetail" type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { equipmentList, einspectionLog, geteinspectionLog, einspectionLogU, eInspectionItem, inspectionItemList } from '@/api/equipment/inspectionManager'
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { getToken } from '@/utils/auth'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
dataObj: { typeCode: 'file' },
|
||||
uploadPath,
|
||||
token: getToken(),
|
||||
showLoading: false,
|
||||
list: [],
|
||||
itemList: [],
|
||||
selectedItem: [],
|
||||
sourceList: JSON.parse(localStorage.getItem('dictObj'))['1523941494259912706'],
|
||||
dataForm: {
|
||||
id: '',
|
||||
equipmentId: '',
|
||||
equipmentCode: '',
|
||||
inspectionWorker: '',
|
||||
timeStr: [],
|
||||
inspectionEndTime: '',
|
||||
inspectionStartTime: '',
|
||||
source: '',
|
||||
itemList: [],
|
||||
inspectionDesc: '',
|
||||
annexUrl: ''
|
||||
},
|
||||
dataRule: {
|
||||
equipmentId: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.inspectionManage.equipmentName')]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
},
|
||||
isSubmit: true, // 是否允许提交，如果该设备未关联巡检项目不允许提交
|
||||
isDetail: false // 详情(true)的话将输入框disabled的
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init(id, name) {
|
||||
this.visible = true
|
||||
this.getEquipmentList()
|
||||
if (name === 'detail' || name === 'edit') {
|
||||
this.dataForm.id = id
|
||||
geteinspectionLog({
|
||||
id: this.dataForm.id
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.dataForm = res.data
|
||||
this.dataForm.source = res.data.source ? res.data.source + '' : ''
|
||||
if (this.dataForm.inspectionStartTime && this.dataForm.inspectionEndTime) {
|
||||
const arr = []
|
||||
arr.push(this.dataForm.inspectionStartTime)
|
||||
arr.push(this.dataForm.inspectionEndTime)
|
||||
this.dataForm.timeStr = arr
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
if (name === 'detail') {
|
||||
this.isDetail = true
|
||||
} else if (name === 'edit') {
|
||||
this.isSubmit = true
|
||||
}
|
||||
},
|
||||
getEquipmentList() {
|
||||
equipmentList({
|
||||
current: 1,
|
||||
size: 999
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.list = res.data
|
||||
} else {
|
||||
this.list = []
|
||||
}
|
||||
})
|
||||
inspectionItemList({
|
||||
current: 1,
|
||||
size: 999,
|
||||
type: 1
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.itemList = res.data
|
||||
} else {
|
||||
this.itemList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
selectOrder() {
|
||||
this.list.map(item => {
|
||||
if (item.id === this.dataForm.equipmentId) {
|
||||
this.dataForm.equipmentCode = item.code
|
||||
}
|
||||
})
|
||||
eInspectionItem({
|
||||
equipmentId: this.dataForm.equipmentId
|
||||
}).then(res => {
|
||||
if (res.data && res.data.length === 0) {
|
||||
this.isSubmit = false
|
||||
this.$message({
|
||||
message: this.$t('module.equipmentManager.inspectionManage.einspectionLogTip'),
|
||||
type: 'warning',
|
||||
duration: 2000
|
||||
})
|
||||
} else {
|
||||
const arr = res.data
|
||||
this.isSubmit = true
|
||||
this.selectedItem = []
|
||||
arr.map(item => {
|
||||
this.selectedItem.push(item.itemId)
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
selectSource() {
|
||||
this.$forceUpdate()
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: this.$t('module.equipmentManager.inspectionManage.uploadError')
|
||||
})
|
||||
}
|
||||
this.showLoading = true
|
||||
return isRightSize
|
||||
},
|
||||
succrssFun(res) {
|
||||
this.showLoading = false
|
||||
if (res.code === 0) {
|
||||
this.dataForm.annexUrl = res.data[0].id
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: this.$t('module.equipmentManager.inspectionManage.uploadErrorTip')
|
||||
})
|
||||
}
|
||||
},
|
||||
errorFun() {
|
||||
this.showLoading = false
|
||||
},
|
||||
downloadFile() {
|
||||
window.open(`${location.origin}/api/common/attachment/downloadFile?type=file&attachmentId=${this.dataForm.annexUrl}`)
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (!this.isSubmit) {
|
||||
this.$message({
|
||||
message: this.$t('module.equipmentManager.inspectionManage.einspectionLogTip'),
|
||||
type: 'warning',
|
||||
duration: 2000
|
||||
})
|
||||
return false
|
||||
}
|
||||
if (valid) {
|
||||
this.dataForm.inspectionEndTime = this.dataForm.timeStr.length > 0 ? this.dataForm.timeStr[1] : ''
|
||||
this.dataForm.inspectionStartTime = this.dataForm.timeStr.length > 0 ? this.dataForm.timeStr[0] : ''
|
||||
if (this.dataForm.id) {
|
||||
einspectionLogU({
|
||||
id: this.dataForm.id,
|
||||
equipmentId: this.dataForm.equipmentId,
|
||||
annexUrl: this.dataForm.annexUrl,
|
||||
inspectionDesc: this.dataForm.inspectionDesc,
|
||||
inspectionEndTime: this.dataForm.inspectionEndTime,
|
||||
inspectionStartTime: this.dataForm.inspectionStartTime,
|
||||
inspectionWorker: this.dataForm.inspectionWorker,
|
||||
source: this.dataForm.source
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
einspectionLog({
|
||||
equipmentId: this.dataForm.equipmentId,
|
||||
annexUrl: this.dataForm.annexUrl,
|
||||
inspectionDesc: this.dataForm.inspectionDesc,
|
||||
inspectionEndTime: this.dataForm.inspectionEndTime,
|
||||
inspectionStartTime: this.dataForm.inspectionStartTime,
|
||||
inspectionWorker: this.dataForm.inspectionWorker,
|
||||
source: this.dataForm.source,
|
||||
itemList: this.dataForm.itemList.concat(this.selectedItem)
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.dataForm.id = ''
|
||||
this.dataForm.equipmentId = ''
|
||||
this.dataForm.equipmentCode = ''
|
||||
this.dataForm.inspectionWorker = ''
|
||||
this.dataForm.timeStr = []
|
||||
this.dataForm.inspectionEndTime = ''
|
||||
this.dataForm.inspectionStartTime = ''
|
||||
this.dataForm.source = ''
|
||||
this.dataForm.itemList = []
|
||||
this.dataForm.inspectionDesc = ''
|
||||
this.dataForm.annexUrl = ''
|
||||
this.selectedItem = []
|
||||
this.isDetail = false
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,186 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" :title="(isDetail ? 'btn.detail' : 'btn.edit') | i18nFilter" class="dialog" @close="close">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
label-width="100px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
:label="this.$t('module.equipmentManager.inspectionManage.inspectionContent')"
|
||||
prop="inspectionContent"
|
||||
>
|
||||
<el-input
|
||||
v-model="dataForm.inspectionContent"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContent')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionContentCode')" prop="inspectionItem">
|
||||
<el-input
|
||||
v-model="dataForm.inspectionItem"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContentCode')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.detailrecord')" prop="description">
|
||||
<el-input
|
||||
v-model="dataForm.description"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 4, maxRows: 8}"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.detailrecord')])"
|
||||
clearable
|
||||
:disabled="isDetail"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="24">
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.basicData.knowledge.annex')">
|
||||
<el-upload
|
||||
v-if="!isDetail"
|
||||
:multiple="false"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:headers="{ token }"
|
||||
:on-success="succrssFun"
|
||||
:on-error="errorFun"
|
||||
:action="uploadPath"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:show-file-list="false"
|
||||
style="display: inline-block"
|
||||
>
|
||||
<el-button type="primary" :loading="showLoading">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
<span v-if="dataForm.annexUrl" style="cursor: pointer; margin-left:20px;" @click="downloadFile">{{ $t('module.basicData.knowledge.download') }}</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row style="text-align: right">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button v-if="!isDetail" type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { einspectionItemLogU, geteinspectionItemLog } from '@/api/equipment/inspectionManager'
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import { getToken } from '@/utils/auth'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
isDetail: true, // true是详情
|
||||
dataObj: { typeCode: 'file' },
|
||||
uploadPath,
|
||||
token: getToken(),
|
||||
showLoading: false,
|
||||
list: [],
|
||||
dataForm: {
|
||||
id: '',
|
||||
inspectionContent: '',
|
||||
inspectionItem: '',
|
||||
description: '',
|
||||
annexUrl: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init(id, type) {
|
||||
this.visible = true
|
||||
if (type === 'edit') {
|
||||
this.isDetail = false
|
||||
} else {
|
||||
this.isDetail = true
|
||||
}
|
||||
this.dataForm.id = id
|
||||
geteinspectionItemLog({
|
||||
id: this.dataForm.id
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.dataForm = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: this.$t('module.equipmentManager.inspectionManage.uploadError')
|
||||
})
|
||||
}
|
||||
this.showLoading = true
|
||||
return isRightSize
|
||||
},
|
||||
succrssFun(res) {
|
||||
this.showLoading = false
|
||||
if (res.code === 0) {
|
||||
this.dataForm.annexUrl = res.data[0].id
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: this.$t('module.equipmentManager.inspectionManage.uploadErrorTip')
|
||||
})
|
||||
}
|
||||
},
|
||||
errorFun() {
|
||||
this.showLoading = false
|
||||
},
|
||||
downloadFile() {
|
||||
window.open(`${location.origin}/api/common/attachment/downloadFile?type=file&attachmentId=${this.dataForm.annexUrl}`)
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.dataForm.id) {
|
||||
einspectionItemLogU({
|
||||
id: this.dataForm.id,
|
||||
annexUrl: this.dataForm.annexUrl,
|
||||
description: this.dataForm.description
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.dataForm.id = ''
|
||||
this.dataForm.inspectionContent = ''
|
||||
this.dataForm.inspectionItem = ''
|
||||
this.dataForm.description = ''
|
||||
this.dataForm.annexUrl = ''
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" :title="(!dataForm.id ? 'btn.add' : 'btn.edit') | i18nFilter " class="dialog" @close="close">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-width="100px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionContentCode')" prop="code">
|
||||
<el-input
|
||||
v-model="dataForm.code"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContentCode')])"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionItem')" prop="inspectionItem">
|
||||
<el-input
|
||||
v-model="dataForm.inspectionItem"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionItem')])"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionContent')" prop="inspectionContent">
|
||||
<el-input
|
||||
v-model="dataForm.inspectionContent"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContent')])"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.type')" prop="type">
|
||||
<el-select
|
||||
v-model="dataForm.type"
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.type')"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in typeList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.remark')" prop="remark">
|
||||
<el-input
|
||||
v-model="dataForm.remark"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.remark')])"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row style="text-align: right">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { inspectionCode, getInspection, inspectionAdd, inspectionUpdate } from '@/api/equipment/inspectionManager'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
dataForm: {
|
||||
id: 0,
|
||||
code: '',
|
||||
inspectionItem: '',
|
||||
inspectionContent: '',
|
||||
type: 0,
|
||||
remark: ''
|
||||
},
|
||||
typeList: [
|
||||
{ id: 0, name: '必选' },
|
||||
{ id: 1, name: '非必选' }
|
||||
],
|
||||
dataRule: {
|
||||
inspectionItem: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.inspectionManage.inspectionItem')]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
inspectionContent: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.inspectionManage.inspectionContent')]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
type: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('module.equipmentManager.inspectionManage.type'),
|
||||
trigger: 'change'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init(id) {
|
||||
this.dataForm.id = id || ''
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
if (this.dataForm.id) {
|
||||
getInspection({
|
||||
id: this.dataForm.id
|
||||
}).then(res => {
|
||||
this.dataForm.code = res.data.code
|
||||
this.dataForm.inspectionItem = res.data.inspectionItem
|
||||
this.dataForm.inspectionContent = res.data.inspectionContent
|
||||
this.dataForm.type = res.data.type
|
||||
this.dataForm.remark = res.data.remark
|
||||
})
|
||||
} else {
|
||||
inspectionCode().then(res => {
|
||||
this.dataForm.code = res.data
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
const data = {
|
||||
code: this.dataForm.code,
|
||||
inspectionItem: this.dataForm.inspectionItem,
|
||||
inspectionContent: this.dataForm.inspectionContent,
|
||||
remark: this.dataForm.remark,
|
||||
type: this.dataForm.type,
|
||||
id: this.dataForm.id
|
||||
}
|
||||
if (this.dataForm.id) {
|
||||
inspectionUpdate(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
inspectionAdd(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.dataForm.id = 0
|
||||
this.dataForm.code = ''
|
||||
this.dataForm.inspectionItem = ''
|
||||
this.dataForm.inspectionContent = ''
|
||||
this.dataForm.type = 0
|
||||
this.dataForm.remark = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,121 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" :title="'btn.add' | i18nFilter" class="dialog" @close="close">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-width="100px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-form-item
|
||||
:label="this.$t('module.equipmentManager.inspectionManage.equipmentName')"
|
||||
prop="id"
|
||||
>
|
||||
<el-select
|
||||
v-model="dataForm.id"
|
||||
filterable
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.equipmentName')"
|
||||
@change="selectOrder()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.equipmentCode')" prop="code">
|
||||
<el-input
|
||||
v-model="dataForm.code"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.equipmentCode')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row style="text-align: right">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { equipmentList, equipmentAdd } from '@/api/equipment/inspectionManager'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
list: [],
|
||||
dataForm: {
|
||||
id: '',
|
||||
code: ''
|
||||
},
|
||||
dataRule: {
|
||||
id: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.inspectionManage.equipmentName')]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
equipmentList({
|
||||
current: 1,
|
||||
size: 999
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.list = res.data
|
||||
} else {
|
||||
this.list = []
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
selectOrder() {
|
||||
this.list.map(item => {
|
||||
if (item.id === this.dataForm.id) {
|
||||
this.dataForm.code = item.code
|
||||
}
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
equipmentAdd({ equipmentId: this.dataForm.id }).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1000,
|
||||
onClose: () => {
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.dataForm.id = ''
|
||||
this.dataForm.code = ''
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="visible" :title="'btn.edit' | i18nFilter" class="dialog" @close="close">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-width="100px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-form-item
|
||||
:label="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
|
||||
prop="id"
|
||||
>
|
||||
<el-select
|
||||
v-model="dataForm.id"
|
||||
filterable
|
||||
:placeholder="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
|
||||
@change="selectOrder()"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in list"
|
||||
:key="item.id"
|
||||
:label="item.inspectionItem"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionContentCode')" prop="code">
|
||||
<el-input
|
||||
v-model="dataForm.code"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContentCode')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.inspectionManage.inspectionContent')" prop="code">
|
||||
<el-input
|
||||
v-model="dataForm.content"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.inspectionManage.inspectionContent')])"
|
||||
clearable
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row style="text-align: right">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
|
||||
</el-row>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { inspectionItemList, einspectionItemAdd } from '@/api/equipment/inspectionManager'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
list: [],
|
||||
equipmentId: '',
|
||||
dataForm: {
|
||||
id: '',
|
||||
code: '',
|
||||
content: ''
|
||||
},
|
||||
dataRule: {
|
||||
id: [
|
||||
{
|
||||
required: true,
|
||||
message: this.$i18nForm(['placeholder.input', this.$t('module.equipmentManager.inspectionManage.inspectionItem')]),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init(id) {
|
||||
this.visible = true
|
||||
this.equipmentId = id
|
||||
this.$nextTick(() => {
|
||||
inspectionItemList({
|
||||
current: 1,
|
||||
size: 999,
|
||||
type: 0
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.list = res.data
|
||||
} else {
|
||||
this.list = []
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
selectOrder() {
|
||||
this.list.map(item => {
|
||||
if (item.id === this.dataForm.id) {
|
||||
this.dataForm.code = item.code
|
||||
this.dataForm.content = item.inspectionContent
|
||||
}
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
einspectionItemAdd({
|
||||
equipmentId: this.equipmentId,
|
||||
itemId: this.dataForm.id
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.close()
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.dataForm.id = ''
|
||||
this.dataForm.code = ''
|
||||
this.dataForm.content = ''
|
||||
this.equipmentId = ''
|
||||
this.visible = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,46 @@
|
||||
|
||||
<template>
|
||||
<el-switch v-model="state" type="text" size="small" :disabled="readonly" @change="changeHandler" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
state: false,
|
||||
payload: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
readonly() {
|
||||
return !!this.injectData.readonly
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.mapToState()
|
||||
},
|
||||
methods: {
|
||||
mapToState() {
|
||||
if (this.injectData['status'] && this.injectData['status'] === '1') {
|
||||
this.state = true
|
||||
} else {
|
||||
this.state = false
|
||||
}
|
||||
},
|
||||
changeHandler() {
|
||||
this.payload.id = this.injectData.id
|
||||
this.payload.status = this.state ? '1' : '0'
|
||||
this.$emit('emitData', {
|
||||
action: 'toggle-enabled-action',
|
||||
data: this.injectData.emitFullData ? { ...this.injectData, ...this.payload } : this.payload
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-tag size="medium" :type="tagType">{{ typeName }}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'StatusTag',
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tagType: '',
|
||||
typeName: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
injectData(newVal, oldVal) {
|
||||
if (oldVal.type !== newVal.type) {
|
||||
this.init()
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
if (this.injectData.type === 1) {
|
||||
this.typeName = '非必选'
|
||||
this.tagType = 'warning'
|
||||
} else {
|
||||
this.typeName = '必选'
|
||||
this.tagType = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
201
src/views/EquipmentManager/inspectionManage/inspection.vue
Normal file
201
src/views/EquipmentManager/inspectionManage/inspection.vue
Normal file
@@ -0,0 +1,201 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:method-list="tableBtn"
|
||||
:width="trueWidth"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
<inspection-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import i18n from '@/lang'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import { inspectionList, inspectionDel } from '@/api/equipment/inspectionManager'
|
||||
import inspectionAdd from './components/inspectionAdd.vue'
|
||||
import statusTag from './components/statusTag.vue'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'inspectionItem',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionItem')
|
||||
},
|
||||
{
|
||||
prop: 'inspectionContent',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContent')
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContentCode')
|
||||
},
|
||||
{
|
||||
prop: 'type',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.type'),
|
||||
subcomponent: statusTag,
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'remark',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.remark')
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'InspectionSetting',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, inspectionAdd },
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
trueWidth: 100,
|
||||
tableH: tableHeight(280),
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: false,
|
||||
tableProps,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionItem'),
|
||||
placeholder: this.$t('module.equipmentManager.inspectionManage.inspectionItem'),
|
||||
param: 'name'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.inspectionManage.type'),
|
||||
selectOptions: [
|
||||
{ id: 0, name: '必选' },
|
||||
{ id: 1, name: '非必选' }
|
||||
],
|
||||
param: 'type',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {},
|
||||
addOrUpdateVisible: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
})
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(
|
||||
`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.inspectionItem}]?`,
|
||||
this.$t('module.basicData.visual.Tips'),
|
||||
{
|
||||
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
type: 'warning'
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
inspectionDel({
|
||||
id: raw.data.id
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch(() => { })
|
||||
} else if (raw.type === 'edit') {
|
||||
this.addNew(raw.data.id)
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
this.listQuery.inspectionItem = this.headFormValue.name
|
||||
this.listQuery.type = this.headFormValue.type
|
||||
inspectionList(this.listQuery).then(res => {
|
||||
if (res.data.records) {
|
||||
this.list = res.data.records
|
||||
} else {
|
||||
this.list = []
|
||||
}
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
// 新增 / 修改
|
||||
addNew(id) {
|
||||
this.addOrUpdateVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init(id)
|
||||
})
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.addNew() // 新增
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
373
src/views/EquipmentManager/inspectionManage/inspectionRecord.vue
Normal file
373
src/views/EquipmentManager/inspectionManage/inspectionRecord.vue
Normal file
@@ -0,0 +1,373 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- left -->
|
||||
<div class="left-container">
|
||||
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
:high-index="highIndex"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
@selectRow="selectRow"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:method-list="tableBtn"
|
||||
:width="trueWidth"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
</div>
|
||||
<!-- right -->
|
||||
<div class="right-container">
|
||||
<top-title :base-title="this.$t('module.equipmentManager.inspectionManage.inspectionItem')" style="font-size: 14px; padding-bottom: 14px;" />
|
||||
<base-table
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:height="tableHR"
|
||||
:table-config="tablePropsR"
|
||||
:table-data="listR"
|
||||
:is-loading="listLoading"
|
||||
@emitFun="updateStatus"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:method-list="tableBtnR"
|
||||
:width="trueWidthR"
|
||||
@clickBtn="handleClickR"
|
||||
/>
|
||||
</base-table>
|
||||
</div>
|
||||
<einspectionitem-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
|
||||
<einspectionitemlog-add v-if="addOrUpdateVisibleR" ref="addOrUpdateR" @refreshDataList="getInspectionItem" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import i18n from '@/lang'
|
||||
import topTitle from '@/components/TopTitle'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import { equipmentList, inspectionLog, einspectionLogD, einspectionItList, einspectionItemLogU } from '@/api/equipment/inspectionManager'
|
||||
import einspectionitemAdd from './components/einspectionitemAdd.vue'
|
||||
import einspectionitemlogAdd from './components/einspectionitemlogAdd.vue'
|
||||
import { timeFormatter } from '@/filters'
|
||||
import StatusBtn from './components/statusBtn.vue'
|
||||
import statusTag from './components/statusTag.vue'
|
||||
// import newBasicData from '@/filters/newBasicData'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
},
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableBtnR = [
|
||||
{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
},
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
}
|
||||
]
|
||||
const tableProps = [
|
||||
// {
|
||||
// prop: 'createTime',
|
||||
// label: i18n.t('module.equipmentManager.inspectionManage.addTime'),
|
||||
// filter: timeFormatter
|
||||
// },
|
||||
{
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.equipmentName')
|
||||
},
|
||||
{
|
||||
prop: 'inspectionStartTime',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.startTime'),
|
||||
filter: timeFormatter,
|
||||
width: 160
|
||||
},
|
||||
{
|
||||
prop: 'inspectionEndTime',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.endTime'),
|
||||
filter: timeFormatter,
|
||||
width: 160
|
||||
},
|
||||
// {
|
||||
// prop: 'source',
|
||||
// label: i18n.t('module.equipmentManager.inspectionManage.source'),
|
||||
// filter: newBasicData('1523941494259912706')
|
||||
// },
|
||||
{
|
||||
prop: 'inspectionWorker',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionWorker'),
|
||||
width: 150
|
||||
}
|
||||
]
|
||||
const tablePropsR = [
|
||||
{
|
||||
prop: 'inspectionItem',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionItem')
|
||||
},
|
||||
{
|
||||
prop: 'inspectionContent',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContent')
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.completion'),
|
||||
subcomponent: StatusBtn,
|
||||
emitFullData: true
|
||||
},
|
||||
{
|
||||
prop: 'type',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.type'),
|
||||
subcomponent: statusTag,
|
||||
width: 100
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'InspectionRecord',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, topTitle, einspectionitemAdd, einspectionitemlogAdd },
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
trueWidth: 110,
|
||||
trueWidthR: 80,
|
||||
tableH: tableHeight(280),
|
||||
highIndex: true,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: false,
|
||||
tableProps,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
equipmentId: '',
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.inspectionManage.equipmentName'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentId',
|
||||
width: 200,
|
||||
filterable: true
|
||||
},
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: this.$t('module.basicData.knowledge.time'),
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd',
|
||||
valueFormat: 'yyyy-MM-dd',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.basicData.knowledge.startTime'),
|
||||
endPlaceholder: this.$t('module.basicData.knowledge.endTime'),
|
||||
param: 'searchTime'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {},
|
||||
equipmentInspectionId: '',
|
||||
tableHR: tableHeight(280),
|
||||
tablePropsR,
|
||||
listR: [],
|
||||
tableBtnR,
|
||||
|
||||
addOrUpdateVisible: false,
|
||||
addOrUpdateVisibleR: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
this.tableR = tableHeight(280)
|
||||
})
|
||||
this.getEquipmentList()
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// 获取设备list
|
||||
getEquipmentList() {
|
||||
equipmentList({
|
||||
current: 1,
|
||||
size: 999
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.headFormConfig[0].selectOptions = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(
|
||||
`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.equipmentName}]?`,
|
||||
this.$t('module.basicData.visual.Tips'),
|
||||
{
|
||||
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
type: 'warning'
|
||||
}
|
||||
).then(() => {
|
||||
einspectionLogD({
|
||||
id: raw.data.id
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
}).catch(() => { })
|
||||
} else if (raw.type === 'detail') {
|
||||
this.addNew(raw.data.id, 'detail')
|
||||
} else if (raw.type === 'edit') {
|
||||
this.addNew(raw.data.id, 'edit')
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] + 'T00:00:00' : ''
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] + 'T23:59:59' : ''
|
||||
inspectionLog(this.listQuery).then(res => {
|
||||
if (res.data.records) {
|
||||
this.list = res.data.records
|
||||
this.equipmentInspectionId = this.list[0].id
|
||||
this.getInspectionItem()
|
||||
} else {
|
||||
this.list = []
|
||||
this.listR.splice(0, this.listR.length)
|
||||
}
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
getInspectionItem() {
|
||||
if (this.equipmentInspectionId) {
|
||||
this.listR.splice(0, this.listR.length)
|
||||
einspectionItList({
|
||||
equipmentInspectionId: this.equipmentInspectionId
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.listR = res.data
|
||||
} else {
|
||||
this.listR.splice(0, this.listR.length)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
selectRow(val) { // 点击左侧列表
|
||||
this.equipmentInspectionId = val.id
|
||||
this.getInspectionItem()
|
||||
},
|
||||
// 新增
|
||||
addNew(id, name) {
|
||||
this.addOrUpdateVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init(id, name)
|
||||
})
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.addNew() // 新增
|
||||
}
|
||||
},
|
||||
// 右侧切换启停状态
|
||||
updateStatus(val) {
|
||||
einspectionItemLogU({
|
||||
id: val.data.id,
|
||||
status: val.data.status
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getInspectionItem()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
handleClickR(raw) {
|
||||
if ((raw.type === 'detail') || (raw.type === 'edit')) {
|
||||
this.addOrUpdateVisibleR = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdateR.init(raw.data.id, raw.type)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.app-container {
|
||||
padding-top: 0;
|
||||
.left-container {
|
||||
display: inline-block;
|
||||
// width: 500px;
|
||||
width: 50%;
|
||||
border-right: 8px solid #f2f4f9;
|
||||
height: 100%;
|
||||
padding-top: 16px;
|
||||
}
|
||||
.right-container {
|
||||
display: inline-block;
|
||||
// width: calc(100% - 510px);
|
||||
width: 49%;
|
||||
vertical-align: top;
|
||||
height: 100%;
|
||||
padding-top: 23px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div>功能待开发</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'InspectionRecordPad',
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,336 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- left -->
|
||||
<div class="left-container">
|
||||
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
:high-index="highIndex"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
@selectRow="selectRow"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:method-list="tableBtn"
|
||||
:width="trueWidth"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList()"
|
||||
/>
|
||||
</div>
|
||||
<!-- right -->
|
||||
<div class="right-container">
|
||||
<top-title :base-title="this.$t('module.equipmentManager.inspectionManage.inspectionItem')" style="font-size: 14px; padding-bottom: 14px;" />
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfigR"
|
||||
:page="1"
|
||||
:limit="999"
|
||||
:height="tableHR"
|
||||
:table-config="tablePropsR"
|
||||
:table-data="listR"
|
||||
:is-loading="listLoading"
|
||||
@clickTopBtn="clickTopBtnR"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:method-list="tableBtnR"
|
||||
:width="trueWidth"
|
||||
@clickBtn="handleClickR"
|
||||
/>
|
||||
</base-table>
|
||||
</div>
|
||||
<inspectioneq-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
|
||||
<inspectionitems-add v-if="addOrUpdateVisibleR" ref="addOrUpdateR" @refreshDataList="getInspectionItem" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
import i18n from '@/lang'
|
||||
import topTitle from '@/components/TopTitle'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import { tableHeight } from '@/utils/index'
|
||||
import { equipmentList, equipmentPage, equipmentDel, eInspectionItem, einspectionItDel } from '@/api/equipment/inspectionManager'
|
||||
import inspectioneqAdd from './components/inspectioneqAdd.vue'
|
||||
import inspectionitemsAdd from './components/inspectionitemsAdd.vue'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const topBtnConfigR = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableBtnR = [
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'name',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.equipmentName')
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.equipmentCode')
|
||||
}
|
||||
]
|
||||
const tablePropsR = [
|
||||
{
|
||||
prop: 'inspectionItem',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionItem')
|
||||
},
|
||||
{
|
||||
prop: 'inspectionContent',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContent')
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContentCode')
|
||||
}
|
||||
]
|
||||
export default {
|
||||
name: 'InspectionSetting',
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, topTitle, inspectioneqAdd, inspectionitemsAdd },
|
||||
data() {
|
||||
return {
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
trueWidth: 80,
|
||||
tableH: tableHeight(280),
|
||||
highIndex: true,
|
||||
list: [],
|
||||
total: 0,
|
||||
listLoading: false,
|
||||
tableProps,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.inspectionManage.equipmentName'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentId',
|
||||
width: 200,
|
||||
filterable: true
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
],
|
||||
headFormValue: {},
|
||||
equipmentId: '',
|
||||
topBtnConfigR,
|
||||
tableHR: tableHeight(280),
|
||||
tablePropsR,
|
||||
listR: [],
|
||||
tableBtnR,
|
||||
|
||||
addOrUpdateVisible: false,
|
||||
addOrUpdateVisibleR: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
this.tableR = tableHeight(280)
|
||||
})
|
||||
this.getEquipmentList()
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
// 获取设备list
|
||||
getEquipmentList() {
|
||||
equipmentList({
|
||||
current: 1,
|
||||
size: 999
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.headFormConfig[0].selectOptions = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(
|
||||
`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.name}]?`,
|
||||
this.$t('module.basicData.visual.Tips'),
|
||||
{
|
||||
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
type: 'warning'
|
||||
}
|
||||
).then(() => {
|
||||
equipmentDel({
|
||||
id: raw.data.id
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch(() => { })
|
||||
}
|
||||
},
|
||||
handleClickR(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(
|
||||
`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.inspectionItem}]?`,
|
||||
this.$t('module.basicData.visual.Tips'),
|
||||
{
|
||||
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
type: 'warning'
|
||||
}
|
||||
).then(() => {
|
||||
einspectionItDel({
|
||||
id: raw.data.id
|
||||
}).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getInspectionItem()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch(() => { })
|
||||
}
|
||||
},
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
equipmentPage(this.listQuery).then(res => {
|
||||
if (res.data.records) {
|
||||
this.list = res.data.records
|
||||
this.equipmentId = this.list[0].id
|
||||
this.getInspectionItem()
|
||||
} else {
|
||||
this.list = []
|
||||
this.listR.splice(0, this.listR.length)
|
||||
}
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
getInspectionItem() {
|
||||
if (this.equipmentId) {
|
||||
eInspectionItem({
|
||||
equipmentId: this.equipmentId
|
||||
}).then(res => {
|
||||
if (res.data) {
|
||||
this.listR = res.data
|
||||
} else {
|
||||
this.listR.splice(0, this.listR.length)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
selectRow(val) { // 点击左侧列表
|
||||
this.equipmentId = val.id
|
||||
this.getInspectionItem()
|
||||
},
|
||||
// 新增
|
||||
addNew() {
|
||||
this.addOrUpdateVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init()
|
||||
})
|
||||
},
|
||||
addNewR(id) {
|
||||
this.addOrUpdateVisibleR = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdateR.init(id)
|
||||
})
|
||||
},
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.listQuery.current = 1
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
this.addNew() // 新增
|
||||
}
|
||||
},
|
||||
clickTopBtnR(val) {
|
||||
if (val === 'add') {
|
||||
if (this.equipmentId) {
|
||||
this.addNewR(this.equipmentId) // 新增
|
||||
} else {
|
||||
this.$message({
|
||||
message: this.$t('module.equipmentManager.inspectionManage.selEquitment'),
|
||||
type: 'warning',
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.app-container {
|
||||
padding-top: 0;
|
||||
padding-right: 0;
|
||||
.left-container {
|
||||
display: inline-block;
|
||||
// width: 500px;
|
||||
width: 50%;
|
||||
border-right: 8px solid #f2f4f9;
|
||||
height: 100%;
|
||||
padding-top: 16px;
|
||||
}
|
||||
.right-container {
|
||||
display: inline-block;
|
||||
// width: calc(100% - 510px);
|
||||
width: 49%;
|
||||
vertical-align: top;
|
||||
height: 100%;
|
||||
padding-top: 23px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
197
src/views/EquipmentManager/mockData.js
Normal file
197
src/views/EquipmentManager/mockData.js
Normal file
@@ -0,0 +1,197 @@
|
||||
/** 设备异常上报数据 **/
|
||||
const PriorityComponent = {
|
||||
name: 'PriorityComponent',
|
||||
props: {
|
||||
injectData: Object
|
||||
},
|
||||
computed: {
|
||||
bgColor() {
|
||||
const colors = [
|
||||
'#9c4048',
|
||||
'#ffbd43',
|
||||
'#0b58ff',
|
||||
'#90dd48',
|
||||
'#449028',
|
||||
'#091238'
|
||||
]
|
||||
return colors[this.injectData.priority - 1]
|
||||
},
|
||||
priorityText() {
|
||||
return [
|
||||
'一级',
|
||||
'二级',
|
||||
'三级',
|
||||
'四级',
|
||||
'五级'
|
||||
][this.injectData.priority - 1]
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
render: function(h) {
|
||||
return h('span', { style: { display: 'inline-block', borderRadius: '2px', padding: '2px 8px', color: '#fff', opacity: '0.6', backgroundColor: this.bgColor }}, this.priorityText)
|
||||
}
|
||||
}
|
||||
|
||||
export const equipmentExceptionProps = [
|
||||
{ label: '设备名称', prop: 'eqName' },
|
||||
{ label: '所属产线', prop: 'pl' },
|
||||
{ label: '报修/异常内容', prop: 'content' },
|
||||
{ label: '报修/发现人', prop: 'creator' },
|
||||
{ label: '时间', prop: 'time' },
|
||||
{ label: '优先级', prop: 'priority', align: 'center', subcomponent: PriorityComponent }
|
||||
]
|
||||
|
||||
export const equipmentExceptionDatalist = [
|
||||
{ 'eqName': 'A1一次固化机', 'pl': 'E线', 'content': '开化是专品直', 'creator': '郭娜', 'time': '1997-06-08 06:14:37', 'priority': 1 },
|
||||
{ 'eqName': 'B1一次冷却机', 'pl': 'B线', 'content': '书记因地观同展土军信', 'creator': '薛洋', 'time': '2006-03-15 10:39:30', 'priority': 2 },
|
||||
{ 'eqName': 'A1预热机', 'pl': 'D线', 'content': '说资把话', 'creator': '曾刚', 'time': '1985-01-29 23:21:53', 'priority': 3 },
|
||||
{ 'eqName': 'A钢化炉', 'content': '即压连识打', 'creator': '张杰', 'time': '1975-05-12 18:54:07', 'priority': 5 },
|
||||
{ 'eqName': 'A2一次固化机', 'pl': 'C线', 'content': '向江比把设', 'creator': '夏敏', 'time': '1996-12-22 09:29:57', 'priority': 3 },
|
||||
{ 'eqName': 'A2一次固化机', 'content': '统山数里们步在', 'creator': '龙洋', 'time': '1989-07-19 05:01:55', 'priority': 3 },
|
||||
{ 'eqName': 'A钢化炉', 'content': '快制放产口快', 'creator': '金艳', 'time': '1987-02-25 18:45:17', 'priority': 4 },
|
||||
{ 'eqName': 'A1一次固化机', 'content': '住指时化统高线', 'creator': '顾敏', 'time': '1982-05-09 15:28:29', 'priority': 5 },
|
||||
{ 'eqName': 'B1二次镀膜机', 'pl': 'B线', 'content': '命些种保较会', 'creator': '罗秀英', 'time': '1986-04-02 07:40:03', 'priority': 2 },
|
||||
{ 'pl': 'B线', 'content': '增元少号安场明去在亲', 'creator': '于丽', 'time': '2004-08-11 11:10:57', 'priority': 4 }]
|
||||
|
||||
/** 设备异常报警 */
|
||||
const LifeRemainComponent = {
|
||||
name: 'LifeRemainComponent',
|
||||
props: {
|
||||
injectData: Object
|
||||
},
|
||||
computed: {
|
||||
statusColor() {
|
||||
const colors = [
|
||||
'rgba(255,84,76,0.6)', // red < 0
|
||||
'#FFBD43', // yellow < 10
|
||||
'rgba(142,254,83,0.6)' // green >= 10
|
||||
]
|
||||
return this.injectData.remain < 0 ? colors[0] : this.injectData.remain < 10 ? colors[1] : colors[2]
|
||||
}
|
||||
|
||||
},
|
||||
render: function(h) {
|
||||
return h('span', {
|
||||
style:
|
||||
{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', opacity: '0.8', backgroundColor: this.statusColor, color: '#fff' }
|
||||
},
|
||||
this.injectData.remain)
|
||||
}
|
||||
}
|
||||
|
||||
export const equipmentAlarmProps = [
|
||||
{ label: '设备名称', prop: 'eqName' },
|
||||
{ label: '设备编码', prop: 'eqCode' },
|
||||
{ label: '所属产线', prop: 'pl' },
|
||||
{ label: '报警级别', prop: 'priority', align: 'center', subcomponent: PriorityComponent },
|
||||
{ label: '报警内容', prop: 'content' }
|
||||
]
|
||||
|
||||
export const equipmentAlarmDatalist = [
|
||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB501464', 'pl': 'C线', 'content': '使决方不相动', 'priority': 3 },
|
||||
{ 'eqName': 'A1一次固化机', 'eqCode': 'SB373383', 'pl': 'C线', 'content': '规问示况将料组美联', 'priority': 5 },
|
||||
{ 'eqName': 'B1二次镀膜机', 'eqCode': 'SB788842', 'pl': 'D线', 'content': '了进改京人表无当市手', 'priority': 2 },
|
||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB743966', 'pl': 'D线', 'content': '经府极元算进', 'priority': 5 },
|
||||
{ 'eqName': 'B1一次冷却机', 'eqCode': 'SB138810', 'pl': 'E线', 'content': '代利值才之', 'priority': 1 },
|
||||
{ 'eqName': 'A2一次冷却机', 'eqCode': 'SB861428', 'pl': 'D线', 'content': '还总速活直', 'priority': 5 },
|
||||
{
|
||||
'eqName': 'B1一次冷却机', 'eqCode': 'SB88566', 'content': '么中相育成他', 'priority': 5
|
||||
},
|
||||
{ 'eqName': 'A2一次固化机', 'eqCode': 'SB955674', 'pl': 'E线', 'content': '并来水报克见克代', 'priority': 5 },
|
||||
{ 'eqName': 'A1预热机', 'eqCode': 'SB415026', 'pl': 'C线', 'content': '元动增断量争', 'priority': 5 },
|
||||
{ 'eqName': 'A钢化炉', 'eqCode': 'SB19064', 'pl': 'D线', 'content': '很这置合它里革民', 'priority': 4 }
|
||||
]
|
||||
|
||||
/** 设备分析 */
|
||||
// 各产线稼动率
|
||||
export const OEE_PER_LINE = {
|
||||
A: 275,
|
||||
B: 210,
|
||||
C: 225,
|
||||
D: 150,
|
||||
E: 125
|
||||
}
|
||||
|
||||
export const equipmentAnalysisData = [
|
||||
{ 'name': '冷端下片单元', 'oee': '0.14', 'mtbr': '0.60', 'mtbf': '0.32' },
|
||||
{ 'name': '磨边单元', 'oee': '0.51', 'mtbr': '0.85', 'mtbf': '0.22' },
|
||||
{ 'name': '丝印', 'oee': '0.75', 'mtbr': '0.92', 'mtbf': '0.93' },
|
||||
{ 'name': '上片机器人', 'oee': '0.89', 'mtbr': '0.25', 'mtbf': '0.26' },
|
||||
{ 'name': '激光打印', 'oee': '0.05', 'mtbr': '0.59', 'mtbf': '0.15' },
|
||||
{ 'name': '镀膜', 'oee': '0.55', 'mtbr': '0.85', 'mtbf': '0.65' }
|
||||
]
|
||||
|
||||
export const sparepartsProps = [
|
||||
{ prop: 'name', label: '部件名称' },
|
||||
{ prop: 'eq', label: '所属设备' },
|
||||
{ prop: 'pl', label: '所属产线' },
|
||||
{ prop: 'update_time', label: '更换时间' },
|
||||
{ prop: 'remain', label: '剩余寿命', subcomponent: LifeRemainComponent },
|
||||
{ prop: 'stock', label: '备件库存量' },
|
||||
{ prop: 'location', label: '库位' }
|
||||
]
|
||||
|
||||
export const sparepartsDatalist = [
|
||||
{ 'name': '激光打印', 'eq': 'A2一次固化机', 'pl': 'C线', 'update_time': '2007-08-31 09:15:24', 'remain': -32, 'stock': 457, 'location': '库位74' },
|
||||
{ 'name': '磨边单元', 'eq': 'B1一次冷却机', 'pl': 'C线', 'update_time': '2016-10-02 22:23:09', 'remain': -95, 'stock': 5600, 'location': '库位10' },
|
||||
{ 'name': '激光打印', 'eq': 'B1一次冷却机', 'pl': 'C线', 'update_time': '1996-09-17 08:57:52', 'remain': 46, 'stock': 6069, 'location': '库位87' },
|
||||
{ 'name': '磨边单元', 'eq': 'A2一次固化机', 'pl': 'D线', 'update_time': '2018-07-18 13:15:01', 'remain': 86, 'stock': 2342, 'location': '库位83' },
|
||||
{ 'name': '上片机器人', 'eq': 'A2一次固化机', 'pl': 'E线', 'update_time': '1998-06-11 09:01:10', 'remain': 84, 'stock': 4359, 'location': '库位12' },
|
||||
{ 'name': '丝印', 'eq': 'A1一次固化机', 'pl': 'E线', 'update_time': '2016-02-13 16:20:01', 'remain': -23, 'stock': 888, 'location': '库位69' },
|
||||
{ 'name': '激光打印', 'eq': 'A1磨边清洗机', 'pl': 'B线', 'update_time': '2002-04-07 19:13:29', 'remain': 62, 'stock': 4366, 'location': '库位99' },
|
||||
{ 'name': '丝印', 'eq': 'A1一次固化机', 'update_time': '1980-01-17 04:29:56', 'remain': 73, 'stock': 305, 'location': '库位68' },
|
||||
{ 'name': '激光打印', 'eq': 'A2一次冷却机', 'pl': 'B线', 'update_time': '2014-02-25 17:19:43', 'remain': 36, 'stock': 199, 'location': '库位86' },
|
||||
{ 'name': '上片机器人', 'eq': 'A2一次冷却机', 'pl': 'C线', 'update_time': '2017-01-23 17:01:29', 'remain': -3, 'stock': 146, 'location': '库位79' },
|
||||
{ 'name': '镀膜', 'eq': 'A2一次固化机', 'pl': 'D线', 'update_time': '2013-02-19 01:29:19', 'remain': 37, 'stock': 6977, 'location': '库位85' },
|
||||
{ 'name': '激光打印', 'eq': 'A1预热机', 'pl': 'B线', 'update_time': '1972-04-26 06:54:43', 'remain': -82, 'stock': 5039, 'location': '库位38' }
|
||||
]
|
||||
|
||||
const StatusComponent = {
|
||||
name: 'StatusComponent',
|
||||
props: {
|
||||
injectData: Object
|
||||
},
|
||||
computed: {
|
||||
statusColor() {
|
||||
const colors = [
|
||||
'#67ff55',
|
||||
'green',
|
||||
'#ffb70c',
|
||||
'#0b58ff',
|
||||
'#ff0c0c'
|
||||
]
|
||||
return colors[this.injectData.status - 1]
|
||||
},
|
||||
statusText() {
|
||||
return [
|
||||
'已完成',
|
||||
'已下发',
|
||||
'已暂定',
|
||||
'进行中',
|
||||
'已结束'
|
||||
][this.injectData.status - 1]
|
||||
}
|
||||
},
|
||||
render: function(h) {
|
||||
return h('span', { style: { display: 'flex', justifyContent: 'center', alignItems: 'center', color: '#fff' }}, [
|
||||
h('span', { style: { width: '6px', height: '6px', borderRadius: '50%', backgroundColor: this.statusColor, boxShadow: '0 0 2px 2px ' + this.statusColor, marginRight: '8px' }}, ''),
|
||||
h('span', this.statusText)
|
||||
])
|
||||
}
|
||||
}
|
||||
|
||||
export const rightSideProps = [
|
||||
{ prop: 'orderId', label: '工单编号' },
|
||||
{ prop: 'pl', label: '产线名称' },
|
||||
{ prop: 'eq', label: '设备名称' },
|
||||
{ prop: 'status', label: '完成情况', subcomponent: StatusComponent },
|
||||
{ prop: 'charger', label: '执行人' },
|
||||
{ prop: 'duration', label: '时长' }
|
||||
]
|
||||
|
||||
export const rightSideDatalist = [
|
||||
{ 'orderId': 'OD_3719', 'eq': 'A2一次固化机', 'pl': 'E线', 'status': 2, 'charger': '任洋', 'duration': 5 },
|
||||
{ 'orderId': 'OD_6564', 'eq': 'B1二次镀膜机', 'pl': 'D线', 'status': 2, 'charger': '廖丽', 'duration': 6 },
|
||||
{ 'orderId': 'OD_125', 'eq': 'A钢化炉', 'pl': 'E线', 'status': 3, 'charger': '赖秀兰', 'duration': 2 }
|
||||
// { "orderId": "OD_7103", "pl": "C线", "status": 3, "charger": "邱伟", "duration": 7 },
|
||||
]
|
||||
506
src/views/EquipmentManager/sparepart/AddForm.vue
Normal file
506
src/views/EquipmentManager/sparepart/AddForm.vue
Normal file
@@ -0,0 +1,506 @@
|
||||
<template>
|
||||
<!-- <div class="form-container"> -->
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.sparepart.sparepartAdd')" class="dialog" width="45%" v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<!-- <div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div> -->
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="110px">
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.maintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.productionLineId')" prop="productionLineId">
|
||||
<el-select
|
||||
v-model="formData.productionLineId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.productionLineId')"
|
||||
:disabled="valDisabled"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in lineList"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.maintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholderequipmentId')"
|
||||
:disabled="valDisabled"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceOrderNumber')" prop="logMaintenanceOrderNumber">
|
||||
<el-input v-model="formData.logMaintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainNextTime')" prop="nextMaintenanceTime">
|
||||
<el-date-picker
|
||||
v-model="formData.nextMaintenanceTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainNextTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainStartTime')" prop="actualStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainEndTime')" prop="actualEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.createTime')" prop="createTime">
|
||||
<el-date-picker
|
||||
v-model="formData.createTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.createTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="formData.description" :placeholder="$t('module.equipmentManager.sparepart.description')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.source')" prop="source">
|
||||
<el-select
|
||||
v-model="formData.source"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.source')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<!-- <el-option
|
||||
:label="$t('module.equipmentManager.repair.manual')"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
label="PDA"
|
||||
:value="1"
|
||||
/> -->
|
||||
<el-option
|
||||
v-for="item in sourceList"
|
||||
:key="item.dataCode"
|
||||
:label="item.dataName"
|
||||
:value="item.dataCode"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<!-- <el-input v-model="formData.operator" :placeholder="$t('module.equipmentManager.sparepart.operator')" clearable :style="{width: '100%'}" /> -->
|
||||
<el-select
|
||||
v-model="formData.operator"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.operator')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
@input="changeWorker"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.status')" prop="status">
|
||||
<el-input v-model="formData.status" :placeholder="$t('module.equipmentManager.sparepart.status')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainWorkerId')" prop="maintainWorker">
|
||||
<el-select
|
||||
v-model="formData.maintainWorker"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainType')" prop="maintainType">
|
||||
<el-select
|
||||
v-model="formData.maintainType"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainlog.placeholdermaintainType')])"
|
||||
celearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainType"
|
||||
:key="index"
|
||||
:label="item.dataName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceDetail')" prop="maintenanceDes">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDes"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<!-- 附件修改了prop="annex" -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="file">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:data="dataObj"
|
||||
name="files"
|
||||
:file-list="fileList"
|
||||
:action="uploadPath"
|
||||
:before-upload="annexBeforeUpload"
|
||||
:on-success="handleSuccess"
|
||||
class="btn"
|
||||
>
|
||||
<el-button class="uploadButton" icon="el-icon-upload2">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.maintainlog.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { uploadPath } from '@/api/basic'
|
||||
import Vue from 'vue'
|
||||
import { addSpare } from '@/api/equipment/spare'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
import { getMaintainPlan } from '@/api/equipment/maintain'
|
||||
// getDictUnit getDictSparepart getDictSupplier
|
||||
import { getDictDevice, getDictWorker } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import { timeIsBefore } from '@/utils'
|
||||
import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
import { lineList } from '@/api/DataAnalysis/productionLineBalance'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
uploadPath,
|
||||
annexfileList: [],
|
||||
fileList: [],
|
||||
dataObj: { typeCode: 'file' },
|
||||
formData: {
|
||||
equipmentId: undefined,
|
||||
actualStartTime: null,
|
||||
createTime: null,
|
||||
description: null,
|
||||
operator: null,
|
||||
source: null,
|
||||
file: null,
|
||||
maintenanceDes: undefined,
|
||||
remark: undefined,
|
||||
status: undefined,
|
||||
productionLineId: undefined
|
||||
},
|
||||
lineList: [],
|
||||
rules: {
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
logMaintenanceOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainType: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainType'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
nextMaintenanceTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainNextTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
actualStartTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualStartTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualEndTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainWorkerId: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintenanceDes: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
status: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderstatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
sourceList: JSON.parse(localStorage.getItem('dictObj'))['1523941494259912706'],
|
||||
dict: {
|
||||
device: [],
|
||||
worker: [],
|
||||
maintainType: []
|
||||
},
|
||||
// 控制添加选项是否disable
|
||||
valDisabled: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// orderId() {
|
||||
// return this.$route.query.orderId
|
||||
// }
|
||||
},
|
||||
watch: {},
|
||||
created() {
|
||||
this.getLineList()
|
||||
},
|
||||
mounted() {
|
||||
// this.formData.maintainPlanId = this.$route.query.orderId
|
||||
this.formData.maintainPlanId = this.targetInfo.orderId
|
||||
this.getInfo()
|
||||
this.getDict()
|
||||
},
|
||||
methods: {
|
||||
onOpen() {},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
this.fileList = []
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
submitForm() {
|
||||
console.log(this.formData)
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.formData.actualStartTime && this.formData.actualEndTime && !timeIsBefore(this.formData.actualStartTime, this.formData.actualEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: i18n.t('module.equipmentManager.maintainplan.sort')
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
// this.formData.maintainWorker = this.formData.maintainWorker.join(',')
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
if (this.formData.operator) {
|
||||
this.formData.operator = this.formData.operator.join(',')
|
||||
} else {
|
||||
this.formData.operator = ''
|
||||
}
|
||||
await addSpare(this.formData).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('module.equipmentManager.bom.succeeded')
|
||||
})
|
||||
// this.$router.go(-1)
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
}).catch(res => {
|
||||
if (res.code !== 0) {
|
||||
this.formData.operator = this.formData.operator.split(',')
|
||||
// console.log(this.formData.maintainWorkerId)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error(i18n.t('module.equipmentManager.sparepart.large'))
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
// console.log(res)
|
||||
this.fileList.push({ name: file.name, id: res.data[0].id })
|
||||
const arr = this.fileList.map(item => {
|
||||
return {
|
||||
name: item.name,
|
||||
id: item.id
|
||||
}
|
||||
})
|
||||
let str = ''
|
||||
arr.forEach((v) => {
|
||||
str += v.name + ':' + v.id + ';'
|
||||
})
|
||||
this.formData.file = str.slice(0, -1)
|
||||
},
|
||||
async getDict() {
|
||||
// const result3 = await getLogCode()
|
||||
// if (result3.code === 0) {
|
||||
// this.formData.logMaintenanceOrderNumber = result3.data
|
||||
// }
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const result2 = await getDictWorker()
|
||||
this.dict.worker = result2
|
||||
const listQuery = {
|
||||
current: 1,
|
||||
size: 500
|
||||
}
|
||||
await dataDictionaryDataList(Object.assign(listQuery, {
|
||||
dictTypeId: '1393401964580093954'
|
||||
})).then(response => {
|
||||
if (response.data.records) {
|
||||
this.dict.maintainType = response.data.records
|
||||
// console.log(this.dict.maintainType)
|
||||
}
|
||||
})
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
async getInfo() {
|
||||
if (this.targetInfo.orderId) {
|
||||
this.valDisabled = true
|
||||
const result = await getMaintainPlan({
|
||||
id: this.targetInfo.orderId,
|
||||
current: 1,
|
||||
size: 10
|
||||
})
|
||||
if (result.code === 0) {
|
||||
// console.log(result)
|
||||
this.formData.equipmentId = result.data[0].equipmentId
|
||||
this.formData.status = result.data[0].status
|
||||
this.formData.maintenanceOrderNumber = result.data[0].maintenanceOrderNumber
|
||||
// console.log(this.formData.equipmentId)
|
||||
}
|
||||
}
|
||||
},
|
||||
// 获取产线列表
|
||||
getLineList() {
|
||||
lineList({ current: 1, size: 999 }).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.lineList = res.data.records
|
||||
Vue.set(this.headFormConfig[0], 'selectOptions', this.lineList)
|
||||
}
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
changeWorker(val) {
|
||||
// console.log(val)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.form-container {
|
||||
padding: 30px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
/* 上传按钮样式 */
|
||||
.uploadButton{
|
||||
width: 106px;
|
||||
height: 32px;
|
||||
background: #FFFFFF;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #D9D9D9;
|
||||
}
|
||||
</style>
|
||||
1076
src/views/EquipmentManager/sparepart/EditForm.vue
Normal file
1076
src/views/EquipmentManager/sparepart/EditForm.vue
Normal file
File diff suppressed because it is too large
Load Diff
413
src/views/EquipmentManager/sparepart/SpareChange.vue
Normal file
413
src/views/EquipmentManager/sparepart/SpareChange.vue
Normal file
@@ -0,0 +1,413 @@
|
||||
<template>
|
||||
<div class="form-container">
|
||||
<div class="method-btn-area">
|
||||
<el-button type="primary" plain icon="el-icon-arrow-left" @click="turnBack">{{ 'btn.back' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
<el-row :gutter="15">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="180px">
|
||||
<el-col :span="24">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.maintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.productionLineId')" prop="productionLineId">
|
||||
<el-select
|
||||
v-model="formData.productionLineId"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.productionLineId')"
|
||||
:disabled="valDisabled"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in lineList"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.maintainplan.maintenanceOrderNumber')" prop="maintenanceOrderNumber">
|
||||
<el-input v-model="formData.maintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" :disabled="valDisabled" :style="{width: '100%'}" />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.equipmentId')" prop="equipmentId">
|
||||
<el-select
|
||||
v-model="formData.equipmentId"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholderequipmentId')"
|
||||
:disabled="valDisabled"
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceOrderNumber')" prop="logMaintenanceOrderNumber">
|
||||
<el-input v-model="formData.logMaintenanceOrderNumber" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainNextTime')" prop="nextMaintenanceTime">
|
||||
<el-date-picker
|
||||
v-model="formData.nextMaintenanceTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainNextTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainStartTime')" prop="actualStartTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualStartTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainEndTime')" prop="actualEndTime">
|
||||
<el-date-picker
|
||||
v-model="formData.actualEndTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainEndTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.repair.createTime')" prop="createTime">
|
||||
<el-date-picker
|
||||
v-model="formData.createTime"
|
||||
type="datetime"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.repair.createTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="formData.description" :placeholder="$t('module.equipmentManager.sparepart.description')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<el-input v-model="formData.operator" :placeholder="$t('module.equipmentManager.sparepart.operator')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.status')" prop="status">
|
||||
<el-input v-model="formData.status" :placeholder="$t('module.equipmentManager.sparepart.status')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainWorkerId')" prop="maintainWorker">
|
||||
<el-select
|
||||
v-model="formData.maintainWorker"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId')"
|
||||
clearable
|
||||
multiple
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.worker"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintainDuration')" prop="maintainDuration">
|
||||
<el-input v-model="formData.maintainDuration" :placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintainDuration')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.status')" prop="status">
|
||||
<el-select
|
||||
v-model="formData.status"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.placeholderstatus')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
label="未完成"
|
||||
:value="0"
|
||||
/>
|
||||
<el-option
|
||||
label="已完成"
|
||||
:value="1"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- <el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.maintainType')" prop="maintainType">
|
||||
<el-select
|
||||
v-model="formData.maintainType"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainlog.placeholdermaintainType')])"
|
||||
celearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.maintainType"
|
||||
:key="index"
|
||||
:label="item.dataName"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<!-- <el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.maintenanceDetail')" prop="maintenanceDes">
|
||||
<el-input
|
||||
v-model="formData.maintenanceDes"
|
||||
type="textarea"
|
||||
:placeholder="$t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail')"
|
||||
:autosize="{minRows: 4, maxRows: 4}"
|
||||
:style="{width: '100%'}"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.annex')" prop="annex">
|
||||
<el-upload
|
||||
ref="annex"
|
||||
:file-list="annexfileList"
|
||||
:action="annexAction"
|
||||
:before-upload="annexBeforeUpload"
|
||||
name="annex"
|
||||
>
|
||||
<el-button size="small" type="primary" icon="el-icon-upload">{{ 'btn.upload' | i18nFilter }}</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainlog.remark')" prop="remark">
|
||||
<el-input v-model="formData.remark" :placeholder="$t('module.equipmentManager.maintainlog.placeholderremark')" clearable :style="{width: '100%'}" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item size="large">
|
||||
<el-button type="primary" @click="submitForm">{{ 'btn.submit' | i18nFilter }}</el-button>
|
||||
<el-button @click="resetForm">{{ 'btn.reset' | i18nFilter }}</el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-form>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Vue from 'vue'
|
||||
import { lineList } from '@/api/DataAnalysis/productionLineBalance'
|
||||
import { editSpare, getSpareInfo } from '@/api/equipment/spare'
|
||||
// import { getMaintainLog } from '@/api/equipment/maintain'
|
||||
import { getDictDevice, getDictWorker } from '@/api/dict'
|
||||
import i18n from '@/lang'
|
||||
import { timeIsBefore } from '@/utils'
|
||||
export default {
|
||||
components: {},
|
||||
props: {
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: () => false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
equipmentId: undefined,
|
||||
// logMaintenanceOrderNumber: undefined,
|
||||
// nextMaintenanceTime: null,
|
||||
actualStartTime: null,
|
||||
// maintainWorker: undefined,
|
||||
// maintainWorkerId: undefined,
|
||||
// actualEndTime: undefined,
|
||||
maintenanceDes: undefined,
|
||||
annex: null,
|
||||
remark: undefined,
|
||||
status: undefined,
|
||||
productionLineId: undefined
|
||||
},
|
||||
lineList: [],
|
||||
rules: {
|
||||
equipmentId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderequipmentId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
logMaintenanceOrderNumber: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceOrderNumber'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainWorkerId: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainWorkerId'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
nextMaintenanceTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintainNextTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualStartTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualStartTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
actualEndTime: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholderactualEndTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
maintainDuration: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholdermaintainDuration'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
maintenanceDes: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainlog.placeholdermaintenanceDetail'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
status: [{
|
||||
required: false,
|
||||
message: i18n.t('module.equipmentManager.maintainplan.placeholderstatus'),
|
||||
trigger: 'blur'
|
||||
}],
|
||||
remark: []
|
||||
},
|
||||
field110Action: 'https://jsonplaceholder.typicode.com/posts/',
|
||||
field110fileList: [],
|
||||
annexAction: 'https://jsonplaceholder.typicode.com/posts/',
|
||||
annexfileList: [],
|
||||
// 控制添加选项是否disable
|
||||
valDisabled: false,
|
||||
dict: {
|
||||
device: [],
|
||||
worker: []
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
orderId() {
|
||||
return this.$route.query.orderId
|
||||
},
|
||||
id() {
|
||||
return this.$route.query.id
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {
|
||||
this.getLineList()
|
||||
},
|
||||
mounted() {
|
||||
this.getDict()
|
||||
this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) return
|
||||
// TODO 提交表单
|
||||
if (this.formData.actualStartTime && this.formData.actualEndTime && !timeIsBefore(this.formData.actualStartTime, this.formData.actualEndTime)) {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '请确保时间前后顺序正确！'
|
||||
})
|
||||
return console.log('拦截')
|
||||
}
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.join(',')
|
||||
await editSpare(this.formData).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '修改成功！'
|
||||
})
|
||||
this.$router.go(-1)
|
||||
}
|
||||
}).catch(res => {
|
||||
if (res.code !== 0) {
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.split(',')
|
||||
console.log(this.formData.maintainWorkerId)
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
resetForm() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
field110BeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 10
|
||||
if (!isRightSize) {
|
||||
this.$message.error('文件大小超过 10MB')
|
||||
}
|
||||
return isRightSize
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getSpareInfo({
|
||||
id: this.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// this.formData.maintainWorkerId = this.formData.maintainWorkerId.split(',')
|
||||
}
|
||||
},
|
||||
// 获取产线列表
|
||||
getLineList() {
|
||||
lineList({ current: 1, size: 999 }).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.lineList = res.data.records
|
||||
Vue.set(this.headFormConfig[0], 'selectOptions', this.lineList)
|
||||
}
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
const result2 = await getDictWorker()
|
||||
this.dict.worker = result2
|
||||
},
|
||||
turnBack() {
|
||||
this.$router.go(-1)
|
||||
},
|
||||
annexBeforeUpload(file) {
|
||||
const isRightSize = file.size / 1024 / 1024 < 2
|
||||
if (!isRightSize) {
|
||||
this.$message.error('文件大小超过 2MB')
|
||||
}
|
||||
return isRightSize
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.form-container {
|
||||
padding: 30px;
|
||||
.method-btn-area {
|
||||
padding: 15px 30px;
|
||||
margin: 10px 0 20px 0;
|
||||
border: 1px solid #dfe6ec;
|
||||
}
|
||||
}
|
||||
.el-upload__tip {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
</style>
|
||||
140
src/views/EquipmentManager/sparepart/components/AddForm.vue
Normal file
140
src/views/EquipmentManager/sparepart/components/AddForm.vue
Normal file
@@ -0,0 +1,140 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.sparepart.addSparepartDetail')" class="dialog" width="45%" append-to-body v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-row :gutter="20">
|
||||
<!-- 安装时间 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.handleTime')" prop="handleTime">
|
||||
<el-date-picker
|
||||
v-model="formData.handleTime"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.handleTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 备品备件 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.sparepart')" prop="sparePartId">
|
||||
<el-select
|
||||
v-model="formData.sparePartId"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.sparepart')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<!-- 说明 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" :loading="waiting" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSpareDict } from '@/api/dict'
|
||||
import { spareDetailAdd } from '@/api/equipment/spare'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
waiting: false,
|
||||
dict: [],
|
||||
formData: {
|
||||
logId: null,
|
||||
handleTime: null,
|
||||
sparePartId: null,
|
||||
now: null,
|
||||
status: null,
|
||||
description: null
|
||||
},
|
||||
rules: {
|
||||
handleTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholderHandleTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
sparePartId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholderSparepartId'),
|
||||
trigger: 'change'
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDetDict()
|
||||
this.formData.logId = this.targetInfo.logId
|
||||
console.log(this.targetInfo)
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
// 备品备件名称和id字典
|
||||
async getDetDict() {
|
||||
const result = await getSpareDict({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict = result
|
||||
},
|
||||
handelConfirm() {
|
||||
this.waiting = true
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
if (!valid) {
|
||||
this.waiting = false
|
||||
return
|
||||
}
|
||||
const result = await spareDetailAdd(this.formData)
|
||||
this.waiting = false
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: this.$t('module.basicData.visual.success')
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
156
src/views/EquipmentManager/sparepart/components/EditForm.vue
Normal file
156
src/views/EquipmentManager/sparepart/components/EditForm.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog v-bind="$attrs" :title="$t('module.equipmentManager.sparepart.editSparepartDetail')" class="dialog" width="45%" append-to-body v-on="$listeners" @open="onOpen" @close="onClose">
|
||||
<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="90px">
|
||||
<el-row :gutter="20">
|
||||
<!-- 安装时间 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.handleTime')" prop="handleTime">
|
||||
<el-date-picker
|
||||
v-model="formData.handleTime"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.handleTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<!-- 备品备件 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.sparepart')" prop="sparePartId">
|
||||
<el-select
|
||||
v-model="formData.sparePartId"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.sparepart')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<!-- 说明 -->
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="formData.description" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer">
|
||||
<el-button @click="close">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="handelConfirm">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSpareDict } from '@/api/dict'
|
||||
import { getSpareDetailById, spareDetailUpdate } from '@/api/equipment/spare'
|
||||
import i18n from '@/lang'
|
||||
export default {
|
||||
components: {},
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
targetInfo: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// waiting: false,
|
||||
dict: [],
|
||||
listQuery: {
|
||||
current: 1, // 固定默认请求第1页
|
||||
size: 3 // 固定默认请求3条数据
|
||||
},
|
||||
formData: {
|
||||
logId: null,
|
||||
handleTime: null,
|
||||
sparePartId: null,
|
||||
now: null,
|
||||
status: null,
|
||||
description: null
|
||||
},
|
||||
rules: {
|
||||
handleTime: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholderHandleTime'),
|
||||
trigger: 'change'
|
||||
}],
|
||||
sparePartId: [{
|
||||
required: true,
|
||||
message: i18n.t('module.equipmentManager.sparepart.placeholderSparepartId'),
|
||||
trigger: 'change'
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {
|
||||
onOpen() {
|
||||
this.getDetDict()
|
||||
this.formData.logId = this.targetInfo.logId
|
||||
this.getInfo()
|
||||
console.log(this.targetInfo)
|
||||
},
|
||||
onClose() {
|
||||
this.$refs['elForm'].resetFields()
|
||||
},
|
||||
close() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
// 备品备件名称和id字典
|
||||
async getDetDict() {
|
||||
const result = await getSpareDict({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict = result
|
||||
},
|
||||
handelConfirm() {
|
||||
// this.waiting = true
|
||||
this.$refs['elForm'].validate(async valid => {
|
||||
// if (!valid) {
|
||||
// this.waiting = false
|
||||
// return
|
||||
// }
|
||||
this.formData.logId = this.targetInfo.logId
|
||||
const result = await spareDetailUpdate(this.formData)
|
||||
// this.waiting = false
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: this.$t('module.basicData.visual.success')
|
||||
})
|
||||
this.$emit('done')
|
||||
this.close()
|
||||
}
|
||||
})
|
||||
},
|
||||
async getInfo() {
|
||||
const result = await getSpareDetailById({
|
||||
id: this.targetInfo.id
|
||||
})
|
||||
console.log(result)
|
||||
if (result.code === 0) {
|
||||
this.formData = result.data
|
||||
// console.log(result.data)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style>
|
||||
</style>
|
||||
47
src/views/EquipmentManager/sparepart/components/Status.vue
Normal file
47
src/views/EquipmentManager/sparepart/components/Status.vue
Normal file
@@ -0,0 +1,47 @@
|
||||
<!--
|
||||
* @Author: gtz
|
||||
* @Date: 2022-04-08 11:08:46
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-07-14 16:33:51
|
||||
* @Description: file content
|
||||
* @FilePath: \mt-bus-fe\src\views\FactoryManage\components\Alarm-status.vue
|
||||
-->
|
||||
|
||||
<template>
|
||||
<el-tag v-if="injectData.status" size="mini" :type="injectData.status ? statusTypeList[injectData.status] : ''">
|
||||
{{ injectData.status ? statusList[injectData.status] : '' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusList: {
|
||||
0: this.$t('module.equipmentManager.sparepart.overdue'),
|
||||
1: this.$t('module.equipmentManager.sparepart.notOverdue'),
|
||||
2: this.$t('module.equipmentManager.sparepart.health'),
|
||||
9: this.$t('module.equipmentManager.sparepart.replaced')
|
||||
},
|
||||
statusTypeList: {
|
||||
0: 'danger',
|
||||
1: 'info',
|
||||
2: 'success',
|
||||
9: 'info'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
673
src/views/EquipmentManager/sparepart/components/changeRecord.vue
Normal file
673
src/views/EquipmentManager/sparepart/components/changeRecord.vue
Normal file
@@ -0,0 +1,673 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 16:37:56
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-07-12 16:19:12
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<!-- <el-dialog :visible.sync="visible" @closed="handleClosed" class="custom-dialog"> -->
|
||||
<el-drawer :visible.sync="visible" :show-close="false" :wrapper-closable="false" class="drawer" size="60%">
|
||||
<span slot="title">
|
||||
<small-title>
|
||||
<!-- {{ readonly ? 'btn.detail' : !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }} -->
|
||||
查看详情
|
||||
</small-title>
|
||||
</span>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<div class="content">
|
||||
<div class="visual-part">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-position="top"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<!-- 产线名 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
:label="$t('module.equipmentManager.maintainplan.productionLineId')"
|
||||
prop="productionLineName"
|
||||
>
|
||||
<el-input
|
||||
v-model="dataForm.productionLineName"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainplan.productionLineId')])"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 设备名 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.placeholderequipmentId')" prop="equipmentName">
|
||||
<el-input
|
||||
v-model="dataForm.equipmentName"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainplan.placeholderequipmentId')])"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 操作换人 -->
|
||||
<!-- <el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<el-select
|
||||
v-model="dataForm.operator"
|
||||
filterable
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.sparepart.operator')])"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option v-for="item in cacheArr" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<el-input
|
||||
v-model="dataForm.operator"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.sparepart.operator')])"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<!-- <template v-if="dataForm.id">
|
||||
<el-row>
|
||||
<div>
|
||||
<el-form
|
||||
ref="detailForm"
|
||||
style="padding: 24px 0; text-align: center"
|
||||
:model="detailForm"
|
||||
label-width="80px"
|
||||
:rules="detailFormValidationRules"
|
||||
label-position="left"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.handleTime')" prop="handleTime">
|
||||
<el-input v-model="detailForm.handleTime" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.sparepart')" prop="sparePartName">
|
||||
<el-input v-model="detailForm.sparePartName" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.nextTime')" prop="nextTime">
|
||||
<el-input v-model="detailForm.nextTime" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.status')" prop="status">
|
||||
<el-input v-model="detailForm.status" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="detailForm.description" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div style="display: flex; justify-content: flex-end;">
|
||||
<el-button @click="displayCreateStockButton = true">
|
||||
{{ 'btn.cancel' | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button type="primary" @click="stockCreateOrEditController">
|
||||
{{ 'btn.confirm' | i18nFilter }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</el-row> -->
|
||||
|
||||
<template v-if="dataForm.id">
|
||||
<el-row>
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-data="stocks"
|
||||
:table-config="tableProps"
|
||||
@emitFun="toggleStockEnabled"
|
||||
>
|
||||
<template v-if="!readonly">
|
||||
<method-btn
|
||||
slot="handleBtn"
|
||||
:width="trueWidth"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="stockClickHandler"
|
||||
/>
|
||||
</template>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page-sizes="[3, 5, 10, 20]"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getInfo"
|
||||
/>
|
||||
</el-row>
|
||||
<!-- </template> -->
|
||||
</template>
|
||||
<template v-else>
|
||||
<div
|
||||
style="color: #c0c0c0; display: inline-block; font-size: 32px; padding: 1em; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);"
|
||||
>
|
||||
暂无更换详情信息
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div style="position: absolute; bottom: 24px; right: 24px;">
|
||||
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </el-dialog> -->
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
// detail as areaDetail,
|
||||
update as areaUpdate,
|
||||
add as areaAdd
|
||||
// getCode as areaCode,
|
||||
// getLocations as getLocationsOfArea
|
||||
} from '@/api/basicData/Cache/area'
|
||||
// import {
|
||||
// list as cacheList,
|
||||
// detail as cacheDetail,
|
||||
// getCode as cacheCode,
|
||||
// getLocations as getLocationsOfCache
|
||||
// } from '@/api/basicData/Cache/cache'
|
||||
// import {
|
||||
// getCode as locationCode,
|
||||
// add as locationAdd,
|
||||
// toggleLocationStatus as locationToggleEnabled,
|
||||
// del as locationDelete,
|
||||
// update as locationUpdate
|
||||
// } from '@/api/basicData/Cache/location'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
import { timeFormatter } from '@/filters'
|
||||
import SmallTitle from '@/components/BaseDrawer/components/SmallTitle.vue'
|
||||
import { getSpareInfo, getSpareDetail } from '@/api/equipment/spare'
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
|
||||
// 区域页面库位详情表格配置
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'handleTime',
|
||||
label: i18n.t('module.equipmentManager.sparepart.handleTime'),
|
||||
filter: timeFormatter,
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
prop: 'sparePartName',
|
||||
label: i18n.t('module.equipmentManager.sparepart.sparepart')
|
||||
},
|
||||
{
|
||||
prop: 'nextTime',
|
||||
label: i18n.t('module.equipmentManager.sparepart.nextTime'),
|
||||
filter: timeFormatter,
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.sparepart.status')
|
||||
},
|
||||
{
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.sparepart.description')
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BaseTable,
|
||||
MethodBtn,
|
||||
Pagination,
|
||||
SmallTitle
|
||||
},
|
||||
props: {
|
||||
cacheId: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
readonly: false, // 开启不可编辑状态
|
||||
// 库位信息
|
||||
stockEdit: false,
|
||||
detailForm: {
|
||||
areaId: '',
|
||||
code: '',
|
||||
name: '',
|
||||
anotherName: '',
|
||||
id: '',
|
||||
enName: '',
|
||||
remark: '',
|
||||
cacheId: ''
|
||||
},
|
||||
tableProps,
|
||||
displayCreateStockButton: true,
|
||||
total: 0,
|
||||
listQuery: {
|
||||
current: 1, // 固定默认请求第1页
|
||||
size: 3 // 固定默认请求3条数据
|
||||
},
|
||||
logId: null,
|
||||
showStocks: false,
|
||||
listLoading: true,
|
||||
trueWidth: 200,
|
||||
tableBtn,
|
||||
stocks: [],
|
||||
visible: false,
|
||||
isFromAreaPage: false,
|
||||
// 表单数据
|
||||
dataForm: {
|
||||
// 这是一个'区域'和'缓存区'复用的结构
|
||||
id: 0, // 区域id | 缓存区id
|
||||
cacheId: '', // 显式地保存缓存区id
|
||||
name: '', // 区域/缓存区名称
|
||||
code: '', // 区域/缓存区编码
|
||||
areaNumber: '', // 缓存区里的区域数量
|
||||
enabled: 1 // 区域启停状态，默认为1
|
||||
},
|
||||
cacheArr: [],
|
||||
// 表单验证
|
||||
dataRule: {
|
||||
},
|
||||
detailFormValidationRules: {
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasStocks() {
|
||||
return this.stocks?.length > 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 判断当前是库位的编辑，还是库位的新增
|
||||
stockCreateOrEditController() {
|
||||
if (this.stockEdit) {
|
||||
// 编辑
|
||||
this.submitEditdetailForm()
|
||||
} else {
|
||||
// 新增
|
||||
this.submitCreatedetailForm()
|
||||
}
|
||||
},
|
||||
|
||||
// 库位的编辑操作
|
||||
// stockClickHandler(raw) {
|
||||
// if (raw.type === 'delete') {
|
||||
// this.$confirm(
|
||||
// `${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.name}]?`,
|
||||
// this.$t('module.basicData.visual.Tips'),
|
||||
// {
|
||||
// confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
// cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
// type: 'warning'
|
||||
// }
|
||||
// )
|
||||
// .then(() => {
|
||||
// // 删除区域里的一个库位
|
||||
// locationDelete(raw.data.id).then(response => {
|
||||
// this.$message({
|
||||
// message: this.$t('module.basicData.visual.success'),
|
||||
// type: 'success',
|
||||
// duration: 1500,
|
||||
// onClose: () => {
|
||||
// this.getInfo()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// })
|
||||
// .catch(() => {})
|
||||
// } else if (raw.type === 'edit') {
|
||||
// // 调取本页的库位编辑页面相关代码
|
||||
// this.displayEditdetailForm(raw.data)
|
||||
// }
|
||||
// },
|
||||
|
||||
// toggleStockEnabled({ data: vStock }) {
|
||||
// locationToggleEnabled(vStock).then(response => {
|
||||
// this.$message({
|
||||
// message: this.$t('module.basicData.visual.success'),
|
||||
// type: 'success',
|
||||
// duration: 1500,
|
||||
// onClose: () => {
|
||||
// this.getInfo()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
|
||||
// submitEditdetailForm() {
|
||||
// // 库位编辑 表单提交
|
||||
// this.$refs['detailForm'].validate(valid => {
|
||||
// if (valid) {
|
||||
// locationUpdate(this.detailForm).then(response => {
|
||||
// this.$message({
|
||||
// message: this.$t('module.basicData.visual.success'),
|
||||
// type: 'success',
|
||||
// duration: 1500,
|
||||
// onClose: () => {
|
||||
// this.displayCreateStockButton = true
|
||||
// this.getInfo()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
|
||||
// submitCreatedetailForm() {
|
||||
// // 库位新增 表单提交
|
||||
// this.$refs['detailForm'].validate(valid => {
|
||||
// if (valid) {
|
||||
// locationAdd(this.detailForm).then(response => {
|
||||
// this.$message({
|
||||
// message: this.$t('module.basicData.visual.success'),
|
||||
// type: 'success',
|
||||
// duration: 1500,
|
||||
// onClose: () => {
|
||||
// this.displayCreateStockButton = true
|
||||
// this.getInfo()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
|
||||
// displayCreatedetailForm() {
|
||||
// // 展示新增库位表单
|
||||
// this.initdetailForm()
|
||||
// this.stockEdit = false
|
||||
// this.displayCreateStockButton = false
|
||||
// this.$nextTick(() => {
|
||||
// // 清空表单
|
||||
// this.$refs['detailForm'].resetFields()
|
||||
// // 请求并填充库位code
|
||||
// locationCode().then(response => {
|
||||
// this.detailForm.code = response.data
|
||||
// })
|
||||
// // 填充库位的区域ID | 缓存区ID
|
||||
// this.detailForm.areaId = this.dataForm.id || null
|
||||
// })
|
||||
// },
|
||||
|
||||
// displayEditdetailForm(stockData) {
|
||||
// // 点击编辑库位信息时触发
|
||||
// this.stockEdit = true
|
||||
// this.displayCreateStockButton = false
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs['detailForm'].resetFields()
|
||||
// // 填充当前库位的相关数据
|
||||
// this.detailForm.id = stockData.id // 库位id
|
||||
// this.detailForm.code = stockData.code
|
||||
// this.detailForm.name = stockData.name
|
||||
// this.detailForm.anotherName = stockData.anotherName || ''
|
||||
// this.detailForm.remark = stockData.remark || ''
|
||||
// this.detailForm.enName = stockData.enName || ''
|
||||
// this.detailForm.areaId = this.dataForm.id || '' // 库位所属的区域id | 缓存区id
|
||||
// })
|
||||
// },
|
||||
|
||||
// fetchStocks() {
|
||||
// if (this.isFromAreaPage) {
|
||||
// this.fetchStocksInArea()
|
||||
// } else {
|
||||
// this.fetchStocksInCache()
|
||||
// }
|
||||
// },
|
||||
|
||||
getInfo() {
|
||||
// if (this.dataForm.id) {
|
||||
// // 如果是编辑，则通过id获取'区域|缓存区'的详情
|
||||
// getSpareInfo(this.dataForm).then(res => {
|
||||
// this.dataForm = res.data
|
||||
// this.logId = res.data.id
|
||||
// // console.log(res)
|
||||
// })
|
||||
// // 检查区域是否有库位，有则展示
|
||||
// } else {
|
||||
// // 缓存区新增不在这里面完成，所以不需要fetchCode
|
||||
// // 为了保持代码风格的统一，写上也无妨，缓存区调用此组件时压根就不会走到此分支
|
||||
|
||||
// // 如果是新增，就请求一个'区域编码'来填充表单
|
||||
// // fetchCode().then(res => {
|
||||
// // this.dataForm.code = res.data
|
||||
// // })
|
||||
|
||||
// // 新增时，不展示库位信息
|
||||
// this.showStocks = false
|
||||
// }
|
||||
getSpareInfo(this.dataForm).then(res => {
|
||||
this.dataForm = res.data
|
||||
this.logId = res.data.id
|
||||
// console.log(res)
|
||||
getSpareDetail({
|
||||
current: 1,
|
||||
size: 99,
|
||||
logId: this.logId
|
||||
}).then(response => {
|
||||
console.log(response)
|
||||
// 把响应数据放进表格
|
||||
this.stocks = response.data.records || []
|
||||
this.total = response.data.total
|
||||
|
||||
if (this.total > 0) {
|
||||
this.showStocks = true
|
||||
}
|
||||
})
|
||||
})
|
||||
// 获取缓存区库位列表（分页），供'库位详情'时调用
|
||||
},
|
||||
|
||||
// fetchStocksInArea() {
|
||||
// // 获取区域库位列表（分页），供'编辑'时调用
|
||||
// getLocationsOfArea({
|
||||
// areaId: this.dataForm.id,
|
||||
// ...this.listQuery
|
||||
// }).then(response => {
|
||||
// // 把响应数据放进表格
|
||||
// this.stocks = response.data.records || []
|
||||
// this.total = response.data.total
|
||||
|
||||
// if (this.total > 0) {
|
||||
// this.showStocks = true
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
|
||||
initdetailForm() {
|
||||
// 初始化库位表单
|
||||
this.detailForm = {
|
||||
areaId: null,
|
||||
code: '',
|
||||
name: '',
|
||||
anotherName: '',
|
||||
id: '',
|
||||
enName: '',
|
||||
remark: '',
|
||||
cacheId: null
|
||||
}
|
||||
},
|
||||
|
||||
init(id) {
|
||||
// id: 区域的id | 缓存区的id
|
||||
// entry: area | cache
|
||||
this.dataForm.id = id || ''
|
||||
this.stocks.splice(0)
|
||||
this.showStocks = false
|
||||
|
||||
// 判断使用什么 tableProps:
|
||||
// this.tableProps = areaStockTableProps
|
||||
|
||||
// readonly 代表当前是可编辑状态还是只读状态，默认都是可编辑
|
||||
// this.readonly = !!readonly
|
||||
// 如果是 readonly 模式，则需要修改 tableProps
|
||||
// if (readonly) {
|
||||
// this.tableProps.forEach((obj, index) => {
|
||||
// if (obj.prop === 'enabled') {
|
||||
// this.$set(obj, 'readonly', this.readonly)
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
// // 如果不是 readonly，需要显式的删除 tableProps 里 swtichBtn 子组件的 readonly 属性
|
||||
// // 因为 cacheArea-add.vue 这个组件在area页面被复用了2次，不这么做的话，一旦添加readonly
|
||||
// // 之后所有的复用都会携带readonly，造成不希望的后果
|
||||
// this.tableProps.forEach((obj, index) => {
|
||||
// if (obj.prop === 'enabled' && Object.prototype.hasOwnProperty.call(obj, 'readonly')) {
|
||||
// this.$delete(obj, 'readonly')
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
|
||||
// 此文件会被复用，所以需要做通用化处理
|
||||
// if (entry === 'area') {
|
||||
// // 如果是从区域界面进入此组件,则需要获取缓存区列表
|
||||
// // 因为要选择正在编辑的区域属于哪一个缓存区：
|
||||
|
||||
// // 1.获取所有缓存区列表
|
||||
// this.cacheArr.splice(0, this.cacheArr.length)
|
||||
// const params = {
|
||||
// current: 1,
|
||||
// size: 500
|
||||
// }
|
||||
// cacheList(params).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.cacheArr = response.data.records
|
||||
// }
|
||||
// })
|
||||
// this.isFromAreaPage = true
|
||||
// } else if (entry === 'cache') {
|
||||
// this.isFromAreaPage = false
|
||||
// }
|
||||
|
||||
// 选择接口
|
||||
// const fetchDetail = this.isFromAreaPage ? areaDetail : cacheDetail
|
||||
// const fetchCode = this.isFromAreaPage ? areaCode : cacheCode
|
||||
this.getInfo()
|
||||
// 显示弹窗
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].resetFields()
|
||||
// console.log(this.dataForm)
|
||||
})
|
||||
},
|
||||
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
// 如果是从 area 页面来，就提交表单，否则直接关闭即可
|
||||
if (this.isFromAreaPage && !this.readonly) {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
const data = this.dataForm
|
||||
if (this.dataForm.id) {
|
||||
areaUpdate(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
areaAdd(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
// 通过返回的区域id，获取对应的库位列表
|
||||
this.dataForm.id = res.data.id
|
||||
this.getInfo()
|
||||
this.showDetail = true
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.visible = false
|
||||
}
|
||||
},
|
||||
|
||||
// 弹窗关闭
|
||||
handleClosed() {
|
||||
// this.$emit('handleClosed')
|
||||
if (this.dataForm.id) {
|
||||
// 如果是编辑
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.custom-dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer {
|
||||
border-radius: 8px 0 0 8px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-form-item__label {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer__header {
|
||||
padding: 0;
|
||||
margin: 32px 0 8px 32px;
|
||||
}
|
||||
|
||||
.drawer >>> .content {
|
||||
padding: 0 24px 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.drawer >>> .visual-part {
|
||||
flex: 1 auto;
|
||||
max-height: 76vh;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
padding-right: 10px; /* 调整滚动条样式 */
|
||||
}
|
||||
</style>
|
||||
804
src/views/EquipmentManager/sparepart/components/detail.vue
Normal file
804
src/views/EquipmentManager/sparepart/components/detail.vue
Normal file
@@ -0,0 +1,804 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 16:37:56
|
||||
* @LastEditors: fzq
|
||||
* @LastEditTime: 2022-09-14 16:57:17
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<!-- <el-dialog :visible.sync="visible" @closed="handleClosed" class="custom-dialog"> -->
|
||||
<el-drawer :visible.sync="visible" :show-close="false" :wrapper-closable="true" class="drawer" size="60%">
|
||||
<span slot="title">
|
||||
<small-title :no-padding="true">
|
||||
<!-- {{ readonly ? 'btn.detail' : !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }} -->
|
||||
{{ 'btn.replacementDetails' | i18nFilter }}
|
||||
</small-title>
|
||||
</span>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<div class="content">
|
||||
<div class="visual-part">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
label-position="top"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<!-- 产线名 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item
|
||||
:label="$t('module.equipmentManager.maintainplan.productionLineId')"
|
||||
prop="productionLineName"
|
||||
>
|
||||
<!-- :placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainplan.productionLineId')])" -->
|
||||
<el-input
|
||||
v-model="dataForm.productionLineName"
|
||||
:placeholder="$t('module.equipmentManager.maintainplan.productionLineId')"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 设备名 -->
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.maintainplan.placeholderequipmentId')" prop="equipmentName">
|
||||
<el-input
|
||||
v-model="dataForm.equipmentName"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.maintainplan.placeholderequipmentId')])"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- 操作换人 -->
|
||||
<!-- <el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<el-select
|
||||
v-model="dataForm.operator"
|
||||
filterable
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.sparepart.operator')])"
|
||||
clearable
|
||||
:disabled="readonly"
|
||||
>
|
||||
<el-option v-for="item in cacheArr" :key="item.id" :label="item.name" :value="item.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.operator')" prop="operator">
|
||||
<el-input
|
||||
v-model="dataForm.operator"
|
||||
:placeholder="$i18nForm(['placeholder.input', $t('module.equipmentManager.sparepart.operator')])"
|
||||
disabled
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<small-title v-if="false" :size="'sm'">
|
||||
{{ 'btn.detail' | i18nFilter }}
|
||||
</small-title>
|
||||
<div v-if="displayCreateStockButton && false">
|
||||
<button
|
||||
style="cursor: pointer; margin-top: 8px; color: #0b58ff; border:none; outline:none; background: none;"
|
||||
@click.prevent="displayCreateStockForm"
|
||||
>
|
||||
{{ 'btn.add' | i18nFilter }}{{ 'btn.replacementDetails' | i18nFilter }}
|
||||
</button>
|
||||
</div>
|
||||
<!-- <template v-if="dataForm.id"> -->
|
||||
<!-- 这里用v-else则会第一次没数据，第二次才有，不行，因为this.$nextTick和v-else一起会使得数据没法挂载，v-show是挂载但不显示，所以去掉this.$nextTick用v-show再取反 -->
|
||||
<div v-show="!displayCreateStockButton">
|
||||
<el-form
|
||||
ref="detailForm"
|
||||
style="padding: 24px 0; text-align: center"
|
||||
:model="detailForm"
|
||||
label-width="80px"
|
||||
:rules="detailFormValidationRules"
|
||||
label-position="left"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.sparepart.handleTime')" prop="handleTime">
|
||||
<el-input v-model="detailForm.handleTime" clearable />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.handleTime')" prop="handleTime">
|
||||
<el-date-picker
|
||||
v-model="detailForm.handleTime"
|
||||
format="yyyy-MM-dd"
|
||||
:style="{width: '100%'}"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.handleTime')"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<!-- <el-form-item :label="$t('module.equipmentManager.sparepart.sparepart')" prop="sparePartName">
|
||||
<el-input v-model="detailForm.sparePartName" clearable />
|
||||
</el-form-item> -->
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.sparepart')" prop="sparePartName">
|
||||
<el-select
|
||||
v-model="detailForm.sparePartId"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.sparepart')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in dict.device"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.now')" prop="now">
|
||||
<!-- <el-input v-model="detailForm.now" clearable /> -->
|
||||
<el-select
|
||||
v-model="detailForm.now"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.now')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in nowOption"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.status')" prop="status">
|
||||
<!-- <el-input v-model="detailForm.status" clearable /> -->
|
||||
<el-select
|
||||
v-model="detailForm.status"
|
||||
:placeholder="$t('module.equipmentManager.sparepart.status')"
|
||||
clearable
|
||||
:style="{width: '100%'}"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in statusOption"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item :label="$t('module.equipmentManager.sparepart.description')" prop="description">
|
||||
<el-input v-model="detailForm.description" clearable />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<div style="display: flex; justify-content: flex-end;">
|
||||
<el-button @click="displayCreateStockButton = true">
|
||||
{{ 'btn.cancel' | i18nFilter }}
|
||||
</el-button>
|
||||
<el-button type="primary" @click="stockCreateOrEditController">
|
||||
{{ 'btn.confirm' | i18nFilter }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<template v-if="dataForm.id">
|
||||
<el-row>
|
||||
<!-- @emitFun="toggleStockEnabled" -->
|
||||
<base-table
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:table-data="stocks"
|
||||
:table-config="tableProps"
|
||||
>
|
||||
<template v-if="!readonly">
|
||||
<method-btn
|
||||
slot="handleBtn"
|
||||
:width="80"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="clickHandler"
|
||||
/>
|
||||
</template>
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page-sizes="[3, 5, 10, 20]"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getInfo"
|
||||
/>
|
||||
</el-row>
|
||||
<!-- </template> -->
|
||||
</template>
|
||||
<template v-else>
|
||||
<div
|
||||
style="color: #c0c0c0; display: inline-block; font-size: 32px; padding: 1em; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);"
|
||||
>
|
||||
{{ 'btn.noReplacementDetails' | i18nFilter }}
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div style="position: absolute; bottom: 24px; right: 24px;">
|
||||
<!-- <el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button> -->
|
||||
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </el-dialog> -->
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
// detail as areaDetail,
|
||||
update as areaUpdate,
|
||||
add as areaAdd
|
||||
// getCode as areaCode,
|
||||
// getLocations as getLocationsOfArea
|
||||
} from '@/api/basicData/Cache/area'
|
||||
// import {
|
||||
// list as cacheList,
|
||||
// detail as cacheDetail,
|
||||
// getCode as cacheCode,
|
||||
// getLocations as getLocationsOfCache
|
||||
// } from '@/api/basicData/Cache/cache'
|
||||
// import {
|
||||
// getCode as locationCode,
|
||||
// add as locationAdd,
|
||||
// toggleLocationStatus as locationToggleEnabled,
|
||||
// del as locationDelete,
|
||||
// update as locationUpdate
|
||||
// } from '@/api/basicData/Cache/location'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
import { timeFormatter } from '@/filters'
|
||||
import SmallTitle from '@/components/BaseDrawer/components/SmallTitle.vue'
|
||||
import { getSpareInfo, getSpareDetail, spareDetailUpdate, spareDetailAdd, spareDetailDel } from '@/api/equipment/spare'
|
||||
import { getSpareDict } from '@/api/dict'
|
||||
import Status from './Status.vue'
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.change'
|
||||
}
|
||||
// {
|
||||
// type: 'delete',
|
||||
// btnName: 'btn.delete'
|
||||
// }
|
||||
]
|
||||
|
||||
// 区域页面库位详情表格配置
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'handleTime',
|
||||
label: i18n.t('module.equipmentManager.sparepart.handleTime'),
|
||||
filter: timeFormatter,
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
prop: 'sparePartName',
|
||||
label: i18n.t('module.equipmentManager.sparepart.sparepart')
|
||||
},
|
||||
{
|
||||
prop: 'nextTime',
|
||||
label: i18n.t('module.equipmentManager.sparepart.nextTime'),
|
||||
filter: timeFormatter,
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.sparepart.status'),
|
||||
subcomponent: Status
|
||||
},
|
||||
{
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.sparepart.description')
|
||||
}
|
||||
]
|
||||
|
||||
export default {
|
||||
components: {
|
||||
BaseTable,
|
||||
MethodBtn,
|
||||
Pagination,
|
||||
SmallTitle
|
||||
},
|
||||
props: {
|
||||
cacheId: {
|
||||
type: String,
|
||||
default: () => {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
readonly: false, // 开启不可编辑状态
|
||||
// 库位信息
|
||||
stockEdit: false,
|
||||
detailForm: {
|
||||
logId: null,
|
||||
id: null,
|
||||
handleTime: null,
|
||||
nextTime: null,
|
||||
sparePartId: null,
|
||||
sparePartName: null,
|
||||
time: null,
|
||||
now: null,
|
||||
status: null,
|
||||
description: null
|
||||
},
|
||||
tableProps,
|
||||
displayCreateStockButton: true,
|
||||
total: 0,
|
||||
listQuery: {
|
||||
current: 1, // 固定默认请求第1页
|
||||
size: 3 // 固定默认请求3条数据
|
||||
},
|
||||
logId: null,
|
||||
showStocks: false,
|
||||
listLoading: true,
|
||||
// trueWidth: 200,
|
||||
tableBtn,
|
||||
stocks: [],
|
||||
visible: false,
|
||||
isFromAreaPage: false,
|
||||
dict: {
|
||||
device: []
|
||||
},
|
||||
nowOption: [
|
||||
{ value: 0, label: this.$t('module.equipmentManager.sparepart.replaced') },
|
||||
{ value: 1, label: this.$t('module.equipmentManager.sparepart.unreplaced') }
|
||||
],
|
||||
statusOption: [
|
||||
{ value: '0', label: this.$t('module.equipmentManager.sparepart.overdue') },
|
||||
{ value: '1', label: this.$t('module.equipmentManager.sparepart.notOverdue') },
|
||||
{ value: '2', label: this.$t('module.equipmentManager.sparepart.health') },
|
||||
{ value: '9', label: this.$t('module.equipmentManager.sparepart.replaced') }
|
||||
],
|
||||
// 表单数据
|
||||
dataForm: {},
|
||||
cacheArr: [],
|
||||
// 表单验证
|
||||
dataRule: {},
|
||||
detailFormValidationRules: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
hasStocks() {
|
||||
return this.stocks?.length > 0
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.getInfo
|
||||
},
|
||||
methods: {
|
||||
// 判断当前是库位的编辑，还是库位的新增
|
||||
stockCreateOrEditController() {
|
||||
if (this.stockEdit) {
|
||||
// 编辑
|
||||
this.submitEditdetailForm()
|
||||
} else {
|
||||
// 新增
|
||||
this.submitCreatedetailForm()
|
||||
}
|
||||
},
|
||||
|
||||
// 备品备件的编辑操作
|
||||
clickHandler(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
// this.$confirm(
|
||||
// `${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.sparePartName}]?`,
|
||||
// this.$t('module.basicData.visual.Tips'),
|
||||
// {
|
||||
// confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
||||
// cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
||||
// type: 'warning'
|
||||
// }
|
||||
// )
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
// 删除区域里的一个库位
|
||||
spareDetailDel({ id: raw.data.id }).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getInfo()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
} else if (raw.type === 'edit') {
|
||||
// 调取本页的库位编辑页面相关代码
|
||||
// this.displayEditdetailForm(raw.data)
|
||||
console.log(raw)
|
||||
this.$confirm(this.$t('module.equipmentManager.sparepart.confirm'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
this.detailForm.id = raw.data.id
|
||||
this.detailForm.handleTime = raw.data.handleTime
|
||||
this.detailForm.operator = raw.data.operator || ''
|
||||
this.detailForm.sparePartId = raw.data.sparePartId || ''
|
||||
this.detailForm.sparePartName = raw.data.sparePartName || ''
|
||||
this.detailForm.status = raw.data.status || ''
|
||||
this.detailForm.description = raw.data.description || ''
|
||||
this.detailForm.time = raw.data.time || ''
|
||||
this.detailForm.logId = this.logId
|
||||
this.detailForm.now = 0
|
||||
spareDetailUpdate(this.detailForm).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.displayCreateStockButton = true
|
||||
this.getInfo()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// toggleStockEnabled({ data: vStock }) {
|
||||
// locationToggleEnabled(vStock).then(response => {
|
||||
// this.$message({
|
||||
// message: this.$t('module.basicData.visual.success'),
|
||||
// type: 'success',
|
||||
// duration: 1500,
|
||||
// onClose: () => {
|
||||
// this.getInfo()
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
|
||||
submitEditdetailForm() {
|
||||
// 库位编辑 表单提交
|
||||
this.$refs['detailForm'].validate(valid => {
|
||||
if (valid) {
|
||||
this.detailForm.logId = this.logId
|
||||
spareDetailUpdate(this.detailForm).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.displayCreateStockButton = true
|
||||
this.getInfo()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
submitCreatedetailForm() {
|
||||
// 库位新增 表单提交
|
||||
this.$refs['detailForm'].validate(valid => {
|
||||
if (valid) {
|
||||
this.detailForm.logId = this.logId
|
||||
spareDetailAdd(this.detailForm).then(response => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.displayCreateStockButton = true
|
||||
this.getInfo()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// displayCreatedetailForm() {
|
||||
// // 展示新增库位表单
|
||||
// this.initdetailForm()
|
||||
// this.stockEdit = false
|
||||
// this.displayCreateStockButton = false
|
||||
// this.$nextTick(() => {
|
||||
// // 清空表单
|
||||
// this.$refs['detailForm'].resetFields()
|
||||
// // 请求并填充库位code
|
||||
// locationCode().then(response => {
|
||||
// this.detailForm.code = response.data
|
||||
// })
|
||||
// // 填充库位的区域ID | 缓存区ID
|
||||
// this.detailForm.areaId = this.dataForm.id || null
|
||||
// })
|
||||
// },
|
||||
|
||||
displayEditdetailForm(stockData) {
|
||||
// 点击编辑更换详情信息时触发
|
||||
this.stockEdit = true
|
||||
this.displayCreateStockButton = false
|
||||
this.$refs['detailForm'].resetFields()
|
||||
// 填充当前更换详情信息的相关数据
|
||||
// console.log(stockData)
|
||||
this.detailForm.id = stockData.id
|
||||
this.detailForm.handleTime = stockData.handleTime
|
||||
this.detailForm.now = stockData.now
|
||||
this.detailForm.operator = stockData.operator || ''
|
||||
this.detailForm.sparePartId = stockData.sparePartId || ''
|
||||
this.detailForm.sparePartName = stockData.sparePartName || ''
|
||||
this.detailForm.status = stockData.status || ''
|
||||
this.detailForm.time = stockData.time || ''
|
||||
this.detailForm.logId = stockData.logId
|
||||
},
|
||||
|
||||
// fetchStocks() {
|
||||
// if (this.isFromAreaPage) {
|
||||
// this.fetchStocksInArea()
|
||||
// } else {
|
||||
// this.fetchStocksInCache()
|
||||
// }
|
||||
// },
|
||||
// 备品备件名称和id字典
|
||||
async getDict() {
|
||||
const result = await getSpareDict({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
this.dict.device = result
|
||||
},
|
||||
async getInfo() {
|
||||
// 获取logId也就是主记录id
|
||||
const res = await getSpareInfo(this.dataForm)
|
||||
if (res.code === 0) {
|
||||
this.dataForm = res.data
|
||||
this.logId = res.data.id
|
||||
// console.log(res)
|
||||
// 根据主记录id去查详情
|
||||
const response = await getSpareDetail({
|
||||
current: this.listQuery.current,
|
||||
size: this.listQuery.size,
|
||||
logId: this.logId
|
||||
})
|
||||
if (res.code === 0) {
|
||||
console.log(response)
|
||||
this.getDict()
|
||||
// 把响应数据放进表格
|
||||
this.stocks = response.data.records || []
|
||||
this.total = response.data.total
|
||||
if (this.total > 0) {
|
||||
this.showStocks = true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// fetchStocksInArea() {
|
||||
// // 获取区域库位列表（分页），供'编辑'时调用
|
||||
// getLocationsOfArea({
|
||||
// areaId: this.dataForm.id,
|
||||
// ...this.listQuery
|
||||
// }).then(response => {
|
||||
// // 把响应数据放进表格
|
||||
// this.stocks = response.data.records || []
|
||||
// this.total = response.data.total
|
||||
|
||||
// if (this.total > 0) {
|
||||
// this.showStocks = true
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
|
||||
initdetailForm() {
|
||||
// 初始化库位表单
|
||||
this.detailForm = {}
|
||||
},
|
||||
|
||||
init(id) {
|
||||
// id: 区域的id | 缓存区的id
|
||||
// entry: area | cache
|
||||
this.dataForm.id = id || ''
|
||||
this.stocks.splice(0)
|
||||
this.showStocks = false
|
||||
|
||||
// 判断使用什么 tableProps:
|
||||
// this.tableProps = areaStockTableProps
|
||||
|
||||
// readonly 代表当前是可编辑状态还是只读状态，默认都是可编辑
|
||||
// this.readonly = !!readonly
|
||||
// 如果是 readonly 模式，则需要修改 tableProps
|
||||
// if (readonly) {
|
||||
// this.tableProps.forEach((obj, index) => {
|
||||
// if (obj.prop === 'enabled') {
|
||||
// this.$set(obj, 'readonly', this.readonly)
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
// // 如果不是 readonly，需要显式的删除 tableProps 里 swtichBtn 子组件的 readonly 属性
|
||||
// // 因为 cacheArea-add.vue 这个组件在area页面被复用了2次，不这么做的话，一旦添加readonly
|
||||
// // 之后所有的复用都会携带readonly，造成不希望的后果
|
||||
// this.tableProps.forEach((obj, index) => {
|
||||
// if (obj.prop === 'enabled' && Object.prototype.hasOwnProperty.call(obj, 'readonly')) {
|
||||
// this.$delete(obj, 'readonly')
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
|
||||
// 此文件会被复用，所以需要做通用化处理
|
||||
// if (entry === 'area') {
|
||||
// // 如果是从区域界面进入此组件,则需要获取缓存区列表
|
||||
// // 因为要选择正在编辑的区域属于哪一个缓存区：
|
||||
|
||||
// // 1.获取所有缓存区列表
|
||||
// this.cacheArr.splice(0, this.cacheArr.length)
|
||||
// const params = {
|
||||
// current: 1,
|
||||
// size: 500
|
||||
// }
|
||||
// cacheList(params).then(response => {
|
||||
// if (response.data.records) {
|
||||
// this.cacheArr = response.data.records
|
||||
// }
|
||||
// })
|
||||
// this.isFromAreaPage = true
|
||||
// } else if (entry === 'cache') {
|
||||
// this.isFromAreaPage = false
|
||||
// }
|
||||
|
||||
// 选择接口
|
||||
// const fetchDetail = this.isFromAreaPage ? areaDetail : cacheDetail
|
||||
// const fetchCode = this.isFromAreaPage ? areaCode : cacheCode
|
||||
this.getInfo()
|
||||
// 显示弹窗
|
||||
this.visible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].resetFields()
|
||||
// console.log(this.dataForm)
|
||||
})
|
||||
},
|
||||
initStockForm() {
|
||||
// 初始化库位表单
|
||||
this.detailForm = {
|
||||
handleTime: null,
|
||||
sparePartId: null,
|
||||
now: null,
|
||||
status: null,
|
||||
description: null,
|
||||
logId: this.logId
|
||||
}
|
||||
},
|
||||
displayCreateStockForm() {
|
||||
// 展示新增表单
|
||||
this.initStockForm()
|
||||
this.stockEdit = false
|
||||
this.displayCreateStockButton = false
|
||||
this.$nextTick(() => {
|
||||
// 清空表单
|
||||
this.$refs['detailForm'].resetFields()
|
||||
// 请求并填充库位code
|
||||
// locationCode().then(response => {
|
||||
// this.stockForm.code = response.data
|
||||
// })
|
||||
// // 填充库位的区域ID | 缓存区ID
|
||||
// this.stockForm.areaId = this.dataForm.id || null
|
||||
})
|
||||
},
|
||||
|
||||
displayEditStockForm(stockData) {
|
||||
// 点击编辑库位信息时触发
|
||||
this.stockEdit = true
|
||||
this.displayCreateStockButton = false
|
||||
this.$nextTick(() => {
|
||||
this.$refs['detailForm'].resetFields()
|
||||
// 填充当前库位的相关数据
|
||||
// this.stockForm.id = stockData.id // 库位id
|
||||
// this.stockForm.code = stockData.code
|
||||
// this.stockForm.name = stockData.name
|
||||
// this.stockForm.anotherName = stockData.anotherName || ''
|
||||
// this.stockForm.remark = stockData.remark || ''
|
||||
// this.stockForm.enName = stockData.enName || ''
|
||||
// this.stockForm.areaId = this.dataForm.id || '' // 库位所属的区域id | 缓存区id
|
||||
})
|
||||
},
|
||||
// 表单提交
|
||||
dataFormSubmit() {
|
||||
// 如果是从 area 页面来，就提交表单，否则直接关闭即可
|
||||
if (this.isFromAreaPage && !this.readonly) {
|
||||
this.$refs['dataForm'].validate(valid => {
|
||||
if (valid) {
|
||||
const data = this.dataForm
|
||||
if (this.dataForm.id) {
|
||||
areaUpdate(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.visible = false
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
})
|
||||
})
|
||||
} else {
|
||||
areaAdd(data).then(res => {
|
||||
this.$message({
|
||||
message: this.$t('module.basicData.visual.success'),
|
||||
type: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
// 通过返回的区域id，获取对应的库位列表
|
||||
this.dataForm.id = res.data.id
|
||||
this.getInfo()
|
||||
this.showDetail = true
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.visible = false
|
||||
}
|
||||
},
|
||||
|
||||
// 弹窗关闭
|
||||
handleClosed() {
|
||||
// this.$emit('handleClosed')
|
||||
if (this.dataForm.id) {
|
||||
// 如果是编辑
|
||||
this.$emit('refreshDataList')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.custom-dialog >>> .el-dialog__body {
|
||||
padding: 30px 24px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer {
|
||||
border-radius: 8px 0 0 8px;
|
||||
}
|
||||
|
||||
.drawer >>> .el-form-item__label {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.drawer >>> .el-drawer__header {
|
||||
padding: 0;
|
||||
margin: 32px 0 8px 32px;
|
||||
}
|
||||
|
||||
.drawer >>> .content {
|
||||
padding: 0 24px 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.drawer >>> .visual-part {
|
||||
flex: 1 auto;
|
||||
max-height: 76vh;
|
||||
overflow: hidden;
|
||||
overflow-y: scroll;
|
||||
padding-right: 10px; /* 调整滚动条样式 */
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,77 @@
|
||||
<!--
|
||||
* @Author: lb
|
||||
* @Date: 2022-3-8 10:00:00
|
||||
* @LastEditors: lb
|
||||
* @LastEditTime: 2022-3-8 10:00:00
|
||||
* @Description: 启停某个区域的状态
|
||||
-->
|
||||
<template>
|
||||
<el-switch v-model="state" type="text" size="small" :disabled="readonly" @change="changeHandler" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
state: false,
|
||||
payload: {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
readonly() {
|
||||
return !!this.injectData.readonly
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.mapToState()
|
||||
},
|
||||
// watch: {
|
||||
// "injectData.enabled": {
|
||||
// handler: function (val) {
|
||||
// this.state = !!this.injectData.enabled;
|
||||
// },
|
||||
// deep: true,
|
||||
// },
|
||||
// "injectData.currentStatus": {
|
||||
// handler: function (val) {
|
||||
// this.state = !!(this.injectData.currentStatus === 'true');
|
||||
// },
|
||||
// deep: true,
|
||||
// },
|
||||
// },
|
||||
methods: {
|
||||
mapToState() {
|
||||
if (this.injectData.prop === 'currentStatus') {
|
||||
this.state = !!(this.injectData[this.injectData.prop].toString().trim() === 'true')
|
||||
return
|
||||
} else {
|
||||
// enabled
|
||||
this.state = !!this.injectData['enabled']
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
changeHandler() {
|
||||
if (this.injectData.prop === 'enabled') {
|
||||
// 启停区域/缓存区
|
||||
this.payload.id = this.injectData.id
|
||||
this.payload.enabled = this.state ? 1 : 0
|
||||
} else {
|
||||
// 启停其他实体-该else分支后期可能会被删除
|
||||
this.payload.id = this.injectData.id
|
||||
this.payload.code = this.injectData.code
|
||||
this.payload.name = this.injectData.name
|
||||
this.payload.currentStatus = this.state
|
||||
}
|
||||
|
||||
this.$emit('emitData', { action: 'toggleEnabled', data: this.payload })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,32 @@
|
||||
<!--
|
||||
* @Author: lb
|
||||
* @Date: 2022-3-8 10:00:00
|
||||
* @LastEditors: lb
|
||||
* @LastEditTime: 2022-04-13 10:00:00
|
||||
* @Description: 查看详情的更新版本，更新日期2022.4.13
|
||||
-->
|
||||
<template>
|
||||
<span>
|
||||
<el-button type="text" @click="emitClick">{{ injectData.buttonContent }}</el-button>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
injectData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
actionName: {
|
||||
type: String,
|
||||
default: 'view-detail-action'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
emitClick() {
|
||||
this.$emit('emitData', { action: this.actionName, data: { id: this.injectData.id }})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
432
src/views/EquipmentManager/sparepart/index.vue
Normal file
432
src/views/EquipmentManager/sparepart/index.vue
Normal file
@@ -0,0 +1,432 @@
|
||||
<!--
|
||||
/*
|
||||
* @Date: 2022-04-18
|
||||
* @LastEditTime: 2022-08-03 09:53:19
|
||||
* @LastEditors: fzq
|
||||
* @FilePath: \basic-admin\src\views\EquipmentManager\MaintainPlan\index.vue
|
||||
* @Description:
|
||||
*/
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- <top-title /> -->
|
||||
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
||||
<base-table
|
||||
:top-btn-config="topBtnConfig"
|
||||
:table-config="tableProps"
|
||||
:table-data="list"
|
||||
:is-loading="listLoading"
|
||||
:page="listQuery.current"
|
||||
:limit="listQuery.size"
|
||||
:height="tableH"
|
||||
@clickTopBtn="clickTopBtn"
|
||||
>
|
||||
<method-btn slot="handleBtn" :width="160" :method-list="tableBtn" :is-fixed="true" @clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.current"
|
||||
:limit.sync="listQuery.size"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<!-- 新增弹窗 -->
|
||||
<!-- :order-id="{orderId: orderId}" -->
|
||||
<add-form :visible.sync="showDialog" @done="getList" />
|
||||
<!-- 编辑/详情弹窗 -->
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
<!-- 更新详情 弹窗-->
|
||||
<!-- :cache-id="listQuery.cacheId" -->
|
||||
<detail-dialog
|
||||
v-if="addOrUpdateVisible"
|
||||
ref="addOrUpdate"
|
||||
@refreshDataList="getList"
|
||||
@handleClosed="handleClosed"
|
||||
/>
|
||||
<!-- <add-form :visible.sync="showDialog" @done="getList" />
|
||||
<edit-form :readonly="readonly" :visible.sync="showEditDialog" :target-info="{id: curEditId}" @done="getList" />
|
||||
<router-view /> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { tableHeight } from '@/utils/index'
|
||||
// import dataDict from '@/filters/DataDict'
|
||||
// import TopTitle from '@/components/TopTitle'
|
||||
import HeadForm from '@/components/basicData/HeadForm'
|
||||
// import viewDetailBtn from '@/components/BaseTable/subcomponents/CommonBtn.vue'
|
||||
import detailDialog from './components/detail.vue'
|
||||
// edit here
|
||||
import { timeFormatter } from '@/filters'
|
||||
import newBasicData from '@/filters/newBasicData'
|
||||
const topBtnConfig = [
|
||||
{
|
||||
type: 'add',
|
||||
btnName: 'btn.add'
|
||||
}
|
||||
]
|
||||
const tableBtn = [
|
||||
{
|
||||
type: 'detail',
|
||||
btnName: 'btn.detail'
|
||||
},
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: 'btn.edit'
|
||||
},
|
||||
{
|
||||
type: 'issue',
|
||||
btnName: i18n.t('module.equipmentManager.maintainplan.changeDetail')
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: 'btn.delete'
|
||||
}
|
||||
]
|
||||
// 暂时隐藏
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'createTime',
|
||||
label: i18n.t('module.equipmentManager.repair.createTime'),
|
||||
filter: timeFormatter
|
||||
},
|
||||
{
|
||||
prop: 'equipmentName',
|
||||
label: i18n.t('module.equipmentManager.repair.equipmentName')
|
||||
},
|
||||
{
|
||||
prop: 'description',
|
||||
label: i18n.t('module.equipmentManager.sparepart.description')
|
||||
},
|
||||
{
|
||||
prop: 'source',
|
||||
label: i18n.t('module.equipmentManager.sparepart.source'),
|
||||
// filter: dataDict('source')
|
||||
filter: newBasicData('1523941494259912706')
|
||||
// }, {
|
||||
// prop: 'supplierId',
|
||||
// label: i18n.t('module.equipmentManager.sparepart.supplier'),
|
||||
// isFixed: true,
|
||||
// subcomponent: DictFilter,
|
||||
// filter: getDictSupplier,
|
||||
// width: '140px'
|
||||
},
|
||||
{
|
||||
prop: 'operator',
|
||||
label: i18n.t('module.equipmentManager.sparepart.operator')
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
label: i18n.t('module.equipmentManager.sparepart.status'),
|
||||
subcomponent: Status
|
||||
// }, {
|
||||
// prop: 'entryTime',
|
||||
// label: i18n.t('module.equipmentManager.sparepart.entryTime'),
|
||||
// isFixed: true,
|
||||
// filter: timeFormatter,
|
||||
// }, {
|
||||
// prop: 'receiver',
|
||||
// label: i18n.t('module.equipmentManager.sparepart.receiver'),
|
||||
// isFixed: true,
|
||||
// subcomponent: DictFilter,
|
||||
// filter: getDictWorker,
|
||||
// }, {
|
||||
// prop: 'remark',
|
||||
// label: i18n.t('module.equipmentManager.sparepart.remark'),
|
||||
// isFixed: true,
|
||||
}
|
||||
// {
|
||||
// prop: 'changeRecord',
|
||||
// label: i18n.t('module.equipmentManager.maintainplan.changeDetail'),
|
||||
// buttonContent: '更换详情'
|
||||
// // subcomponent: SpareChange
|
||||
// }
|
||||
]
|
||||
// import AddForm from './AddForm'
|
||||
// import EditForm from './EditForm'
|
||||
import Vue from 'vue'
|
||||
import AddForm from './AddForm'
|
||||
import EditForm from './EditForm'
|
||||
import BaseTable from '@/components/BaseTable'
|
||||
import { objFilter } from '@/utils'
|
||||
// edit here
|
||||
import { getSpareList, delSpare } from '@/api/equipment/spare'
|
||||
import { getDictDevice } from '@/api/dict'
|
||||
// import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
|
||||
import Pagination from '@/components/Pagination'
|
||||
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
||||
import i18n from '@/lang'
|
||||
import { lineList } from '@/api/DataAnalysis/productionLineBalance'
|
||||
import Status from './components/Status.vue'
|
||||
// import SpareChange from '@/SpareChange.vue'
|
||||
export default {
|
||||
name: 'OrgManager',
|
||||
// , AddForm, EditForm
|
||||
components: { HeadForm, Pagination, BaseTable, MethodBtn, detailDialog, AddForm, EditForm },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
addOrUpdateVisible: false,
|
||||
topBtnConfig,
|
||||
tableBtn,
|
||||
tableProps,
|
||||
tableH: tableHeight(280),
|
||||
list: [],
|
||||
total: 0,
|
||||
lineList: [],
|
||||
listLoading: true,
|
||||
showDialog: false,
|
||||
curEditId: null,
|
||||
showEditDialog: false,
|
||||
readonly: false,
|
||||
listQuery: {
|
||||
current: 1,
|
||||
size: 20,
|
||||
// keywords: '',
|
||||
// status: '',
|
||||
equipmentId: null,
|
||||
startTime: null,
|
||||
endTime: null,
|
||||
productionLineId: 1
|
||||
},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'label'
|
||||
},
|
||||
headFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainplan.productionLineId'),
|
||||
selectOptions: [],
|
||||
param: 'productionLineId'
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: this.$t('module.equipmentManager.maintainplan.placeholderequipmentId'),
|
||||
selectOptions: [],
|
||||
param: 'equipmentId'
|
||||
},
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '',
|
||||
dateType: 'daterange',
|
||||
format: 'yyyy-MM-dd hh:mm:ss',
|
||||
valueFormat: 'yyyy-MM-dd hh:mm:ss',
|
||||
rangeSeparator: '-',
|
||||
startPlaceholder: this.$t('module.equipmentManager.maintainplan.startTime'),
|
||||
endPlaceholder: this.$t('module.equipmentManager.maintainplan.endTime'),
|
||||
param: 'searchTime'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: 'btn.search',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
}
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.add',
|
||||
// name: 'add',
|
||||
// color: 'primary'
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: 'btn.export',
|
||||
// name: 'export',
|
||||
// color: 'success'
|
||||
// }
|
||||
],
|
||||
headFormValue: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getLineList()
|
||||
this.getList()
|
||||
// this.listLoading = false
|
||||
this.getDict()
|
||||
},
|
||||
mounted() {
|
||||
// 固定表头，表格的最大高度随页面的高度自动调整
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = tableHeight(280)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleNodeClick() {},
|
||||
handleClick(raw) {
|
||||
// console.log(raw)
|
||||
switch (raw.type) {
|
||||
case 'delete':
|
||||
this.$confirm(i18n.t('deleteMsgBox.content'), i18n.t('deleteMsgBox.hint'), {
|
||||
confirmButtonText: i18n.t('btn.confirm'),
|
||||
cancelButtonText: i18n.t('btn.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async() => {
|
||||
// 走接口
|
||||
const result = await delSpare({
|
||||
id: raw.data.id
|
||||
})
|
||||
if (result.code === 0) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: i18n.t('deleteMsgBox.doneMsg')
|
||||
})
|
||||
}
|
||||
this.getList()
|
||||
})
|
||||
break
|
||||
case 'detail':
|
||||
// this.readonly = true
|
||||
// this.$router.push({
|
||||
// name: 'EditSpare',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = true
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'edit':
|
||||
// this.$router.push({
|
||||
// name: 'EditSpare',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
this.showEditDialog = true
|
||||
this.readonly = false
|
||||
this.curEditId = raw.data.id
|
||||
break
|
||||
case 'issue':
|
||||
// this.$router.push({
|
||||
// name: 'SpareChange',
|
||||
// query: {
|
||||
// id: raw.data.id
|
||||
// }
|
||||
// })
|
||||
// console.log(raw)
|
||||
// 传备品备件记录的id
|
||||
this.addNew(raw.data.id)
|
||||
break
|
||||
}
|
||||
},
|
||||
// 更换详情
|
||||
// addNew(id, readonly) {
|
||||
// this.addOrUpdateVisible = true
|
||||
// this.$nextTick(() => {
|
||||
// this.$refs.addOrUpdate.init(id, 'area', readonly)
|
||||
// })
|
||||
// },
|
||||
addNew(id) {
|
||||
this.addOrUpdateVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.addOrUpdate.init(id)
|
||||
})
|
||||
},
|
||||
async getDict() {
|
||||
const result = await getDictDevice({
|
||||
current: 1,
|
||||
size: 999
|
||||
})
|
||||
// console.log(result)
|
||||
this.headFormConfig[1].selectOptions = result
|
||||
},
|
||||
async getList() {
|
||||
this.listLoading = true
|
||||
// edit here
|
||||
this.listQuery.productionLineId = this.headFormValue.productionLineId
|
||||
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
||||
// this.listQuery.id = this.headFormValue.id
|
||||
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : ''
|
||||
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : ''
|
||||
// console.log(this.listQuery)
|
||||
const res = await getSpareList(objFilter(this.listQuery))
|
||||
// 接口问题，接口没有返回total等
|
||||
if (res.code === 0) {
|
||||
this.list = res.data.records ? res.data.records : []
|
||||
// 如果后端不传equipmentName，则需要根据equipmentId手动调接口查询
|
||||
// this.list.map(item => {
|
||||
// console.log(item)
|
||||
// const result = getDictEqName({ id: item.equipmentId })
|
||||
// item.equipmentName = result
|
||||
// })
|
||||
// console.log(res)
|
||||
this.total = res.data.total
|
||||
this.listLoading = false
|
||||
}
|
||||
},
|
||||
// exportExcel() {
|
||||
// const params = {
|
||||
// current: 1,
|
||||
// size: 999,
|
||||
// equipmentId: this.headFormValue.equipmentId,
|
||||
// equipmentName: this.headFormValue.equipmentName,
|
||||
// startTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[0] : null,
|
||||
// endTime: this.headFormValue.searchTime ? this.headFormValue.searchTime[1] : null
|
||||
// }
|
||||
// this.$nextTick(() => {
|
||||
// exportFile(params).then(response => {
|
||||
// let fileName = ''
|
||||
// const contentDisposition = response.headers['content-disposition']
|
||||
// if (contentDisposition) {
|
||||
// fileName = contentDisposition.slice(contentDisposition.indexOf('filename=') + 9)
|
||||
// }
|
||||
// const blob = new Blob([response.data])
|
||||
// const reader = new FileReader()
|
||||
// reader.readAsDataURL(blob)
|
||||
// reader.onload = (e) => {
|
||||
// const a = document.createElement('a')
|
||||
// a.download = fileName
|
||||
// a.href = e.target.result
|
||||
// document.body.appendChild(a)
|
||||
// a.click()
|
||||
// document.body.removeChild(a)
|
||||
// }
|
||||
// })
|
||||
// })
|
||||
// },
|
||||
btnClick(val) {
|
||||
this.headFormValue = val
|
||||
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
||||
if (this.headFormValue.btnName === 'search') {
|
||||
this.getList()
|
||||
} else if (this.headFormValue.btnName === 'add') {
|
||||
this.toAddPage() // 新增
|
||||
} else if (this.headFormValue.btnName === 'export') {
|
||||
this.exportExcel()
|
||||
}
|
||||
},
|
||||
toAddPage() {
|
||||
// this.$router.push({
|
||||
// name: 'AddSpare',
|
||||
// query: {
|
||||
// orderId: this.orderId
|
||||
// }
|
||||
// })
|
||||
},
|
||||
clickTopBtn(val) {
|
||||
if (val === 'add') {
|
||||
// this.toAddPage() // 新增
|
||||
this.showDialog = true// 弹窗新增
|
||||
}
|
||||
},
|
||||
// 获取产线列表
|
||||
getLineList() {
|
||||
lineList({ current: 1, size: 999 }).then(res => {
|
||||
if (res.code === 0) {
|
||||
// console.log(res)
|
||||
this.lineList = res.data.records
|
||||
// console.log(res)
|
||||
Vue.set(this.headFormConfig[0], 'selectOptions', this.lineList)
|
||||
}
|
||||
// console.log(res)
|
||||
})
|
||||
},
|
||||
handleClosed() {}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
Reference in New Issue
Block a user