设备管理

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) { function handleUploadSuccess(res, file) {
if (res.code === 200) { if (res.code === 200) {
uploadList.value.push({ name: res.fileName, url: res.fileName }); uploadList.value.push({ name: res.fileName, url: baseUrl + res.fileName });
uploadedSuccessfully(); uploadedSuccessfully();
} else { } else {
number.value--; 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> <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }}</h1>
</router-link> </router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/"> <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> <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }}</h1>
</router-link> </router-link>
</transition> </transition>

View File

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