mt-yd-ui/src/views/modules/monitoring/equipmentQuantity.vue
2022-09-01 16:52:42 +08:00

167 lines
4.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="mod-config">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.key" :placeholder="$t('parameter')" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">{{ $t('query') }}</el-button>
<el-button v-if="$hasPermission('monitoring:equipmenquantity:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
</el-form-item>
</el-form>
<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" />
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper"
>
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</template>
<script>
import { calcMaxHeight } from '@/utils'
import { timeFilter } from '@/utils/filters'
import AddOrUpdate from './equipmentQuantity-add-or-update'
import i18n from '@/i18n'
import BaseTable from '@/components/base-table'
import TableOperateComponent from '@/components/base-table/components/operationComponent'
import TableTextComponent from '@/components/base-table/components/detailComponent'
const tableConfigs = [
{ prop: 'id', name: 'id' },
{ prop: 'externalCode', name: '设备外部编码' },
{ prop: 'equipmentName', name: '设备名称' },
{ prop: 'inQuantity', name: '进入设备的数量' },
{
prop: 'outQuantity',
name: '离开设备的数量若plc只记录一个生产数量也写入该字段'
},
{ prop: 'okQuantity', name: '' },
{ prop: 'nokQuantity', name: '设备上报的报废数量' },
{ prop: 'description', name: '' },
{ prop: 'remark', name: i18n.t('remark') },
{ prop: 'valid', name: '删除标志,是否有效:1 可用 0不可用' },
{ prop: 'creatorId', name: '创建人' },
{ prop: 'creatorName', name: '创建人姓名' },
{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
{ prop: 'updaterId', name: '更新人' },
{ prop: 'updaterName', name: '更新人姓名' },
{ prop: 'updateTime', name: '更新时间', filter: timeFilter },
{ prop: 'version', name: '版本号' },
{ prop: 'recordTime', name: '生产数量的记录时间' },
{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
]
export default {
data() {
return {
tableConfigs,
calcMaxHeight,
dataForm: {
key: ''
},
dataList: [],
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
}
},
components: {
AddOrUpdate,
BaseTable
},
activated() {
this.getDataList()
},
methods: {
// 获取数据列表
getDataList() {
this.dataListLoading = true
this.$http({
url: this.$http.adornUrl('/monitoring/equipmentQuantity/page'),
method: 'get',
params: this.$http.adornParams({
page: this.pageIndex,
limit: this.pageSize,
key: this.dataForm.key
})
}).then(({ data }) => {
if (data && data.code === 0) {
this.dataList = data.data.list
this.totalPage = data.data.total
} else {
this.dataList = []
this.totalPage = 0
}
this.dataListLoading = false
})
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val
this.pageIndex = 1
this.getDataList()
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val
this.getDataList()
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val
},
// 新增 / 修改
addOrUpdateHandle(id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id)
})
},
// 删除
deleteHandle(id) {
var ids = id
? [id]
: this.dataListSelections.map(item => {
return item.id
})
this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? i18n.t('delete') : i18n.t('deleteBatch')}]操作?`, '提示', {
confirmButtonText: i18n.t('confirm'),
cancelButtonText: i18n.t('cancel'),
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/monitoring/equipmentQuantity'),
method: 'delete',
data: this.$http.adornData(ids, false, 'raw')
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: '操作成功',
type: 'success',
duration: 1500,
onClose: () => {
this.getDataList()
}
})
} else {
this.$message.error(data.msg)
}
})
})
}
}
}
</script>