添加设备管理

This commit is contained in:
hzz 2024-03-28 17:05:08 +08:00
parent fd22451b03
commit c6b6497c43
3 changed files with 370 additions and 1 deletions

View File

@ -0,0 +1,44 @@
import request from '@/utils/request'
// 查询设备信息列表
export function listDevice(query) {
return request({
url: '/casm/device/list',
method: 'get',
params: query
})
}
// 查询设备信息详细
export function getDevice(id) {
return request({
url: '/casm/device/' + id,
method: 'get'
})
}
// 新增设备信息
export function addDevice(data) {
return request({
url: '/casm/device',
method: 'post',
data: data
})
}
// 修改设备信息
export function updateDevice(data) {
return request({
url: '/casm/device',
method: 'put',
data: data
})
}
// 删除设备信息
export function delDevice(id) {
return request({
url: '/casm/device/' + id,
method: 'delete'
})
}

View File

@ -12,7 +12,7 @@
@click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''" @click.middle="!isAffix(tag) ? closeSelectedTag(tag) : ''"
@contextmenu.prevent="openMenu(tag, $event)" @contextmenu.prevent="openMenu(tag, $event)"
> >
{{ tag.title }} {{ menusTitle(tag.title)}}
<span v-if="!isAffix(tag)" @click.prevent.stop="closeSelectedTag(tag)"> <span v-if="!isAffix(tag)" @click.prevent.stop="closeSelectedTag(tag)">
<close class="el-icon-close" style="width: 1em; height: 1em;vertical-align: middle;" /> <close class="el-icon-close" style="width: 1em; height: 1em;vertical-align: middle;" />
</span> </span>
@ -47,7 +47,9 @@ import { getNormalPath } from '@/utils/ruoyi'
import useTagsViewStore from '@/store/modules/tagsView' import useTagsViewStore from '@/store/modules/tagsView'
import useSettingsStore from '@/store/modules/settings' import useSettingsStore from '@/store/modules/settings'
import usePermissionStore from '@/store/modules/permission' import usePermissionStore from '@/store/modules/permission'
import { useI18n } from 'vue-i18n'
let {te,t} = useI18n();
const visible = ref(false); const visible = ref(false);
const top = ref(0); const top = ref(0);
const left = ref(0); const left = ref(0);
@ -63,6 +65,14 @@ const visitedViews = computed(() => useTagsViewStore().visitedViews);
const routes = computed(() => usePermissionStore().routes); const routes = computed(() => usePermissionStore().routes);
const theme = computed(() => useSettingsStore().theme); const theme = computed(() => useSettingsStore().theme);
//
function menusTitle(item) {
if (te("menus." + item)) {
return t("menus." + item)
}
return item
}
watch(route, () => { watch(route, () => {
addTags() addTags()
moveToCurrentTag() moveToCurrentTag()

View File

@ -0,0 +1,315 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="设备名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入设备名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="设备编号" prop="code">
<el-input v-model="queryParams.code" placeholder="请输入设备编号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="车间名称" prop="workShop">
<el-input v-model="queryParams.workShop" placeholder="请输入车间名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="产线名称" prop="lineName">
<el-input v-model="queryParams.lineName" placeholder="请输入产线名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="保养周期" prop="maintenance">
<el-input v-model="queryParams.maintenance" placeholder="请输入保养周期" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="供货商名称" prop="supplier">
<el-input v-model="queryParams.supplier" placeholder="请输入供货商名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="供货商联络人" prop="supplierContactPerson">
<el-input v-model="queryParams.supplierContactPerson" placeholder="请输入供货商联络人" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="生产厂家" prop="manufacturer">
<el-input v-model="queryParams.manufacturer" placeholder="请输入生产厂家" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="联系电话" prop="contactPhone">
<el-input v-model="queryParams.contactPhone" placeholder="请输入联系电话" clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="品牌" prop="brand">
<el-input v-model="queryParams.brand" placeholder="请输入品牌" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="针数" prop="needleNum">
<el-input v-model="queryParams.needleNum" placeholder="请输入针数" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="设备型号" prop="model">
<el-input v-model="queryParams.model" placeholder="请输入设备型号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="plus" size="mini" @click="handleAdd"
v-hasPermi="['casm:device:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="success" plain icon="edit" size="mini" :disabled="single" @click="handleUpdate"
v-hasPermi="['casm:device:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="danger" plain icon="delete" size="mini" :disabled="multiple" @click="handleDelete"
v-hasPermi="['casm:device:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="download" size="mini" @click="handleExport"
v-hasPermi="['casm:device:export']">导出</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="设备ID" align="center" prop="id" />
<el-table-column label="设备名称" align="center" prop="name" />
<el-table-column label="设备编号" align="center" prop="code" />
<el-table-column label="设备类型" align="center" prop="type" />
<el-table-column label="车间名称" align="center" prop="workShop" />
<el-table-column label="产线名称" align="center" prop="lineName" />
<el-table-column label="保养周期" align="center" prop="maintenance" />
<el-table-column label="供货商名称" align="center" prop="supplier" />
<el-table-column label="供货商联络人" align="center" prop="supplierContactPerson" />
<el-table-column label="生产厂家" align="center" prop="manufacturer" />
<el-table-column label="联系电话" align="center" prop="contactPhone" />
<el-table-column label="品牌" align="center" prop="brand" />
<el-table-column label="针数" align="center" prop="needleNum" />
<el-table-column label="设备型号" align="center" prop="model" />
<el-table-column label="图片(文件)" align="center" prop="file" />
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="edit" @click="handleUpdate(scope.row)"
v-hasPermi="['casm:device:edit']">修改</el-button>
<el-button size="mini" type="text" icon="delete" @click="handleDelete(scope.row)"
v-hasPermi="['casm:device:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改设备信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
<el-form-item label="设备名称" prop="name">
<el-input v-model="form.name" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="设备编号" prop="code">
<el-input v-model="form.code" placeholder="请输入设备编号" />
</el-form-item>
<el-form-item label="车间名称" prop="workShop">
<el-input v-model="form.workShop" placeholder="请输入车间名称" />
</el-form-item>
<el-form-item label="产线名称" prop="lineName">
<el-input v-model="form.lineName" placeholder="请输入产线名称" />
</el-form-item>
<el-form-item label="保养周期" prop="maintenance">
<el-input v-model="form.maintenance" placeholder="请输入保养周期" />
</el-form-item>
<el-form-item label="供货商名称" prop="supplier">
<el-input v-model="form.supplier" placeholder="请输入供货商名称" />
</el-form-item>
<el-form-item label="供货商联络人" prop="supplierContactPerson">
<el-input v-model="form.supplierContactPerson" placeholder="请输入供货商联络人" />
</el-form-item>
<el-form-item label="生产厂家" prop="manufacturer">
<el-input v-model="form.manufacturer" placeholder="请输入生产厂家" />
</el-form-item>
<el-form-item label="联系电话" prop="contactPhone">
<el-input v-model="form.contactPhone" placeholder="请输入联系电话" />
</el-form-item>
<el-form-item label="品牌" prop="brand">
<el-input v-model="form.brand" placeholder="请输入品牌" />
</el-form-item>
<el-form-item label="针数" prop="needleNum">
<el-input v-model="form.needleNum" placeholder="请输入针数" />
</el-form-item>
<el-form-item label="设备型号" prop="model">
<el-input v-model="form.model" placeholder="请输入设备型号" />
</el-form-item>
<el-form-item label="图片(文件)" prop="file">
<file-upload v-model="form.file" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script setup>
import { ref, reactive, watch, onMounted } from 'vue'
import { listDevice, getDevice, delDevice, addDevice, updateDevice } from "@/api/casm/device";
const { proxy } = getCurrentInstance();
//
let loading = ref(true)
//
let ids = ref([])
//
let single = ref(true)
//
let multiple = ref(true)
//
let showSearch = ref(true)
//
let total = ref(0)
//
let deviceList = ref([])
//
let title = ref("")
//
let open = ref(false)
//
let queryParams = reactive({
pageNum: 1,
pageSize: 10,
name: null,
code: null,
type: null,
workShop: null,
lineName: null,
maintenance: null,
supplier: null,
supplierContactPerson: null,
manufacturer: null,
contactPhone: null,
brand: null,
needleNum: null,
model: null,
file: null,
})
//
let form = ref({})
//
let rules = ref({})
/** 查询设备信息列表 */
function getList() {
loading.value = true;
listDevice(queryParams).then(response => {
console.log(response,'1111');
deviceList.value = response.rows;
total.value = response.total;
loading.value = false;
});
}
//
function cancel() {
open.value = false;
reset();
}
//
function reset() {
form.value = {
id: null,
name: null,
code: null,
type: null,
workShop: null,
lineName: null,
maintenance: null,
supplier: null,
supplierContactPerson: null,
manufacturer: null,
contactPhone: null,
brand: null,
needleNum: null,
model: null,
file: null,
createTime: null,
remark: null
};
this.resetForm("form");
}
//** */
function handleQuery() {
queryParams.pageNum = 1;
getList();
}
/** 重置按钮操作 */
function resetQuery() {
resetForm("queryForm");
handleQuery();
}
//
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.id)
single.value = selection.length !== 1
multiple.value = !selection.length
}
/** 新增按钮操作 */
function handleAdd() {
reset();
open.value = true;
title.value = "添加设备信息";
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const id = row.id || this.ids
getDevice(id).then(response => {
form.value = response.data;
open.value = true;
title.value = "修改设备信息";
});
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["form"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateDevice(this.form).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addDevice(this.form).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/** 删除按钮操作 */
function handleDelete(row) {
const ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除设备信息编号为"' + ids + '"的数据项?').then(function () {
return delDevice(ids);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
}).catch(() => { });
}
/** 导出按钮操作 */
function handleExport() {
this.download('casm/device/export', {
...queryParams
}, `device_${new Date().getTime()}.xlsx`)
}
onMounted(() => {
getList();
})
</script>
<style lang="scss" scoped></style>