hanst
/
wms-pda
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

init

master
han\hanst 11 months ago
parent
0bfc94eb5f
commit
20471ead25
20 changed files with 2514 additions and 44 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/assets/scss/global.scss
  2. 37
      src/router/index.js
  3. 4
      src/views/common/login.vue
  4. 38
      src/views/main.vue
  5. 190
      src/views/modules/handlingunit/handlingunit.vue
  6. 187
      src/views/modules/mrissue/mrissue.vue
  7. 191
      src/views/modules/otherinout/otherinout.vue
  8. 190
      src/views/modules/outsource/outsource.vue
  9. 190
      src/views/modules/productionissue/productionissue.vue
  10. 189
      src/views/modules/productionwhse/productionwhse.vue
  11. 140
      src/views/modules/recv/inspectionResults.vue
  12. 4
      src/views/modules/recv/po-recv.vue
  13. 162
      src/views/modules/recv/qualifiedStorage.vue
  14. 5
      src/views/modules/recv/recv.vue
  15. 187
      src/views/modules/salereturn/salereturn.vue
  16. 140
      src/views/modules/salereturn/scrap.vue
  17. 140
      src/views/modules/salereturn/store.vue
  18. 187
      src/views/modules/saleshipping/saleshipping.vue
  19. 188
      src/views/modules/stocktaking/stocktaking.vue
  20. 187
      src/views/modules/transportation/transportation.vue

2
src/assets/scss/global.scss
View File

@ -25,7 +25,7 @@
/*table start*/
.el-table th {
display: table-cell !important;
background-color: #17b3a3;
background-color: #2196F3;
color: #fff;
height: 20px;
}

37
src/router/index.js
View File

@ -18,19 +18,38 @@ Vue.use(Router)
// 开发环境不使用懒加载, 因为懒加载页面太多的话会造成webpack热更新太慢, 所以只有生产环境使用懒加载
const _import = require('./import-' + process.env.NODE_ENV)
// 全局路由(无需嵌套上左右整体布局)
const globalRoutes = [
{ path: '/404', component: _import('common/404'), name: '404', meta: { title: '404未找到' } },
{ path: '/login', component: _import('common/login'), name: 'login', meta: { title: '登录' } },
{path: "/porecv",name: "porecv",
component: resolve => require(["@/views/modules/recv/po-recv.vue"], resolve),
meta: { transition: 'instant' ,preload: true,keepAlive: true}
},
{path: "/recv",name: "recv",
component: resolve => require(["@/views/modules/recv/recv.vue"], resolve),
meta: { transition: 'instant' ,preload: true,keepAlive: true}
}
// 采购入库
{path: "/porecv",name: "porecv", component: resolve => require(["@/views/modules/recv/po-recv.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
{path: "/recv",name: "recv", component: resolve => require(["@/views/modules/recv/recv.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
{path: "/qualifiedStorage",name: "qualifiedStorage", component: resolve => require(["@/views/modules/recv/qualifiedStorage.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// handlingunit
{path: "/handlingunit",name: "handlingunit", component: resolve => require(["@/views/modules/handlingunit/handlingunit.vue"], resolve),meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 生产发料
{path: "/productionissue",name: "productionissue", component: resolve => require(["@/views/modules/productionissue/productionissue.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 生产入库
{path: "/productionwhse",name: "productionwhse", component: resolve => require(["@/views/modules/productionwhse/productionwhse.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 委外
{path: "/outsource",name: "outsource", component: resolve => require(["@/views/modules/outsource/outsource.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 客户订单发货
{path: "/saleshipping",name: "saleshipping", component: resolve => require(["@/views/modules/saleshipping/saleshipping.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 销售退货
{path: "/salereturn",name: "salereturn", component: resolve => require(["@/views/modules/salereturn/salereturn.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
{path: "/scrap",name: "scrap", component: resolve => require(["@/views/modules/salereturn/scrap.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
{path: "/store",name: "store", component: resolve => require(["@/views/modules/salereturn/store.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 其他出入库
{path: "/otherinout",name: "otherinout", component: resolve => require(["@/views/modules/otherinout/otherinout.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// Material Requisition
{path: "/mrissue",name: "mrissue", component: resolve => require(["@/views/modules/mrissue/mrissue.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 盘点
{path: "/stocktaking",name: "stocktaking", component: resolve => require(["@/views/modules/stocktaking/stocktaking.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
// 运输任务
{path: "/transportation",name: "transportation", component: resolve => require(["@/views/modules/transportation/transportation.vue"], resolve), meta: { transition: 'instant' ,preload: true,keepAlive: true}},
]
// 主入口路由(需嵌套上左右整体布局)

4
src/views/common/login.vue
View File

@ -157,7 +157,7 @@ export default {
},
// 获取全局参数变量
getConfigParams() {
/* getConfigParams() {
getConfigParams().then(({data}) => {
if (data && data.code == 0) {
localStorage.setItem('configParams', JSON.stringify(data.data))
@ -165,7 +165,7 @@ export default {
// this.authControl = JSON.parse(localStorage.getItem('configParams')).authControl
}
})
},
},*/
handleSubmit() {
this.loading = true
// 模拟API请求

38
src/views/main.vue
View File

@ -41,34 +41,16 @@ export default {
activeIndex: null,
buttons: [
{ icon: '📦', label: '采购入库', color: '#4CAF50', action: 'stockIn',to:'porecv' },
{ icon: '🏷️', label: '载具管理', color: '#0097A7', action: 'stockOut',to:'recv' },
{ icon: '📦', label: '生产订单发料', color: '#8BC34A', action: 'stockIn',to:'porecv' },
{ icon: '📥', label: '生产订单入库', color: '#2196F3', action: 'stockIn',to:'porecv' },
{ icon: '📤', label: '委外PO发料', color: '#8BC34A', action: 'stockIn',to:'porecv' },
{ icon: '🚚', label: '销售订单发货', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '↔️', label: '其他出入库', color: '#607D8B', action: 'stockIn',to:'porecv' },
{ icon: '🚚', label: 'Material Requisition发料', color: '#2196F3', action: 'stockIn',to:'porecv' },
{ icon: '📋', label: '盘点', color: '#2196F3', action: 'inventory' ,to:'recv' },
{ icon: '↩️', label: '销售退货', color: '#FF9800', action: 'transfer' ,to:'recv' },
{ icon: '🚚', label: '运输任务', color: '#3F51B5', action: 'label' ,to:'recv' },
/*{ icon: '🔄', label: '调拨', color: '#607D8B', action: 'transfer' ,to:'recv' },
{ icon: '📌', label: '标签', color: '#795548', action: 'label' ,to:'recv' },
{ icon: '📷', label: '扫码', color: '#3F51B5', action: 'scan' ,to:'recv' },
{ icon: '📁', label: '同步', color: '#00BCD4', action: 'sync' ,to:'recv' },
{ icon: '⚙️', label: '设置', color: '#9E9E9E', action: 'settings' ,to:'recv' },
{ icon: '👥', label: '团队', color: '#CDDC39', action: 'team' ,to:'recv' },
{ icon: '📈', label: '统计', color: '#FF5722', action: 'stats',to:'recv' },
{ icon: '📊', label: '盘点', color: '#9C27B0', action: 'inventory' ,to:'recv' },
{ icon: '🔄', label: '调拨', color: '#607D8B', action: 'transfer' ,to:'recv' },
{ icon: '📌', label: '标签', color: '#795548', action: 'label' ,to:'recv' },
{ icon: '📷', label: '扫码', color: '#3F51B5', action: 'scan' ,to:'recv' },
{ icon: '📁', label: '同步', color: '#00BCD4', action: 'sync' ,to:'recv' },
{ icon: '⚙️', label: '设置', color: '#9E9E9E', action: 'settings' ,to:'recv' },
{ icon: '👥', label: '团队', color: '#CDDC39', action: 'team' ,to:'recv' },
{ icon: '📈', label: '统计', color: '#FF5722', action: 'stats',to:'recv' },*/
/* { icon: '❌', label: '退出', color: '#f1b2b2', action: 'help' ,to:'recv' }*/
{ icon: '🏷️', label: '包装单元管理', color: '#0097A7', action: 'stockOut',to:'handlingunit' },
{ icon: '📦', label: '生产发料', color: '#8BC34A', action: 'stockIn',to:'productionissue' },
{ icon: '📥', label: '生产入库', color: '#2196F3', action: 'stockIn',to:'productionwhse' },
{ icon: '📤', label: '委外发料', color: '#8BC34A', action: 'stockIn',to:'outsource' },
{ icon: '🚚', label: '销售发货', color: '#2196F3', action: 'stockOut',to:'saleshipping' },
{ icon: '↩️', label: '销售退货', color: '#FF9800', action: 'transfer' ,to:'salereturn' },
{ icon: '↔️', label: '其他出入库', color: '#607D8B', action: 'stockIn',to:'otherinout' },
{ icon: '🚚', label: 'MR发料', color: '#2196F3', action: 'stockIn',to:'mrissue' },
{ icon: '📋', label: '盘点', color: '#2196F3', action: 'inventory' ,to:'stocktaking' },
{ icon: '🚚', label: '运输任务', color: '#3F51B5', action: 'label' ,to:'transportation' },
]
}
},

190
src/views/modules/handlingunit/handlingunit.vue
View File

@ -0,0 +1,190 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">Handling Unit</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '装Handling Unit', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '合并Handling Unit', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '拆Handling Unit', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '📦', label: '补打印Handling Unit标签', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '查看Handling Unit', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

187
src/views/modules/mrissue/mrissue.vue
View File

@ -0,0 +1,187 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">MR发料</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: 'MR发料', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: 'MR退料', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

191
src/views/modules/otherinout/otherinout.vue
View File

@ -0,0 +1,191 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">其他出入库</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '移库', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: 'Receive from Transit', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '报废', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '📦', label: '其他入库', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '其他出库', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '📦', label: 'CALL料', color: '#FF9800', action: 'stockIn',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

190
src/views/modules/outsource/outsource.vue
View File

@ -0,0 +1,190 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">委外发料</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '直接发料', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '拣选', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '申请单发料', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '📦', label: '退料', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '委外PO接收', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

190
src/views/modules/productionissue/productionissue.vue
View File

@ -0,0 +1,190 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">生成发料</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '直接发料', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '拣选', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '申请单发料', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '📦', label: '直接退料', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '申请单退料', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

189
src/views/modules/productionwhse/productionwhse.vue
View File

@ -0,0 +1,189 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">生成入库</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '包装', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '装托盘', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '入库登记', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '📦', label: '退库', color: '#FF9800', action: 'stockIn',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

140
src/views/modules/recv/inspectionResults.vue
View File

@ -0,0 +1,140 @@
<template>
<div>
<div class="pda-container">
<div class="status-bar">
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div>
<div class="goBack">登记检验结果</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 扫描输入区 -->
<div class="scan-box">
<input
v-model="scanCode"
placeholder="扫描PO条码或输入PO号"
@keyup.enter="addItem"
ref="scanCodeRef"
/>
</div>
<!-- 商品列表区 -->
<div class="item-list">
<div
v-for="(item, i) in items"
:key="i"
class="item-row"
>
<span>{{ item.code }}</span>
<span>{{ item.qty }}件</span>
<el-button icon="el-icon-delete" @click="removeItem(i)"></el-button>
</div>
</div>
<!-- 操作按钮区 -->
<el-button
class="submit-btn"
@click="submit"
>
确认收货 ({{ totalQty }})
</el-button>
</div>
<el-dialog
style="font-size: 12px"
v-drag
:title="'Dialog'"
:visible.sync="siteVisible"
width="260px" :append-to-body="true" >
<el-form label-position="top" style="margin-left: 7px;margin-top: 10px;">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item :label="'Test'" >
<el-radio label="Y">Y</el-radio>
<el-radio label="N">N</el-radio>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-footer style="height:40px;margin-top: 10px;text-align:center">
<el-button type="primary" @click="">确定</el-button>
<el-button type="primary" @click="siteVisible=false">关闭</el-button>
</el-footer>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
siteVisible: false,
scanCode: '',
items: [{code: 'A001', qty: 1}, {code: 'A002', qty: 2}]
}
},
computed: {
totalQty() {
return this.items.reduce((sum, item) => sum + item.qty, 0)
}
},
methods: {
toShouye(){
this.$router.push({path: '/'})
},
addItem() {
if (!this.scanCode) return
this.items.push({
code: this.scanCode,
qty: 1
})
this.scanCode = ''
},
removeItem(index) {
this.items.splice(index, 1)
},
submit() {
alert(`已提交${this.items.length}种商品`)
this.items = []
}
},
mounted() {
this.$nextTick(() => {
this.$refs.scanCodeRef.focus()
})
}
}
</script>
<style scoped>
.pda-receipt {
display: flex;
flex-direction: column;
height: 80vh;
padding: 10px;
}
.scan-box input {
width: 100%;
padding: 12px;
font-size: 16px;
}
.item-list {
flex: 1;
overflow-y: auto;
margin: 20px 0;
}
.item-row {
display: flex;
justify-content: space-between;
padding: 8px;
border-bottom: 1px solid #eee;
}
.submit-btn {
padding: 12px;
background: #07c160;
color: white;
border: none;
font-size: larger;
}
</style>

4
src/views/modules/recv/po-recv.vue
View File

@ -4,6 +4,7 @@
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">采购订单入库</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
@ -37,12 +38,11 @@ export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
batteryLevel: 78,
activeIndex: null,
buttons: [
{ icon: '📦', label: '采购订单接收', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '登记检验结果', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '检验合格入库', color: '#4CAF50', action: 'search' ,to:'recv' },
{ icon: '✅', label: '检验合格入库', color: '#4CAF50', action: 'search' ,to:'qualifiedStorage' },
]
}
},

162
src/views/modules/recv/qualifiedStorage.vue
View File

@ -0,0 +1,162 @@
<template>
<div>
<div class="pda-container">
<div class="status-bar">
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div>
<div class="goBack">检验合格入库</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 扫描输入区 -->
<div class="scan-box">
<input
v-model="scanCode"
placeholder="扫描PO条码或输入PO号"
@keyup.enter="addItem"
ref="scanCodeRef"
/>
</div>
<!-- 商品列表区 -->
<div class="item-list">
<el-table :height="240" :data="items" @row-click="rowClick"
stripe highlight-current-row border :row-style="{ height: '30px' }" style="width: 100%;">
<el-table-column prop="code" header-align="center" align="center" label="商品编码"></el-table-column>
<el-table-column prop="qty" header-align="center" align="center" label="数量" width="42"></el-table-column>
<el-table-column prop="recvQty" header-align="center" align="center" label="入库数量">
<template slot-scope="scope">
<el-input v-model="scope.row.recvQty" style="height: 11px;width:98%"></el-input>
</template>
</el-table-column>
<el-table-column prop="locnCode" header-align="center" align="center" label="库位">
<template slot-scope="scope">
<el-input v-model="scope.row.locnCode" style="height: 11px;width:98%"></el-input>
</template>
</el-table-column>
</el-table>
<!-- <div
v-for="(item, i) in items"
:key="i"
class="item-row"
>
<span>{{ item.code }}</span>
<span>{{ item.qty }}件</span>
<el-button icon="el-icon-delete" @click="removeItem(i)"></el-button>
</div>-->
</div>
<!-- 操作按钮区 -->
<el-button
class="submit-btn"
@click="submit"
>
确认收货 ({{ totalQty }})
</el-button>
</div>
<el-dialog
style="font-size: 12px"
v-drag
:title="'Dialog'"
:visible.sync="siteVisible"
width="260px" :append-to-body="true" >
<el-form label-position="top" style="margin-left: 7px;margin-top: 10px;">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item :label="'Test'" >
<el-radio label="Y">Y</el-radio>
<el-radio label="N">N</el-radio>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-footer style="height:40px;margin-top: 10px;text-align:center">
<el-button type="primary" @click="">确定</el-button>
<el-button type="primary" @click="siteVisible=false">关闭</el-button>
</el-footer>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
siteVisible: false,
scanCode: '',
items: [{code: 'A001', qty: 1}, {code: 'A002', qty: 2}]
}
},
computed: {
totalQty() {
return this.items.reduce((sum, item) => sum + item.qty, 0)
}
},
methods: {
rowClick(row){
},
addItem() {
if (!this.scanCode) return
this.items.push({
code: this.scanCode,
qty: 1
})
this.scanCode = ''
},
removeItem(index) {
this.items.splice(index, 1)
},
submit() {
alert(`已提交${this.items.length}种商品`)
this.items = []
}
},
mounted() {
this.$nextTick(() => {
this.$refs.scanCodeRef.focus()
})
}
}
</script>
<style scoped>
.pda-receipt {
display: flex;
flex-direction: column;
height: 80vh;
padding: 10px;
}
.scan-box input {
width: 100%;
padding: 12px;
font-size: 16px;
}
.item-list {
flex: 1;
overflow-y: auto;
margin: 20px 0;
}
.item-row {
display: flex;
justify-content: space-between;
padding: 8px;
border-bottom: 1px solid #eee;
}
.submit-btn {
padding: 12px;
background: #07c160;
color: white;
border: none;
font-size: larger;
}
/deep/ .el-table .cell {
line-height: 24px;
font-size: 12px;
height: 24px;
}
</style>

5
src/views/modules/recv/recv.vue
View File

@ -1,8 +1,9 @@
<template>
<div>
<div class="pda-receipt">
<div class="pda-container">
<div class="status-bar">
<div class="time">{{ new Date().toTimeString().substr(0, 5) }}</div>
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div>
<div class="goBack">采购订单接收</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 扫描输入区 -->

187
src/views/modules/salereturn/salereturn.vue
View File

@ -0,0 +1,187 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">销售退货</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '入库', color: '#FF9800', action: 'stockIn',to:'store' },
{ icon: '📄', label: '报废', color: '#2196F3', action: 'stockOut',to:'scrap' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

140
src/views/modules/salereturn/scrap.vue
View File

@ -0,0 +1,140 @@
<template>
<div>
<div class="pda-container">
<div class="status-bar">
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div>
<div class="goBack">报废</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 扫描输入区 -->
<div class="scan-box">
<input
v-model="scanCode"
placeholder="扫描PO条码或输入PO号"
@keyup.enter="addItem"
ref="scanCodeRef"
/>
</div>
<!-- 商品列表区 -->
<div class="item-list">
<div
v-for="(item, i) in items"
:key="i"
class="item-row"
>
<span>{{ item.code }}</span>
<span>{{ item.qty }}件</span>
<el-button icon="el-icon-delete" @click="removeItem(i)"></el-button>
</div>
</div>
<!-- 操作按钮区 -->
<el-button
class="submit-btn"
@click="submit"
>
确认收货 ({{ totalQty }})
</el-button>
</div>
<el-dialog
style="font-size: 12px"
v-drag
:title="'Dialog'"
:visible.sync="siteVisible"
width="260px" :append-to-body="true" >
<el-form label-position="top" style="margin-left: 7px;margin-top: 10px;">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item :label="'Test'" >
<el-radio label="Y">Y</el-radio>
<el-radio label="N">N</el-radio>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-footer style="height:40px;margin-top: 10px;text-align:center">
<el-button type="primary" @click="">确定</el-button>
<el-button type="primary" @click="siteVisible=false">关闭</el-button>
</el-footer>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
siteVisible: false,
scanCode: '',
items: [{code: 'A001', qty: 1}, {code: 'A002', qty: 2}]
}
},
computed: {
totalQty() {
return this.items.reduce((sum, item) => sum + item.qty, 0)
}
},
methods: {
toShouye(){
this.$router.push({path: '/'})
},
addItem() {
if (!this.scanCode) return
this.items.push({
code: this.scanCode,
qty: 1
})
this.scanCode = ''
},
removeItem(index) {
this.items.splice(index, 1)
},
submit() {
alert(`已提交${this.items.length}种商品`)
this.items = []
}
},
mounted() {
this.$nextTick(() => {
this.$refs.scanCodeRef.focus()
})
}
}
</script>
<style scoped>
.pda-receipt {
display: flex;
flex-direction: column;
height: 80vh;
padding: 10px;
}
.scan-box input {
width: 100%;
padding: 12px;
font-size: 16px;
}
.item-list {
flex: 1;
overflow-y: auto;
margin: 20px 0;
}
.item-row {
display: flex;
justify-content: space-between;
padding: 8px;
border-bottom: 1px solid #eee;
}
.submit-btn {
padding: 12px;
background: #07c160;
color: white;
border: none;
font-size: larger;
}
</style>

140
src/views/modules/salereturn/store.vue
View File

@ -0,0 +1,140 @@
<template>
<div>
<div class="pda-container">
<div class="status-bar">
<div class="goBack" @click="$router.back()"><i class="el-icon-arrow-left"></i>上一页</div>
<div class="goBack">入库</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 扫描输入区 -->
<div class="scan-box">
<input
v-model="scanCode"
placeholder="扫描PO条码或输入PO号"
@keyup.enter="addItem"
ref="scanCodeRef"
/>
</div>
<!-- 商品列表区 -->
<div class="item-list">
<div
v-for="(item, i) in items"
:key="i"
class="item-row"
>
<span>{{ item.code }}</span>
<span>{{ item.qty }}件</span>
<el-button icon="el-icon-delete" @click="removeItem(i)"></el-button>
</div>
</div>
<!-- 操作按钮区 -->
<el-button
class="submit-btn"
@click="submit"
>
确认收货 ({{ totalQty }})
</el-button>
</div>
<el-dialog
style="font-size: 12px"
v-drag
:title="'Dialog'"
:visible.sync="siteVisible"
width="260px" :append-to-body="true" >
<el-form label-position="top" style="margin-left: 7px;margin-top: 10px;">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item :label="'Test'" >
<el-radio label="Y">Y</el-radio>
<el-radio label="N">N</el-radio>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-footer style="height:40px;margin-top: 10px;text-align:center">
<el-button type="primary" @click="">确定</el-button>
<el-button type="primary" @click="siteVisible=false">关闭</el-button>
</el-footer>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
siteVisible: false,
scanCode: '',
items: [{code: 'A001', qty: 1}, {code: 'A002', qty: 2}]
}
},
computed: {
totalQty() {
return this.items.reduce((sum, item) => sum + item.qty, 0)
}
},
methods: {
toShouye(){
this.$router.push({path: '/'})
},
addItem() {
if (!this.scanCode) return
this.items.push({
code: this.scanCode,
qty: 1
})
this.scanCode = ''
},
removeItem(index) {
this.items.splice(index, 1)
},
submit() {
alert(`已提交${this.items.length}种商品`)
this.items = []
}
},
mounted() {
this.$nextTick(() => {
this.$refs.scanCodeRef.focus()
})
}
}
</script>
<style scoped>
.pda-receipt {
display: flex;
flex-direction: column;
height: 80vh;
padding: 10px;
}
.scan-box input {
width: 100%;
padding: 12px;
font-size: 16px;
}
.item-list {
flex: 1;
overflow-y: auto;
margin: 20px 0;
}
.item-row {
display: flex;
justify-content: space-between;
padding: 8px;
border-bottom: 1px solid #eee;
}
.submit-btn {
padding: 12px;
background: #07c160;
color: white;
border: none;
font-size: larger;
}
</style>

187
src/views/modules/saleshipping/saleshipping.vue
View File

@ -0,0 +1,187 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">客户订单发货</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '发货', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '取消发货', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

188
src/views/modules/stocktaking/stocktaking.vue
View File

@ -0,0 +1,188 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">盘点</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '盘点', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '盘盈', color: '#2196F3', action: 'stockOut',to:'recv' },
{ icon: '✅', label: '盘亏', color: '#4CAF50', action: 'search' ,to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>

187
src/views/modules/transportation/transportation.vue
View File

@ -0,0 +1,187 @@
<template>
<div class="pda-container">
<!-- 状态栏 -->
<div class="status-bar">
<div class="time">{{ currentTime }}</div>
<div class="time">运输任务</div>
<div class="network" style="color: #fff" @click="$router.push({path: '/'})">🏠首页</div>
</div>
<!-- 可滚动按钮区 -->
<div class="button-scroll-container">
<div class="button-grid">
<button
v-for="(btn, index) in buttons"
:key="index"
class="pda-button"
:style="{
'background': btn.color,
'transform': activeIndex === index ? 'scale(0.95)' : 'none'
}"
@touchstart.passive="setActive(index)"
@touchend.passive="clearActive()"
@touchcancel.passive="clearActive()">
<router-link class="pda-button" :style="{
'background': ';#4CAF50',}" :to="btn.to">
<span class="button-icon">{{ btn.icon }}</span>
<span class="button-label">{{ btn.label }}</span>
</router-link>
</button>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
currentTime: new Date().toTimeString().substr(0, 5),
activeIndex: null,
buttons: [
{ icon: '📦', label: '调拨申请', color: '#FF9800', action: 'stockIn',to:'recv' },
{ icon: '📄', label: '移库', color: '#2196F3', action: 'stockOut',to:'recv' },
]
}
},
mounted() {
this.updateTime();
window.addEventListener('resize', this.adjustLayout);
this.$nextTick(this.adjustLayout);
},
beforeDestroy() {
clearInterval(this.timeInterval);
window.removeEventListener('resize', this.adjustLayout);
},
methods: {
updateTime() {
this.timeInterval = setInterval(() => {
this.currentTime = new Date().toTimeString().substr(0, 5);
}, 60000);
},
adjustLayout() {
const container = document.querySelector('.button-grid');
if (container) {
const width = container.clientWidth;
const columns = Math.max(3, Math.floor(width / 120));
document.documentElement.style.setProperty('--columns', columns);
}
},
handleClick(action) {
console.log('执行操作:', action);
},
setActive(index) {
this.activeIndex = index;
},
clearActive() {
this.activeIndex = null;
},
// 退出
logoutHandle() {
this.$confirm('确定进行[退出]操作?', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$http({
url: this.$http.adornUrl('/sys/logout'),
method: 'post',
data: this.$http.adornData()
}).then(({data}) => {
if (data && data.code === 0) {
//clearLoginInfo()
this.$router.push({name: 'login'})
}
})
}).catch(() => {
})
},
}
}
</script>
<style>
:root {
--columns: 4;
--button-size: calc(100vw / var(--columns) - 20px);
}
.pda-container {
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
background: #f5f5f5;
font-family: 'Arial', sans-serif;
overflow: hidden;
}
.button-scroll-container {
flex: 1;
overflow-y: auto;
padding: 10px;
-webkit-overflow-scrolling: touch;
}
.button-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(var(--button-size), 1fr));
gap: 14px;
padding-bottom: 20px;
}
.pda-button {
position: relative;
width: 100%;
aspect-ratio: 1;
border: none;
border-radius: 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
transition: transform 0.1s ease;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
cursor: pointer;
user-select: none;
}
.button-icon {
font-size: 28px;
margin-bottom: 6px;
}
.button-label {
font-size: 18px;
font-weight: 800;
}
.button-badge {
position: absolute;
top: 8px;
right: 8px;
background: #ff4757;
color: white;
width: 18px;
height: 18px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: bold;
}
@media (max-width: 480px) {
.button-icon {
font-size: 20px;
}
.button-label {
font-size: 14px;
}
}
</style>
Write Preview
Loading…
Cancel
Save