设备管理

This commit is contained in:
hzz 2024-03-29 17:02:55 +08:00
parent c6b6497c43
commit 4342cf5cb0
5 changed files with 180 additions and 48 deletions

View File

@ -148,7 +148,7 @@ function handleExceed() {
//
function handleUploadSuccess(res, file) {
if (res.code === 200) {
uploadList.value.push({ name: res.fileName, url: res.fileName });
uploadList.value.push({ name: res.fileName, url: baseUrl + res.fileName });
uploadedSuccessfully();
} else {
number.value--;

View File

@ -6,7 +6,7 @@
<h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }}</h1>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo" />
<!-- <img v-if="logo" :src="logo" class="sidebar-logo" /> -->
<h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }}</h1>
</router-link>
</transition>

View File

@ -59,37 +59,45 @@
<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-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-col> -->
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></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 type="index" label="序号" width="55" align="center" />
<el-table-column label="设备名称" align="center" v-if="columns[0].visible" prop="name" />
<el-table-column label="设备编号" align="center" v-if="columns[1].visible" prop="code" />
<el-table-column label="设备类型" align="center" v-if="columns[2].visible" prop="type" />
<el-table-column label="车间名称" align="center" v-if="columns[3].visible" prop="workShop" />
<el-table-column label="产线名称" align="center" v-if="columns[4].visible" prop="lineName" />
<el-table-column label="保养周期" align="center" v-if="columns[5].visible" prop="maintenance" />
<el-table-column label="供货商名称" align="center" v-if="columns[6].visible" prop="supplier" />
<el-table-column label="供货商联络人" align="center" v-if="columns[7].visible" prop="supplierContactPerson" />
<el-table-column label="生产厂家" align="center" v-if="columns[8].visible" prop="manufacturer" />
<el-table-column label="联系电话" align="center" v-if="columns[9].visible" prop="contactPhone" />
<el-table-column label="品牌" align="center" v-if="columns[10].visible" prop="brand" />
<el-table-column label="针数" align="center" v-if="columns[11].visible" prop="needleNum" />
<el-table-column label="设备型号" align="center" v-if="columns[12].visible" prop="model" />
<!-- <el-table-column label="图片(文件)" align="center" prop="file" /> -->
<el-table-column label="备注" align="center" v-if="columns[13].visible" 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 #default="scope">
<el-tooltip content="详情" placement="top" v-if="scope.row.userId !== 1">
<el-button link type="primary" icon="Tickets" @click="handleInfo(scope.row)"
v-hasPermi="['casm:device:info']"></el-button>
</el-tooltip>
<el-tooltip content="修改" placement="top" v-if="scope.row.userId !== 1">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['casm:device:edit']"></el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top" v-if="scope.row.userId !== 1">
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['casm:device:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
@ -98,14 +106,17 @@
@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-dialog :title="title" v-model="open" width="800px" append-to-body>
<el-form ref="formRef" :inline="true" :model="form" :rules="rules" class="demo-form-inline" label-width="100px">
<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="code">
<el-input v-model="form.type" placeholder="请输入设备编号" />
</el-form-item>
<el-form-item label="车间名称" prop="workShop">
<el-input v-model="form.workShop" placeholder="请输入车间名称" />
</el-form-item>
@ -131,13 +142,13 @@
<el-input v-model="form.brand" placeholder="请输入品牌" />
</el-form-item>
<el-form-item label="针数" prop="needleNum">
<el-input v-model="form.needleNum" placeholder="请输入针数" />
<el-input-number v-model="form.needleNum" :min="1" />
</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" />
<image-upload v-model="form.file" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
@ -148,12 +159,14 @@
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<InfoVue v-model="infoDialog" :info="deviceinfo" />
</div>
</template>
<script setup>
import { ref, reactive, watch, onMounted } from 'vue'
import { listDevice, getDevice, delDevice, addDevice, updateDevice } from "@/api/casm/device";
import InfoVue from "./info.vue";
const { proxy } = getCurrentInstance();
//
let loading = ref(true)
@ -164,7 +177,7 @@ let single = ref(true)
//
let multiple = ref(true)
//
let showSearch = ref(true)
let showSearch = ref(false)
//
let total = ref(0)
//
@ -173,7 +186,8 @@ let deviceList = ref([])
let title = ref("")
//
let open = ref(false)
let infoDialog = ref(false)
let deviceinfo = ref({})
//
let queryParams = reactive({
pageNum: 1,
@ -196,13 +210,37 @@ let queryParams = reactive({
//
let form = ref({})
//
let rules = ref({})
let rules = ref({
needleNum: [
{
type: 'number',
required: true,
message: '针数只能为数字',
trigger: 'change',
},
],
})
//
const columns = ref([
{ key: 0, label: `设备名称`, visible: true },
{ key: 1, label: `设备编号`, visible: true },
{ key: 2, label: `设备类型`, visible: true },
{ key: 3, label: `车间名称`, visible: true },
{ key: 4, label: `产线名称`, visible: false },
{ key: 5, label: `保养周期`, visible: false },
{ key: 5, label: `供货商名称`, visible: false },
{ key: 5, label: `供货商联络人`, visible: false },
{ key: 5, label: `生产厂家`, visible: false },
{ key: 5, label: `联系电话`, visible: false },
{ key: 5, label: `品牌`, visible: false },
{ key: 5, label: `针数`, visible: false },
{ key: 5, label: `设备型号`, visible: false },
{ key: 5, label: `备注`, visible: false },
]);
/** 查询设备信息列表 */
function getList() {
loading.value = true;
listDevice(queryParams).then(response => {
console.log(response,'1111');
deviceList.value = response.rows;
total.value = response.total;
loading.value = false;
@ -220,7 +258,6 @@ function reset() {
id: null,
name: null,
code: null,
type: null,
workShop: null,
lineName: null,
maintenance: null,
@ -229,13 +266,12 @@ function reset() {
manufacturer: null,
contactPhone: null,
brand: null,
needleNum: null,
needleNum: 1,
model: null,
file: null,
createTime: null,
remark: null
};
this.resetForm("form");
//resetForm("form");
}
//** */
@ -245,7 +281,23 @@ function handleQuery() {
}
/** 重置按钮操作 */
function resetQuery() {
resetForm("queryForm");
queryParams.pageNum = 1
queryParams.pageSize = 10
queryParams.name = null
queryParams.code = null
queryParams.type = null
queryParams.workShop = null
queryParams.lineName = null
queryParams.maintenance = null
queryParams.supplier = null
queryParams.supplierContactPerson = null
queryParams.manufacturer = null
queryParams.contactPhone = null
queryParams.brand = null
queryParams.needleNum = null
queryParams.model = null
queryParams.file = null
handleQuery();
}
//
@ -254,6 +306,12 @@ function handleSelectionChange(selection) {
single.value = selection.length !== 1
multiple.value = !selection.length
}
/**详情按钮操作 */
function handleInfo(row) {
deviceinfo.value = row
infoDialog.value = true
}
/** 新增按钮操作 */
function handleAdd() {
reset();
@ -263,7 +321,7 @@ function handleAdd() {
/** 修改按钮操作 */
function handleUpdate(row) {
reset();
const id = row.id || this.ids
const id = row.id || ids.value
getDevice(id).then(response => {
form.value = response.data;
open.value = true;
@ -272,16 +330,16 @@ function handleUpdate(row) {
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["form"].validate(valid => {
proxy.$refs["formRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateDevice(this.form).then(response => {
updateDevice(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addDevice(this.form).then(response => {
addDevice(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
@ -292,9 +350,9 @@ function submitForm() {
}
/** 删除按钮操作 */
function handleDelete(row) {
const ids = row.id || ids.value;
proxy.$modal.confirm('是否确认删除设备信息编号为"' + ids + '"的数据项?').then(function () {
return delDevice(ids);
const id = row.id || ids.value;
proxy.$modal.confirm('是否确认删除设备信息编号为"' + id + '"的数据项?').then(function () {
return delDevice(id);
}).then(() => {
getList();
proxy.$modal.msgSuccess("删除成功");
@ -312,4 +370,12 @@ onMounted(() => {
})
</script>
<style lang="scss" scoped></style>
<style lang="scss" scoped>
.demo-form-inline :deep(.el-input) {
--el-input-width: 220px;
}
.demo-form-inlinee :deep(.el-select) {
--el-select-width: 220px;
}
</style>

View File

@ -0,0 +1,56 @@
<template>
<el-dialog v-model="props.modelValue" title="设备详情" @close="close" width="800">
<el-descriptions title="设备信息">
<el-descriptions-item label="设备编号">{{ props.info.code }}</el-descriptions-item>
<el-descriptions-item label="设备名称">{{ props.info.name }}</el-descriptions-item>
<el-descriptions-item label="设备类型">{{ props.info.type }}</el-descriptions-item>
<el-descriptions-item label="车间名称">{{ props.info.workShop }}</el-descriptions-item>
<el-descriptions-item label="产线名称">{{ props.info.lineName }}</el-descriptions-item>
<el-descriptions-item label="保养周期">{{ props.info.maintenance }}</el-descriptions-item>
<el-descriptions-item label="针数">{{ props.info.needleNum }}</el-descriptions-item>
</el-descriptions>
<el-descriptions title="其他信息">
<el-descriptions-item label="供货商名称">{{ props.info.supplier }}</el-descriptions-item>
<el-descriptions-item label="联系人">{{ props.info.supplierContactPerson }}</el-descriptions-item>
<el-descriptions-item label="电话">{{ props.info.contactPhone }}</el-descriptions-item>
<el-descriptions-item label="生产厂家">{{ props.info.manufacturer }}</el-descriptions-item>
<el-descriptions-item label="品牌">{{ props.info.brand }}</el-descriptions-item>
<el-descriptions-item label="设备型号">{{ props.info.model }}</el-descriptions-item>
</el-descriptions>
<el-descriptions title="" column="1">
<el-descriptions-item label="备注信息">{{ props.info.remark }}</el-descriptions-item>
</el-descriptions>
<el-descriptions title="" column="">
<el-descriptions-item label="设备图片">
<div v-if="props.info.file && props.info.file.length > 0" style="width: 100%;display: flex;flex-direction: row;justify-content: center;">
<el-image v-for="(item, index) in props.info?.file.split(',')" :key="index" :src="baseUrl + item"
style="width: 100px; height: 100px; margin-right: 10px; margin-bottom: 10px"
@click="dialogImageUrl = item; dialogVisible = true"></el-image>
</div>
</el-descriptions-item>
</el-descriptions>
</el-dialog>
</template>
<script setup>
import { ref } from "vue";
const emit = defineEmits();
const props = defineProps({
modelValue: [String, Object, Array],
info: {
type: Object,
default: () => ({}),
},
});
const baseUrl = import.meta.env.VITE_APP_BASE_API;
let column = ref(2);
function close() {
emit("update:modelValue", false);
}
</script>
<style lang="scss" scoped></style>

View File

@ -0,0 +1,10 @@
<template>
<div class="">产品管理</div>
</template>
<script setup>
</script>
<style lang="scss" scoped>
</style>