From 37c4da42e6bc67a0c40ef1d4f2527a5577f86a2e Mon Sep 17 00:00:00 2001
From: hwh <332078369@qq.com>
Date: 星期三, 21 八月 2024 07:56:21 +0800
Subject: [PATCH] plc设备信息页面优化
---
Web/src/views/wcs/wcsDevice/index.vue | 297 +++++++++++++++++++++++++++++------------------------------
1 files changed, 145 insertions(+), 152 deletions(-)
diff --git a/Web/src/views/wcs/wcsDevice/index.vue b/Web/src/views/wcs/wcsDevice/index.vue
index d22f856..adb4f8f 100644
--- a/Web/src/views/wcs/wcsDevice/index.vue
+++ b/Web/src/views/wcs/wcsDevice/index.vue
@@ -1,220 +1,213 @@
锘�<template>
<div class="wcsDevice-container">
- <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
+ <el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
<el-form :model="queryParams" ref="queryForm" labelWidth="90">
<el-row>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
<el-form-item label="鍏抽敭瀛�">
- <el-input v-model="queryParams.searchKey" clearable="" placeholder="璇疯緭鍏ユā绯婃煡璇㈠叧閿瓧"/>
-
+ <el-input v-model="queryParams.searchKey" clearable="" placeholder="璇疯緭鍏ユā绯婃煡璇㈠叧閿瓧" />
+
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
<el-form-item label="PlcId">
<el-select clearable="" filterable="" v-model="queryParams.plcId" placeholder="璇烽�夋嫨PlcId">
- <el-option v-for="(item,index) in wcsPlcPlcIdDropdownList" :key="index" :value="item.value" :label="item.label" />
-
+ <el-option v-for="(item, index) in wcsPlcPlcIdDropdownList" :key="index" :value="item.value"
+ :label="item.label" />
+
</el-select>
-
+
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUI">
<el-form-item label="鎻忚堪">
- <el-input v-model="queryParams.text" clearable="" placeholder="璇疯緭鍏ユ弿杩�"/>
-
+ <el-input v-model="queryParams.text" clearable="" placeholder="璇疯緭鍏ユ弿杩�" />
+
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
- <el-form-item >
+ <el-form-item>
<el-button-group style="display: flex; align-items: center;">
- <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'wcsDevice:page'"> 鏌ヨ </el-button>
- <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 閲嶇疆 </el-button>
- <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI" style="margin-left:5px;"> 楂樼骇鏌ヨ </el-button>
- <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI" style="margin-left:5px;"> 闅愯棌 </el-button>
- <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="openAddWcsDevice" v-auth="'wcsDevice:add'"> 鏂板 </el-button>
-
+ <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'wcsDevice:page'"> 鏌ヨ
+ </el-button>
+ <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 閲嶇疆 </el-button>
+ <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUI" v-if="!showAdvanceQueryUI"
+ style="margin-left:5px;"> 楂樼骇鏌ヨ </el-button>
+ <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUI" v-if="showAdvanceQueryUI"
+ style="margin-left:5px;"> 闅愯棌 </el-button>
+ <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="openAddWcsDevice"
+ v-auth="'wcsDevice:add'"> 鏂板 </el-button>
+
</el-button-group>
</el-form-item>
-
+
</el-col>
</el-row>
</el-form>
</el-card>
<el-card class="full-table" shadow="hover" style="margin-top: 5px">
- <el-table
- :data="tableData"
- style="width: 100%"
- v-loading="loading"
- tooltip-effect="light"
- row-key="id"
- @sort-change="sortChange"
- border="">
- <el-table-column type="index" label="搴忓彿" width="55" align="center"/>
- <el-table-column prop="plcId" label="PlcId" show-overflow-tooltip="">
+ <el-table :data="tableData" style="width: 100%" v-loading="loading" tooltip-effect="light" row-key="id"
+ @sort-change="sortChange" border="">
+ <el-table-column type="index" label="搴忓彿" width="55" align="center" />
+ <el-table-column prop="plcId" label="PlcId" show-overflow-tooltip="">
<template #default="scope">
- <span>{{scope.row.plcIdIP}}</span>
-
+ <span>{{ scope.row.plcIdIP }}</span>
+
</template>
-
+
</el-table-column>
- <el-table-column prop="level" label="璁惧绾у埆" show-overflow-tooltip="" >
- <template #default="scope">
- <el-tag :type="dv('DeviceLevelEnum', scope.row.level)?.tagType"> {{dv('DeviceLevelEnum', scope.row.level)?.name}}</el-tag>
- </template>
- </el-table-column>
- <el-table-column prop="dbNumber" label="DB鍖哄煙" show-overflow-tooltip="" />
- <el-table-column prop="stationNum" label="宸ヤ綅鍙�" show-overflow-tooltip="" />
- <el-table-column prop="plcPos" label="PLC鍋忕Щ閲�" show-overflow-tooltip="" />
- <el-table-column prop="wcsPos" label="WCS鍋忕Щ閲�" show-overflow-tooltip="" />
- <el-table-column prop="posType" label="娴佺▼瀛楃被鍨�" show-overflow-tooltip="" />
- <el-table-column prop="ledIP" label="鏄剧ず灞廼p鍦板潃" show-overflow-tooltip="" />
- <el-table-column prop="text" label="鎻忚堪" show-overflow-tooltip="" />
+ <el-table-column prop="level" label="璁惧绾у埆" show-overflow-tooltip="">
+ <template #default="scope">
+ <el-tag :type="dv('DeviceLevelEnum', scope.row.level)?.tagType"> {{ dv('DeviceLevelEnum',
+ scope.row.level)?.name}}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="dbNumber" label="DB鍖哄煙" show-overflow-tooltip="" />
+ <el-table-column prop="stationNum" label="宸ヤ綅鍙�" show-overflow-tooltip="" />
+ <el-table-column prop="plcPos" label="PLC鍋忕Щ閲�" show-overflow-tooltip="" />
+ <el-table-column prop="wcsPos" label="WCS鍋忕Щ閲�" show-overflow-tooltip="" />
+ <el-table-column prop="posType" label="娴佺▼瀛楃被鍨�" show-overflow-tooltip="">
+ <template #default="scope">
+ <el-tag :type="dv('PLCDataTypeEnum', scope.row.posType)?.tagType"> {{ dv('PLCDataTypeEnum',
+ scope.row.posType)?.name}}</el-tag>
+ </template>
+ </el-table-column>
+ <el-table-column prop="ledIP" label="鏄剧ず灞廼p鍦板潃" show-overflow-tooltip="" />
+ <el-table-column prop="text" label="鎻忚堪" show-overflow-tooltip="" />
<el-table-column label="淇敼璁板綍" width="80" align="center" show-overflow-tooltip>
<template #default="scope">
<ModifyRecord :data="scope.row" />
</template>
</el-table-column>
- <el-table-column label="鎿嶄綔" width="140" align="center" fixed="right" show-overflow-tooltip="" v-if="auth('wcsDevice:update') || auth('wcsDevice:delete')">
+ <el-table-column label="鎿嶄綔" width="140" align="center" fixed="right" show-overflow-tooltip=""
+ v-if="auth('wcsDevice:update') || auth('wcsDevice:delete')">
<template #default="scope">
- <el-button icon="ele-Edit" size="small" text="" type="primary" @click="openEditWcsDevice(scope.row)" v-auth="'wcsDevice:update'"> 缂栬緫 </el-button>
- <el-button icon="ele-Delete" size="small" text="" type="primary" @click="delWcsDevice(scope.row)" v-auth="'wcsDevice:delete'"> 鍒犻櫎 </el-button>
+ <el-button icon="ele-Edit" size="small" text="" type="primary" @click="openEditWcsDevice(scope.row)"
+ v-auth="'wcsDevice:update'"> 缂栬緫 </el-button>
+ <el-button icon="ele-Delete" size="small" text="" type="primary" @click="delWcsDevice(scope.row)"
+ v-auth="'wcsDevice:delete'"> 鍒犻櫎 </el-button>
</template>
</el-table-column>
</el-table>
- <el-pagination
- v-model:currentPage="tableParams.page"
- v-model:page-size="tableParams.pageSize"
- :total="tableParams.total"
- :page-sizes="[10, 20, 50, 100, 200, 500]"
- size="small"
- background=""
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- layout="total, sizes, prev, pager, next, jumper"
- />
- <printDialog
- ref="printDialogRef"
- :title="printWcsDeviceTitle"
- @reloadTable="handleQuery" />
- <editDialog
- ref="editDialogRef"
- :title="editWcsDeviceTitle"
- @reloadTable="handleQuery"
- />
+ <el-pagination v-model:currentPage="tableParams.page" v-model:page-size="tableParams.pageSize"
+ :total="tableParams.total" :page-sizes="[10, 20, 50, 100, 200, 500]" size="small" background=""
+ @size-change="handleSizeChange" @current-change="handleCurrentChange"
+ layout="total, sizes, prev, pager, next, jumper" />
+ <printDialog ref="printDialogRef" :title="printWcsDeviceTitle" @reloadTable="handleQuery" />
+ <editDialog ref="editDialogRef" :title="editWcsDeviceTitle" @reloadTable="handleQuery" />
</el-card>
</div>
</template>
<script lang="ts" setup="" name="wcsDevice">
- import { ref } from "vue";
- import { ElMessageBox, ElMessage } from "element-plus";
- import { auth } from '/@/utils/authFunction';
+import { ref } from "vue";
+import { ElMessageBox, ElMessage } from "element-plus";
+import { auth } from '/@/utils/authFunction';
- import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
- import { getDictLabelByVal as dv } from '/@/utils/dict-utils';
- import { formatDate } from '/@/utils/formatTime';
+import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
+import { getDictLabelByVal as dv } from '/@/utils/dict-utils';
+import { formatDate } from '/@/utils/formatTime';
- import ModifyRecord from '/@/components/table/modifyRecord.vue';
+import ModifyRecord from '/@/components/table/modifyRecord.vue';
- import printDialog from '/@/views/system/print/component/hiprint/preview.vue'
- import editDialog from '/@/views/wcs/wcsDevice/component/editDialog.vue'
- import { pageWcsDevice, deleteWcsDevice } from '/@/api/wcs/wcsDevice';
- import { getWcsPlcPlcIdDropdown } from '/@/api/wcs/wcsDevice';
+import printDialog from '/@/views/system/print/component/hiprint/preview.vue'
+import editDialog from '/@/views/wcs/wcsDevice/component/editDialog.vue'
+import { pageWcsDevice, deleteWcsDevice } from '/@/api/wcs/wcsDevice';
+import { getWcsPlcPlcIdDropdown } from '/@/api/wcs/wcsDevice';
- const showAdvanceQueryUI = ref(false);
- const printDialogRef = ref();
- const editDialogRef = ref();
- const loading = ref(false);
- const tableData = ref<any>([]);
- const queryParams = ref<any>({});
- const tableParams = ref({
- page: 1,
- pageSize: 10,
- total: 0,
- });
+const showAdvanceQueryUI = ref(false);
+const printDialogRef = ref();
+const editDialogRef = ref();
+const loading = ref(false);
+const tableData = ref<any>([]);
+const queryParams = ref<any>({});
+const tableParams = ref({
+ page: 1,
+ pageSize: 10,
+ total: 0,
+});
- const printWcsDeviceTitle = ref("");
- const editWcsDeviceTitle = ref("");
+const printWcsDeviceTitle = ref("");
+const editWcsDeviceTitle = ref("");
- // 鏀瑰彉楂樼骇鏌ヨ鐨勬帶浠舵樉绀虹姸鎬�
- const changeAdvanceQueryUI = () => {
- showAdvanceQueryUI.value = !showAdvanceQueryUI.value;
- }
+// 鏀瑰彉楂樼骇鏌ヨ鐨勬帶浠舵樉绀虹姸鎬�
+const changeAdvanceQueryUI = () => {
+ showAdvanceQueryUI.value = !showAdvanceQueryUI.value;
+}
- // 鏌ヨ鎿嶄綔
- const handleQuery = async () => {
- loading.value = true;
- var res = await pageWcsDevice(Object.assign(queryParams.value, tableParams.value));
- tableData.value = res.data.result?.items ?? [];
- tableParams.value.total = res.data.result?.total;
- loading.value = false;
- };
+// 鏌ヨ鎿嶄綔
+const handleQuery = async () => {
+ loading.value = true;
+ var res = await pageWcsDevice(Object.assign(queryParams.value, tableParams.value));
+ tableData.value = res.data.result?.items ?? [];
+ tableParams.value.total = res.data.result?.total;
+ loading.value = false;
+};
- // 鍒楁帓搴�
- const sortChange = async (column: any) => {
- queryParams.value.field = column.prop;
- queryParams.value.order = column.order;
- await handleQuery();
- };
+// 鍒楁帓搴�
+const sortChange = async (column: any) => {
+ queryParams.value.field = column.prop;
+ queryParams.value.order = column.order;
+ await handleQuery();
+};
- // 鎵撳紑鏂板椤甸潰
- const openAddWcsDevice = () => {
- editWcsDeviceTitle.value = '娣诲姞璁惧淇℃伅';
- editDialogRef.value.openDialog({});
- };
+// 鎵撳紑鏂板椤甸潰
+const openAddWcsDevice = () => {
+ editWcsDeviceTitle.value = '娣诲姞璁惧淇℃伅';
+ editDialogRef.value.openDialog({});
+};
- // 鎵撳紑鎵撳嵃椤甸潰
- const openPrintWcsDevice = async (row: any) => {
- printWcsDeviceTitle.value = '鎵撳嵃璁惧淇℃伅';
- }
-
- // 鎵撳紑缂栬緫椤甸潰
- const openEditWcsDevice = (row: any) => {
- editWcsDeviceTitle.value = '缂栬緫璁惧淇℃伅';
- editDialogRef.value.openDialog(row);
- };
+// 鎵撳紑鎵撳嵃椤甸潰
+const openPrintWcsDevice = async (row: any) => {
+ printWcsDeviceTitle.value = '鎵撳嵃璁惧淇℃伅';
+}
- // 鍒犻櫎
- const delWcsDevice = (row: any) => {
- ElMessageBox.confirm(`纭畾瑕佸垹闄ゅ悧?`, "鎻愮ず", {
+// 鎵撳紑缂栬緫椤甸潰
+const openEditWcsDevice = (row: any) => {
+ editWcsDeviceTitle.value = '缂栬緫璁惧淇℃伅';
+ editDialogRef.value.openDialog(row);
+};
+
+// 鍒犻櫎
+const delWcsDevice = (row: any) => {
+ ElMessageBox.confirm(`纭畾瑕佸垹闄ゅ悧?`, "鎻愮ず", {
confirmButtonText: "纭畾",
cancelButtonText: "鍙栨秷",
type: "warning",
})
- .then(async () => {
- await deleteWcsDevice(row);
- handleQuery();
- ElMessage.success("鍒犻櫎鎴愬姛");
- })
- .catch(() => {});
- };
+ .then(async () => {
+ await deleteWcsDevice(row);
+ handleQuery();
+ ElMessage.success("鍒犻櫎鎴愬姛");
+ })
+ .catch(() => { });
+};
- // 鏀瑰彉椤甸潰瀹归噺
- const handleSizeChange = (val: number) => {
- tableParams.value.pageSize = val;
- handleQuery();
- };
-
- // 鏀瑰彉椤电爜搴忓彿
- const handleCurrentChange = (val: number) => {
- tableParams.value.page = val;
- handleQuery();
- };
-
- const wcsPlcPlcIdDropdownList = ref<any>([]);
- const getWcsPlcPlcIdDropdownList = async () => {
- let list = await getWcsPlcPlcIdDropdown();
- wcsPlcPlcIdDropdownList.value = list.data.result ?? [];
- };
- getWcsPlcPlcIdDropdownList();
-
+// 鏀瑰彉椤甸潰瀹归噺
+const handleSizeChange = (val: number) => {
+ tableParams.value.pageSize = val;
handleQuery();
+};
+
+// 鏀瑰彉椤电爜搴忓彿
+const handleCurrentChange = (val: number) => {
+ tableParams.value.page = val;
+ handleQuery();
+};
+
+const wcsPlcPlcIdDropdownList = ref<any>([]);
+const getWcsPlcPlcIdDropdownList = async () => {
+ let list = await getWcsPlcPlcIdDropdown();
+ wcsPlcPlcIdDropdownList.value = list.data.result ?? [];
+};
+getWcsPlcPlcIdDropdownList();
+
+handleQuery();
</script>
<style scoped>
:deep(.el-input),
:deep(.el-select),
:deep(.el-input-number) {
- width: 100%;
+ width: 100%;
}
</style>
-
--
Gitblit v1.8.0