Commit 1f821432 by huangqy

111

parent 3f9198d7
...@@ -63,202 +63,80 @@ ...@@ -63,202 +63,80 @@
</el-card> </el-card>
</el-tab-pane> </el-tab-pane>
<el-tab-pane> <el-tab-pane>
<template #label>
<span class="card-title">通道配置</span>
</template>
<el-card style="height: calc(100vh - 227.75px)"> <el-card style="height: calc(100vh - 227.75px)">
<div class="head-container"> <div class="head-container">
<el-button class="filter-item" type="primary" style="float: right" @click="add">新增</el-button> <el-button class="filter-item" type="primary" style="float: right" @click="add">新增</el-button>
</div> </div>
<el-table :header-cell-style="{backgroundColor: '#f5f7fa',color: '#000',fontSize: '18px',fontWeight: '600'}" :data="channelList" border style="width: 100%;">
<el-table-column prop="stationId" label="通道号" align="center" width="100"/>
<el-divider><span style="font-size: 20px">库房/ip配置</span></el-divider> <el-table-column label="通道模式" align="center">
<div class="head-container"> <template #default="scope">
<el-button {{scope.row.type == 'IN' ? '入库' : '出库' }}
class="filter-item" </template>
type="primary" </el-table-column>
style="float: right" <el-table-column prop="readerIp" label="读写器" align="center">
@click="addConfig" <template #default="scope">
>新增</el-button {{scope.row.readerIp + ':' + scope.row.readerPort }}
> </template>
</div> </el-table-column>
<el-table <el-table-column prop="gpioIp" label="GPIO" align="center">
:header-cell-style="{ <template #default="scope">
backgroundColor: '#f5f7fa', {{scope.row.gpioIp + ':' + scope.row.gpioPort }}
color: '#000', </template>
fontSize: '18px', </el-table-column>
fontWeight: '600', <el-table-column label="1号显示屏" align="center">
}" <template #default="scope">
:data="configList" {{scope.row.ledIp1 + ':' + scope.row.ledPort1 }}
border </template>
style="width: 100%" </el-table-column>
> <el-table-column label="2号显示屏" align="center">
<el-table-column <template #default="scope">
type="index" {{scope.row.ledIp2 + ':' + scope.row.ledPort2 }}
label="序号" </template>
align="center" </el-table-column>
width="70" <el-table-column label="操作" width="200" align="center">
/> <template #default="scope">
<el-table-column prop="storeCode" label="库房代码" align="center" /> <el-button type="primary" size="small" @click="edit(scope.row)">编辑</el-button>
<el-table-column prop="serverIp" label="服务器IP" align="center" /> <el-popconfirm title="你确定删除吗?" @confirm="removeDevice(scope.row)">
<el-table-column <template #reference>
prop="serverPort" <el-button type="danger" size="small">删除</el-button>
label="服务器端口" </template>
align="center" </el-popconfirm>
/> </template>
<el-table-column </el-table-column>
prop="masterIp" </el-table>
label="物理主机IP" </el-card>
align="center" </el-tab-pane>
/> </el-tabs>
<el-table-column label="操作" width="200" align="center">
<template #default="scope"> <el-dialog v-model="visible" width="30%" :title="title" @close="closeConfig">
<el-button <el-form label-position="right" size="large" label-width="90px" :model="configForm" :rules="rules" ref="storeIp">
type="primary" <el-form-item label="库房代码">
size="small" <el-input v-model="configForm.storeCode" placeholder="请输入库房代码"/>
@click="editConfig(scope.row)" </el-form-item>
>编辑</el-button <el-form-item label="服务器IP" prop="serverIp">
> <el-input v-model="configForm.serverIp" placeholder="请输入服务器IP"/>
<el-popconfirm </el-form-item>
title="你确定删除吗?" <el-form-item label="服务器端口" prop="serverPort">
@confirm="removeConfig(scope.row)" <el-input v-model="configForm.serverPort" placeholder="请输入服务器端口"/>
> </el-form-item>
<template #reference> <el-form-item label="物理主机IP" prop="masterIp">
<el-button type="danger" size="small">删除</el-button> <el-input v-model="configForm.masterIp" placeholder="请输入物理主机IP"/>
</template> </el-form-item>
</el-popconfirm> </el-form>
</template> <template #footer>
</el-table-column> <div class="dialog-footer">
</el-table> <el-button @click="visible = false" size="large">关闭</el-button>
</el-card> <el-button type="primary" @click="submitConfig" size="large">提交</el-button>
</el-tab-pane> </div>
<el-tab-pane label="通道配置"> </template>
<el-card style="height: calc(100vh - 227.75px)"> </el-dialog>
<div class="head-container">
<el-button <el-dialog v-model="innerVisible" width="38%" :title="title">
class="filter-item" <el-form label-position="right" size="large" label-width="120px" :model="formData">
type="primary"
style="float: right"
@click="add"
>新增</el-button
>
</div>
<el-table
:header-cell-style="{
backgroundColor: '#f5f7fa',
color: '#000',
fontSize: '18px',
fontWeight: '600',
}"
:data="channelList"
border
style="width: 100%"
>
<el-table-column
prop="stationId"
label="通道号"
align="center"
width="100"
/>
<el-table-column label="通道模式" align="center">
<template #default="scope">
{{ scope.row.type == "IN" ? "入库" : "出库" }}
</template>
</el-table-column>
<el-table-column prop="readerIp" label="读写器" align="center">
<template #default="scope">
{{ scope.row.readerIp + ":" + scope.row.readerPort }}
</template>
</el-table-column>
<el-table-column prop="gpioIp" label="GPIO" align="center">
<template #default="scope">
{{ scope.row.gpioIp + ":" + scope.row.gpioPort }}
</template>
</el-table-column>
<el-table-column label="1号显示屏" align="center">
<template #default="scope">
{{ scope.row.ledIp1 + ":" + scope.row.ledPort1 }}
</template>
</el-table-column>
<el-table-column label="2号显示屏" align="center">
<template #default="scope">
{{ scope.row.ledIp2 + ":" + scope.row.ledPort2 }}
</template>
</el-table-column>
<el-table-column label="操作" width="200" align="center">
<template #default="scope">
<el-button type="primary" size="small" @click="edit(scope.row)"
>编辑</el-button
>
<el-popconfirm
title="你确定删除吗?"
@confirm="removeDevice(scope.row)"
>
<template #reference>
<el-button type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
</el-card>
</el-tab-pane>
</el-tabs>
<el-dialog
v-model="visible"
width="30%"
:title="title"
@close="closeConfig"
>
<el-form
label-position="right"
size="large"
label-width="90px"
:model="configForm"
:rules="rules"
ref="storeIp"
>
<el-form-item label="库房代码">
<el-input
v-model="configForm.storeCode"
placeholder="请输入库房代码"
/>
</el-form-item>
<el-form-item label="服务器IP" prop="serverIp">
<el-input
v-model="configForm.serverIp"
placeholder="请输入服务器IP"
/>
</el-form-item>
<el-form-item label="服务器端口" prop="serverPort">
<el-input
v-model="configForm.serverPort"
placeholder="请输入服务器端口"
/>
</el-form-item>
<el-form-item label="物理主机IP" prop="masterIp">
<el-input
v-model="configForm.masterIp"
placeholder="请输入物理主机IP"
/>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false" size="large">关闭</el-button>
<el-button type="primary" @click="submitConfig" size="large"
>提交</el-button
>
</div>
</template>
</el-dialog>
<el-dialog v-model="innerVisible" width="38%" :title="title">
<el-form
label-position="right"
size="large"
label-width="120px"
:model="formData"
>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="通道号"> <el-form-item label="通道号">
...@@ -267,58 +145,55 @@ ...@@ -267,58 +145,55 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="通道模式"> <el-form-item label="通道模式">
<el-select v-model="formData.type" style="width: 100%"> <el-select v-model="formData.type" style="width: 100%;">
<el-option value="IN" label="入库模式"></el-option> <el-option value="IN" label="入库模式"></el-option>
<el-option value="OUT" label="出库模式"></el-option> <el-option value="OUT" label="出库模式"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="读写器IP"> <el-form-item label="读写器IP">
<el-input v-model="formData.readerIp" /> <el-input v-model="formData.readerIp"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="读写器端口"> <el-form-item label="读写器端口">
<el-input v-model="formData.readerPort" /> <el-input v-model="formData.readerPort"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-form-item label="读写器类型"> <el-form-item label="读写器类型">
<el-select v-model="formData.readerType" style="width: 100%"> <el-select v-model="formData.readerType" style="width: 100%;">
<el-option :value="4" label="四通道"></el-option> <el-option :value="4" label="四通道"></el-option>
<el-option :value="8" label="八通道"></el-option> <el-option :value="8" label="八通道"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="天线功率"> <el-form-item label="天线功率">
<el-input <el-input v-model="formData.readerPower" placeholder="四通道格式为10,10,10,10,范围为0-30之间。8通道同理"/>
v-model="formData.readerPower"
placeholder="四通道格式为10,10,10,10,范围为0-30之间。8通道同理"
/>
</el-form-item> </el-form-item>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="GPIO的IP"> <el-form-item label="GPIO的IP">
<el-input v-model="formData.gpioIp" /> <el-input v-model="formData.gpioIp"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="GPIO端口"> <el-form-item label="GPIO端口">
<el-input v-model="formData.gpioPort" /> <el-input v-model="formData.gpioPort"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="1号显示屏IP"> <el-form-item label="1号显示屏IP">
<el-input v-model="formData.ledIp1" /> <el-input v-model="formData.ledIp1"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="1号显示屏端口"> <el-form-item label="1号显示屏端口">
<el-input v-model="formData.ledPort1" /> <el-input v-model="formData.ledPort1"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -326,12 +201,12 @@ ...@@ -326,12 +201,12 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="2号显示屏IP"> <el-form-item label="2号显示屏IP">
<el-input v-model="formData.ledIp2" /> <el-input v-model="formData.ledIp2"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="2号显示屏端口"> <el-form-item label="2号显示屏端口">
<el-input v-model="formData.ledPort2" /> <el-input v-model="formData.ledPort2"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -339,253 +214,228 @@ ...@@ -339,253 +214,228 @@
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="innerVisible = false" size="large">关闭</el-button> <el-button @click="innerVisible = false" size="large">关闭</el-button>
<el-button type="primary" @click="handleSubmit" size="large" <el-button type="primary" @click="handleSubmit" size="large">提交</el-button>
>提交</el-button
>
</div> </div>
</template> </template>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { import { defineComponent, ref, getCurrentInstance, toRefs, reactive } from 'vue'
defineComponent, import { postAction, getAction } from '@/api/manage'
ref, import { ElMessage } from 'element-plus'
getCurrentInstance,
toRefs,
reactive,
} from "vue";
import { postAction, getAction } from "@/api/manage";
import { ElMessage } from "element-plus";
export default defineComponent({ export default defineComponent({
setup() { setup() {
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance()
const configList = ref([]); const configList = ref([])
const channelList = ref([]); const channelList = ref([])
const title = ref(""); const title = ref('')
const sysForm = ref({}); const sysForm = ref({})
const configForm = ref({}); const configForm = ref({})
const formData = ref({}); const formData = ref({})
const visible = ref(false); const visible = ref(false)
const innerVisible = ref(false); const innerVisible = ref(false)
// ip正则表达式 // ip正则表达式
function isIp(str) { function isIp(str) {
const reg = const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
/^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/; return reg.test(str)
return reg.test(str);
} }
// ip校验 // ip校验
const validateIp = (rule, value, callback) => { const validateIp = (rule, value, callback) => {
if (!value) { if (!value) {
callback(new Error("请输入Ip")); callback(new Error('请输入Ip'))
} else if (!isIp(value)) { } else if (!isIp(value)) {
callback(new Error("ip格式不正确")); callback(new Error('ip格式不正确'))
} else { } else {
callback(); callback()
} }
}; }
// port校验 // port校验
const validatePort = (rule, value, callback) => { const validatePort = (rule, value, callback) => {
if (!value) { if (!value) {
callback(new Error("请输入端口")); callback(new Error('请输入端口'))
} else if (isNaN(value)) { } else if (isNaN(value)) {
callback(new Error("请输入数字值")); callback(new Error('请输入数字值'));
} else if (value < 0 || value > 65535) { } else if(value < 0 || value > 65535 ) {
callback(new Error("端口范围在(0-65535)")); callback(new Error('端口范围在(0-65535)'))
} else { } else {
callback(); callback()
} }
}; }
const rules = reactive({ const rules = reactive({
serverIp: [{ validator: validateIp, trigger: "blur" }], serverIp: [{ validator: validateIp, trigger: 'blur' }],
serverPort: [{ validator: validatePort, trigger: "blur" }], serverPort: [{ validator: validatePort, trigger: 'blur' }],
masterIp: [{ validator: validateIp, trigger: "blur" }], masterIp: [{ validator: validateIp, trigger: 'blur' }]
}); })
const state = reactive({ const state = reactive({
url: { url: {
getStoreCode: "/config/getStoreCode", getStoreCode: '/config/getStoreCode',
getConfig: "/config/getConfig", getConfig: '/config/getConfig',
getConfigPage: "/config/getConfigPage", getConfigPage: '/config/getConfigPage',
updateConfig: "/config/updateConfig", updateConfig: '/config/updateConfig',
saveConfig: "/config/saveConfig", saveConfig: '/config/saveConfig',
removeConfig: "/config/removeConfig", removeConfig: '/config/removeConfig',
getDevice: "/device/getDevice", getDevice: '/device/getDevice',
updateDevice: "/device/updateDevice", updateDevice: '/device/updateDevice',
removeDevice: "/device/removeDevice", removeDevice: '/device/removeDevice',
saveDevice: "/device/saveDevice", saveDevice: '/device/saveDevice',
syncGoods: "/platform/syncGoods",
syncGoods: '/platform/syncGoods'
}, },
}); });
const loadData = (arg) => { const loadData = (arg) => {
getConfigPage(); getConfigPage()
getDevice(); getDevice()
resetConfig(); resetConfig()
}; }
function getConfigPage() { function getConfigPage() {
postAction(state.url.getConfigPage, {}).then((res) => { postAction(state.url.getConfigPage, {}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
configList.value = res.data.records; configList.value = res.data.records
}); })
} }
function addConfig() { function addConfig() {
title.value = "新增"; title.value = '新增'
visible.value = true; visible.value = true
} }
function editConfig(row) { function editConfig(row) {
title.value = "编辑"; title.value = '编辑'
configForm.value = JSON.parse(JSON.stringify(row)); configForm.value = JSON.parse(JSON.stringify(row))
visible.value = true; visible.value = true
} }
function submitConfig() { function submitConfig() {
let url = configForm.value.id let url = configForm.value.id ? state.url.updateConfig : state.url.saveConfig
? state.url.updateConfig
: state.url.saveConfig;
proxy.$refs.storeIp.validate((valid) => { proxy.$refs.storeIp.validate((valid) => {
if (!valid) { if (!valid) {
ElMessage.warning("请正确填写信息"); ElMessage.warning('请正确填写信息')
} else { } else {
postAction(url, configForm.value).then((res) => { postAction(url, configForm.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
configForm.value = {}; configForm.value = {}
visible.value = false; visible.value = false
getConfigPage(); getConfigPage()
}); })
} }
}); })
} }
function closeConfig() { function closeConfig() {
configForm.value = {}; configForm.value = {}
} }
function removeConfig(row) { function removeConfig(row) {
postAction(state.url.removeConfig, { id: row.id }).then((res) => { postAction(state.url.removeConfig, { id: row.id}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
getConfigPage(); getConfigPage()
}); })
} }
function getDevice() { function getDevice() {
if (!sessionStorage.getItem("storeInfo")) return; if (!sessionStorage.getItem('storeInfo')) return;
postAction(state.url.getDevice, { postAction(state.url.getDevice, {storeCode: JSON.parse(sessionStorage.getItem('storeInfo')).storeCode}).then(res => {
storeCode: JSON.parse(sessionStorage.getItem("storeInfo")).storeCode,
}).then((res) => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
channelList.value = res.data; channelList.value = res.data
}); })
} }
function resetConfig() { function resetConfig() {
getAction(state.url.getStoreCode).then((res) => { getAction(state.url.getStoreCode).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
postAction(state.url.getConfig, { storeCode: res.data }).then((res) => { postAction(state.url.getConfig, {storeCode: res.data}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
if (res.data.length > 0) { if (res.data.length > 0) {
sysForm.value = JSON.parse(JSON.stringify(res.data[0])); sysForm.value = JSON.parse(JSON.stringify(res.data[0]))
sysForm.value.isHide = JSON.parse( sysForm.value.isHide = JSON.parse(sessionStorage.getItem('storeInfo')).isHide
sessionStorage.getItem("storeInfo")
).isHide;
} }
}); })
}); })
} }
function syncGoods() { function syncGoods() {
getAction(state.url.syncGoods).then((res) => { getAction(state.url.syncGoods).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
}); })
} }
function saveConfig() { function saveConfig() {
let url = sysForm.value.id let url = sysForm.value.id ? state.url.updateConfig : state.url.saveConfig
? state.url.updateConfig
: state.url.saveConfig;
if (!sysForm.value.storeCode) { if (!sysForm.value.storeCode) {
return ElMessage.warning("库房编号不能为空"); return ElMessage.warning('库房编号不能为空')
} }
if (!sysForm.value.serverIp) { if (!sysForm.value.serverIp) {
return ElMessage.warning("服务器IP不能为空"); return ElMessage.warning('服务器IP不能为空')
} }
if (!sysForm.value.serverPort) { if (!sysForm.value.serverPort) {
return ElMessage.warning("端口不能为空"); return ElMessage.warning('端口不能为空')
} }
postAction(url, sysForm.value).then((res) => { postAction(url, sysForm.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
sessionStorage.setItem("storeInfo", JSON.stringify(sysForm.value)); sessionStorage.setItem('storeInfo', JSON.stringify(sysForm.value))
}); })
} }
function edit(row) { function edit(row) {
title.value = "编辑通道"; title.value = '编辑通道'
formData.value = JSON.parse(JSON.stringify(row)); formData.value = JSON.parse(JSON.stringify(row))
innerVisible.value = true; innerVisible.value = true
} }
function add() { function add() {
title.value = "新增通道"; title.value = '新增通道'
innerVisible.value = true; innerVisible.value = true
} }
function handleSubmit() { function handleSubmit() {
let url = formData.value.id let url = formData.value.id ? state.url.updateDevice : state.url.saveDevice
? state.url.updateDevice formData.value.storeCode = JSON.parse(sessionStorage.getItem('storeInfo')).storeCode
: state.url.saveDevice; postAction(url, formData.value).then(res => {
formData.value.storeCode = JSON.parse(
sessionStorage.getItem("storeInfo")
).storeCode;
postAction(url, formData.value).then((res) => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
formData.value = {}; formData.value = {}
innerVisible.value = false; innerVisible.value = false
getDevice(); getDevice()
}); })
} }
function removeDevice(row) { function removeDevice(row) {
postAction(state.url.removeDevice, { postAction(state.url.removeDevice, {stationId: row.stationId, id: row.id}).then(res => {
stationId: row.stationId,
id: row.id,
}).then((res) => {
if (res.code !== 99200) return ElMessage.error(res.message); if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message); ElMessage.success(res.message)
getDevice(); getDevice()
}); })
} }
function handleCommand(command) { function handleCommand(command) {
if (command === "#223170") { if (command === '#223170') { // 藏蓝
// 藏蓝 sessionStorage.setItem('bgColor', '#223170')
sessionStorage.setItem("bgColor", "#223170");
} }
if (command === "#025799") { if (command === '#025799') { // 蓝色
// 蓝色 sessionStorage.setItem('bgColor', '#025799')
sessionStorage.setItem("bgColor", "#025799");
} }
if (command === "#1f8a36") { if (command === '#1f8a36') { // 军绿
// 军绿 sessionStorage.setItem('bgColor', '#1f8a36')
sessionStorage.setItem("bgColor", "#1f8a36");
} }
window.location.reload(); window.location.reload()
} }
return { return {
...toRefs(state), ...toRefs(state),
sysForm, sysForm,
...@@ -615,8 +465,8 @@ export default defineComponent({ ...@@ -615,8 +465,8 @@ export default defineComponent({
getDevice, getDevice,
syncGoods, syncGoods,
getConfigPage, getConfigPage,
handleCommand, handleCommand
}; }
}, },
}); })
</script> </script>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论