Skip to content

P
pmk-channel-vue
Commit b039d4b1 by Your Name
Options

提交一下

parent 82ee9e25
正在显示 包含 656 行增加 和 135 行删除
default.md 0 → 100644
差异被折叠。 点击展开。
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>平面库射频通道</title>
</head>
<script>
window._CONFIG = {};
window._CONFIG['publicURL'] = 'http://192.168.3.130:10030';
window._CONFIG['wsURL'] = 'ws://192.168.3.130:10030/notice/'
</script>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>平面库射频通道</title>
</head>
<script>
window._CONFIG = {};
window._CONFIG['publicURL'] = 'http://192.168.3.130:10060';
window._CONFIG['wsURL'] = 'ws://192.168.3.130:10060/notice/'
</script>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>
\ No newline at end of file
src/views/BasicData.vue 0 → 100644
<template>
<div class="basic-data-container">
<el-card class="card-container">
<template #header>
<div class="card-header">
<span>基础信息</span>
</div>
</template>
<div class="content-wrapper">
<!-- 同步按钮区域 -->
<div class="head-container" style="margin-bottom: 10px;">
<el-button type="primary" @click="handleSync" :loading="syncLoading">
<el-icon>
<Refresh />
</el-icon>
同步基础数据
</el-button>
</div>
<!-- 搜索表单 -->
<el-form :model="searchForm" :inline="true" style="margin-bottom: 10px;">
<el-form-item label="品名名称">
<el-input v-model="searchForm.goodsName" placeholder="请输入品名名称" clearable style="width: 200px;" />
</el-form-item>
<!-- <el-form-item label="品名编码">
<el-input v-model="searchForm.goodsCode" placeholder="请输入品名编码" clearable style="width: 200px;" />
</el-form-item> -->
<el-form-item label="号型名称">
<el-input v-model="searchForm.modelName" placeholder="请输入号型名称" clearable style="width: 200px;" />
</el-form-item>
<!-- <el-form-item label="号型编码">
<el-input v-model="searchForm.modelCode" placeholder="请输入号型编码" clearable style="width: 200px;" />
</el-form-item> -->
<el-form-item>
<el-button type="primary" @click="handleSearch">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</el-form-item>
</el-form>
<!-- 表格容器 -->
<div class="table-wrapper">
<el-table
:header-cell-style="{ backgroundColor: '#f5f7fa', color: '#000', fontSize: '16px', fontWeight: '600' }"
:data="tableData" border style="width: 100%;" height="100%">
<el-table-column type="index" label="序号" align="center" width="70" />
<el-table-column prop="goodsName" label="品名名称" align="center" min-width="150" />
<el-table-column prop="goodsCode" label="品名编码" align="center" min-width="120" />
<el-table-column prop="modelName" label="号型名称" align="center" min-width="120" />
<el-table-column prop="modelCode" label="号型编码" align="center" min-width="150" />
<el-table-column prop="skuCode" label="SKU编码" align="center" min-width="140" />
<el-table-column prop="jldw" label="计量单位" align="center" min-width="100" />
<el-table-column prop="boxNum" label="箱数" align="center" min-width="80" />
</el-table>
</div>
<!-- 分页固定在底部 -->
<div class="pagination-wrapper">
<el-pagination v-model:current-page="pagination.current" v-model:page-size="pagination.size"
:page-sizes="[10, 20, 50, 100]" :total="pagination.total" layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange" @current-change="handleCurrentChange" />
</div>
</div>
</el-card>
</div>
</template>
<script>
import { defineComponent, ref, reactive, onMounted } from 'vue'
import { getAction } from '@/api/manage'
import { ElMessage, ElMessageBox } from 'element-plus'
import { Refresh } from '@element-plus/icons-vue'
export default defineComponent({
name: 'BasicData',
components: {
Refresh
},
setup() {
// 搜索表单
const searchForm = reactive({
goodsCode: '',
goodsName: '',
modelName: '',
modelCode: ''
})
// 表格数据
const tableData = ref([])
// 同步按钮loading状态
const syncLoading = ref(false)
// 分页配置
const pagination = reactive({
current: 1,
size: 10,
total: 0
})
// API URL配置
const apiUrl = reactive({
page: '/goodsInfo/goodsInfo/page',
sync: '/platform/syncGoods'
})
// 加载数据
const loadData = () => {
const params = {
pageNo: pagination.current,
pageSize: pagination.size
}
// 添加搜索条件
if (searchForm.goodsCode) {
params.goodsCode = searchForm.goodsCode
}
if (searchForm.goodsName) {
params.goodsName = searchForm.goodsName
}
if (searchForm.modelName) {
params.modelName = searchForm.modelName
}
if (searchForm.modelCode) {
params.modelCode = searchForm.modelCode
}
getAction(apiUrl.page, params).then(res => {
// 根据实际返回数据，成功状态码为99200
if (res.code !== 99200) {
ElMessage.error(res.message || '数据加载失败')
return
}
tableData.value = res.data?.records || []
pagination.total = parseInt(res.data?.totalRows) || 0
}).catch(error => {
ElMessage.error('数据加载失败')
console.error('Load data error:', error)
})
}
// 搜索
const handleSearch = () => {
pagination.current = 1
loadData()
}
// 重置搜索
const handleReset = () => {
searchForm.goodsCode = ''
searchForm.goodsName = ''
searchForm.modelName = ''
searchForm.modelCode = ''
handleSearch()
}
// 分页大小改变
const handleSizeChange = (val) => {
pagination.size = val
pagination.current = 1
loadData()
}
// 页码改变
const handleCurrentChange = (val) => {
pagination.current = val
loadData()
}
// 同步商品数据
const handleSync = () => {
syncLoading.value = true
getAction(apiUrl.sync).then(res => {
if (res.code !== 99200) {
ElMessage.error(res.message || '同步失败')
return
}
ElMessage.success('同步成功')
// 同步成功后刷新数据
loadData()
}).catch(error => {
ElMessage.error('同步失败')
console.error('Sync error:', error)
}).finally(() => {
syncLoading.value = false
})
}
// 初始化
onMounted(() => {
loadData()
})
return {
searchForm,
tableData,
pagination,
syncLoading,
loadData,
handleSearch,
handleReset,
handleSizeChange,
handleCurrentChange,
handleSync
}
}
})
</script>
<style scoped lang="scss">
.basic-data-container {
height: 100%;
.card-container {
height: calc(100vh - 147px);
:deep(.el-card__body) {
height: calc(100% - 55px);
padding: 20px;
display: flex;
flex-direction: column;
}
}
.content-wrapper {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
}
.head-container {
flex-shrink: 0;
display: flex;
margin-bottom: 10px;
}
.el-form {
flex-shrink: 0;
}
.table-wrapper {
flex: 1;
overflow: hidden;
min-height: 0;
margin-bottom: 16px;
:deep(.el-table) {
height: 100%;
.el-table__body-wrapper {
overflow-y: auto;
}
}
}
.pagination-wrapper {
flex-shrink: 0;
padding: 12px 0 0 0;
background-color: #fff;
border-top: 1px solid #ebeef5;
display: flex;
justify-content: flex-end;
}
}
.head-container {
display: flex;
}
:deep(.el-input-number .el-input__inner) {
text-align: left;
}
.card-header {
height: 26px;
font-size: 20px;
font-weight: bold;
font-family: 'Times New Roman', Times, serif;
display: flex;
justify-content: space-between;
align-items: center;
}
</style>
\ No newline at end of file
src/views/HomeView.vue
<template>
<el-tabs :tab-position="tabPosition" v-model="activeIndex" type="card" :stretch="true" class="menu-tabs" @tab-change="tabChange" :style="{backgroundColor: color}">
<el-tab-pane v-for="item in tabList" :key="item.title">
<template #label>
<span class="custom-tabs-label">
<i :class="item.icon" style="font-size: 24px;margin-right: 10px;color: #fff;"></i>
<span class="tabfont">{{item.title}}</span>
</span>
</template>
<component :is="item.template" :ref="item.template" @refresh="handleRefresh" @logChange="handleLogChange" @changeTab="handleChangeTab"></component>
</el-tab-pane>
<el-card>
<!-- class="log-scroll" -->
<div v-html="log" style="font-weight: 550;font-family: Times New Roman;display: flex;align-items: center;"></div>
</el-card>
</el-tabs>
<el-tabs :tab-position="tabPosition" v-model="activeIndex" type="card" :stretch="true" class="menu-tabs"
@tab-change="tabChange" :style="{ backgroundColor: color }">
<el-tab-pane v-for="item in tabList" :key="item.title">
<template #label>
<span class="custom-tabs-label">
<i :class="item.icon" style="font-size: 24px;margin-right: 10px;color: #fff;"></i>
<span class="tabfont">{{ item.title }}</span>
</span>
</template>
<component :is="item.template" :ref="item.template" @refresh="handleRefresh" @logChange="handleLogChange"
@changeTab="handleChangeTab"></component>
</el-tab-pane>
<el-card>
<!-- class="log-scroll" -->
<div v-html="log" style="font-weight: 550;font-family: Times New Roman;display: flex;align-items: center;"></div>
</el-card>
</el-tabs>
</template>
<script>
......@@ -25,125 +27,129 @@ import Query from './Query.vue'
import Setting from './Setting.vue'
import ChannelSetting from './ChannelSetting.vue'
import NoOrder from './NoOrder.vue'
import BasicData from './BasicData.vue'
export default defineComponent({
components: { RFID, InTask, OutTask, Query, Setting, ChannelSetting, NoOrder },
setup() {
const { proxy } = getCurrentInstance()
const tabPosition = ref('bottom')
const log = ref('')
const activeIndex = ref('0')
const color = ref('#1f8a36')
const tabList = [
{title: '射频识别', icon: 'iconfont icon-tiaozhishibie', template: 'RFID'},
{title: '入库作业', icon: 'iconfont icon-rukuguanli-', template: 'InTask'},
{title: '出库作业', icon: 'iconfont icon-chukuguanli-', template: 'OutTask'},
// {title: '手动设置', icon: 'iconfont icon-shezhi', template: 'Setting'},
{title: '无单据上报', icon: 'iconfont icon-tiaozhishibie', template: 'NoOrder'},
{title: '查询', icon: 'iconfont icon-chaxun', template: 'Query'},
{title: '通道配置', icon: 'iconfont icon-shezhi', template: 'ChannelSetting'},
]
if (sessionStorage.getItem('bgColor')) {
color.value = sessionStorage.getItem('bgColor')
} else {
sessionStorage.setItem('bgColor', '#1f8a36')
}
onMounted(() => {
setTimeout(()=> {
changeBg()
}, 200)
});
function changeBg() {
for(var i =0;i< document.getElementsByClassName('el-card__header').length; i++){
document.getElementsByClassName('el-card__header')[i].style.backgroundColor = color.value
}
}
function tabChange(index) {
if (index == 0) {
return
}
proxy.$refs[tabList[index].template][0].loadData()
}
function handleRefresh() {
console.log('刷新起点')
setTimeout(() => {
proxy.$refs.InTask[0].loadData()
proxy.$refs.OutTask[0].loadData()
proxy.$refs.NoOrder[0].getTableData()
}, 500)
}
function handleLogChange(data) {
log.value = data
}
function handleChangeTab() {
activeIndex.value = '5'
}
return {
activeIndex,
tabPosition,
tabList,
log,
color,
tabChange,
handleRefresh,
handleLogChange,
handleChangeTab
}
},
components: { RFID, InTask, OutTask, Query, Setting, ChannelSetting, NoOrder, BasicData },
setup() {
const { proxy } = getCurrentInstance()
const tabPosition = ref('bottom')
const log = ref('')
const activeIndex = ref('0')
const color = ref('#1f8a36')
const tabList = [
{ title: '射频识别', icon: 'iconfont icon-tiaozhishibie', template: 'RFID' },
// {title: '入库作业', icon: 'iconfont icon-rukuguanli-', template: 'InTask'},
// {title: '出库作业', icon: 'iconfont icon-chukuguanli-', template: 'OutTask'},
{ title: '手动设置', icon: 'iconfont icon-shezhi', template: 'Setting' },
// {title: '无单据上报', icon: 'iconfont icon-tiaozhishibie', template: 'NoOrder'},
{ title: '查询', icon: 'iconfont icon-chaxun', template: 'Query' },
{ title: '通道配置', icon: 'iconfont icon-shezhi', template: 'ChannelSetting' },
{ title: '基础信息', icon: 'iconfont icon-tiaozhishibie', template: 'BasicData' },
]
if (sessionStorage.getItem('bgColor')) {
color.value = sessionStorage.getItem('bgColor')
} else {
sessionStorage.setItem('bgColor', '#1f8a36')
}
onMounted(() => {
setTimeout(() => {
changeBg()
}, 200)
});
function changeBg() {
for (var i = 0; i < document.getElementsByClassName('el-card__header').length; i++) {
document.getElementsByClassName('el-card__header')[i].style.backgroundColor = color.value
}
}
function tabChange(index) {
if (index == 0) {
return
}
proxy.$refs[tabList[index].template][0].loadData()
}
function handleRefresh() {
console.log('刷新起点')
setTimeout(() => {
proxy.$refs.InTask[0].loadData()
proxy.$refs.OutTask[0].loadData()
proxy.$refs.NoOrder[0].getTableData()
}, 500)
}
function handleLogChange(data) {
log.value = data
}
function handleChangeTab() {
activeIndex.value = '5'
}
return {
activeIndex,
tabPosition,
tabList,
log,
color,
tabChange,
handleRefresh,
handleLogChange,
handleChangeTab
}
},
})
</script>
<style scope>
.tabfont {
font-family: '微软雅黑';
font-size: 30px;
font-weight: 550;
color: aliceblue;
font-family: '微软雅黑';
font-size: 30px;
font-weight: 550;
color: aliceblue;
}
.log-scroll {
display: inline-block;
white-space: nowrap;
animation: scroll 20s linear infinite;
display: inline-block;
white-space: nowrap;
animation: scroll 20s linear infinite;
}
@keyframes scroll {
0% {
transform: translateX(100%);
}
100% {
transform: translateX(0%);
}
}
0% {
transform: translateX(100%);
}
.red{
width: 10px;
height: 10px;
border-radius: 50%;
background: red;
margin: 0 10px 0 10px;
100% {
transform: translateX(0%);
}
}
.green{
width: 10px;
height: 10px;
border-radius: 50%;
background: green;
margin: 0 10px 0 10px;
.red {
width: 10px;
height: 10px;
border-radius: 50%;
background: red;
margin: 0 10px 0 10px;
}
.gray{
width: 10px;
height: 10px;
border-radius: 50%;
background: gray;
margin: 0 10px 0 10px;
.green {
width: 10px;
height: 10px;
border-radius: 50%;
background: green;
margin: 0 10px 0 10px;
}
.gray {
width: 10px;
height: 10px;
border-radius: 50%;
background: gray;
margin: 0 10px 0 10px;
}
</style>
src/views/Setting copy.vue 0 → 100644
<template>
<el-row>
<el-col :span="6">
<el-card style="height: calc(100vh - 147px);">
<el-form label-position="right" size="large" label-width="100px" :model="formData" style="max-width: 460px;">
<el-form-item label="通道">
<el-select v-model="formData.stationId" style="width: 100%;" filterable placeholder="请选择通道"
@change="changeStation">
<el-option v-for="item in bindList" :key="item.stationId" :label="item.stationId"
:value="item.stationId" />
</el-select>
</el-form-item>
<el-form-item label="单号">
<el-select v-model="formData.billNo" style="width: 100%;" filterable clearable placeholder="请选择单号"
@change="changeBill">
<el-option v-for="item in billList" :key="item.billNo" :label="item.billName" :value="item.billNo" />
</el-select>
</el-form-item>
<el-form-item label="品名">
<el-select v-model="formData.goodsCode" style="width: 100%;" filterable clearable placeholder="请选择品名"
@change="changeGoods">
<el-option v-for="item in goodsList" :key="item.goodsCode" :label="item.goodsName"
:value="item.goodsCode" />
</el-select>
</el-form-item>
<el-form-item label="号型">
<el-select v-model="formData.modelCode" style="width: 100%;" filterable clearable placeholder="请选择号型"
@change="changeModel">
<el-option v-for="item in modelList" :key="item.modelCode" :label="item.modelName"
:value="item.modelCode" />
</el-select>
</el-form-item>
<el-form-item label="单包数量">
<el-input-number v-model="formData.amount" :min="0" :precision="0" style="width: 100%;" />
</el-form-item>
<div style="text-align: center;">
<el-button round type="success" @click="automatic" style="width: 45%">自动</el-button>
<el-button round type="primary" @click="manual" style="width: 45%">手动</el-button>
</div>
</el-form>
</el-card>
</el-col>
<el-col :span="18">
<el-card style="height: calc(100vh - 147px);">
<el-table :header-cell-style="{ backgroundColor: '#f5f7fa', color: '#000', fontSize: '18px', fontWeight: '600' }"
:data="bindList" border size="large" style="width: 100%;">
<el-table-column type="index" label="序号" width="70" align="center" />
<el-table-column prop="stationId" label="通道号" align="center" />
<el-table-column prop="state" label="状态" align="center">
<template #default="scope">
{{ scope.row.state === 0 ? '自动' : scope.row.state === 1 ? '手动' : '' }}
</template>
</el-table-column>
<el-table-column prop="billName" label="单号" align="center" />
<el-table-column prop="goodsName" label="品名" align="center" />
<el-table-column prop="modelName" label="号型" align="center" />
<el-table-column prop="amount" label="数量" align="center" />
</el-table>
</el-card>
</el-col>
</el-row>
</template>
<script>
import { defineComponent, ref, reactive, toRefs, getCurrentInstance } from 'vue'
import { ElMessage } from 'element-plus'
import { postAction } from '@/api/manage'
export default defineComponent({
setup() {
const bindList = ref([])
const channelList = ref([])
const billList = ref([])
const goodsList = ref([])
const modelList = ref([])
const formData = ref({
amount: 1
})
const { proxy } = getCurrentInstance()
const searchData = ref({
pageNo: 1,
pageSize: 10
})
const total = ref(0)
const state = reactive({
url: {
getBindPage: '/bind/getBindPage',
getBillPage: '/bill/getBillPage',
getGoodsPage: '/bill/getGoodsPage',
getModelPage: '/bill/getModelPage',
updateBind: '/bind/updateBind'
}
});
function handleCurrentChange(val) {
searchData.value.pageNo = val
loadData()
}
const loadData = (e) => {
if (sessionStorage.getItem('storeInfo')) {
searchData.value.storeCode = JSON.parse(sessionStorage.getItem('storeInfo')).storeCode
postAction(state.url.getBindPage, searchData.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
bindList.value = res.data.records
total.value = res.data.totalRows - 0
if (e) {
} else {
if (res.data.records.length > 0) {
formData.value.stationId = res.data.records[0].stationId
formData.value.id = res.data.records[0].id
}
}
})
}
}
const loadSelect = () => {
if (sessionStorage.getItem('storeInfo')) {
postAction(state.url.getBillPage, { pageNo: 1, pageSize: 50, type: 'IN', storeCode: JSON.parse(sessionStorage.getItem('storeInfo')).storeCode }).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
billList.value = res.data.records
})
}
}
function changeStation(value) {
if (value) {
formData.value.id = bindList.value.find(i => i.stationId == formData.value.stationId).id
console.log(formData.value.id)
}
}
function changeBill(value) {
goodsList.value = []
formData.value.goodsCode = ''
modelList.value = []
formData.value.modelCode = ''
if (value) {
formData.value.bizBillNo = billList.value.find(i => i.billNo == formData.value.billNo).bizBillNo
formData.value.billName = billList.value.find(i => i.billNo == formData.value.billNo).billName
postAction(state.url.getGoodsPage, { pageNo: 1, pageSize: 50, type: 'IN', storeCode: JSON.parse(sessionStorage.getItem('storeInfo')).storeCode, bizBillNo: formData.value.bizBillNo }).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
goodsList.value = res.data.records
})
}
}
function changeGoods(value) {
modelList.value = []
formData.value.modelCode = ''
if (value) {
formData.value.goodsName = goodsList.value.find(i => i.goodsCode == formData.value.goodsCode).goodsName
postAction(state.url.getModelPage, { pageNo: 1, pageSize: 50, type: 'IN', storeCode: JSON.parse(sessionStorage.getItem('storeInfo')).storeCode, bizBillNo: formData.value.bizBillNo, goodsCode: value }).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
modelList.value = res.data.records
})
}
}
function changeModel(value) {
if (value) {
formData.value.modelName = modelList.value.find(i => i.modelCode == formData.value.modelCode).modelName
formData.value.skuCode = modelList.value.find(i => i.modelCode == formData.value.modelCode).skuCode
}
}
function automatic() {
formData.value.billNo = ''
formData.value.goodsCode = ''
formData.value.modelCode = ''
formData.value.state = 0
postAction(state.url.updateBind, formData.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message)
loadData(1)
})
}
function manual() {
if (!formData.value.billNo) {
return ElMessage.warning('请选择单号')
}
if (!formData.value.goodsCode) {
return ElMessage.warning('请选择品名')
}
if (!formData.value.modelCode) {
return ElMessage.warning('请选择号型')
}
formData.value.state = 1
postAction(state.url.updateBind, formData.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message)
loadData(1)
})
}
// loadData()
loadSelect()
return {
...toRefs(state),
bindList,
channelList,
billList,
goodsList,
modelList,
formData,
searchData,
total,
handleCurrentChange,
changeStation,
changeBill,
changeGoods,
changeModel,
automatic,
manual,
loadData
}
},
})
</script>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论