Files
wcs/PDA/PDA/pages/main/main.vue
2025-01-21 19:08:00 +08:00

131 lines
3.7 KiB
Vue

<template>
<view class="bg-image">
<view>
<navigator url="../index/index" open-type="redirect" hover-class="other-navigator-hover">
<view class="logOut-container">
<image class="logOut-image" src="/static/logOut.png"></image>
</view>
</navigator>
</view>
<view style="display: flex;flex-direction: row;margin-bottom: 10rpx;margin-top: 30rpx;">
<view style="flex: 1;"></view>
<view class="uni-flex uni-column" style="flex: 5;">
<navigator url="../bind/bind" hover-class="navigator-hover">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/bind.png" />
</view>
<view class="function-text">物料绑定</view>
</navigator>
</view>
<view class="uni-flex uni-column" style="flex: 5;">
<navigator url="../queryBindList/queryBindList" hover-class="navigator-hover">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/bindQuery.png" />
</view>
<view class="function-text">绑定查询</view>
</navigator>
</view>
<view class="uni-flex uni-column" style="flex: 5;">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/callIn.png" />
</view>
<view class="function-text">产线呼叫</view>
</view>
<view style="flex: 1;"></view>
</view>
<view style="display: flex;flex-direction: row;margin-bottom: 10rpx;margin-top: 30rpx;">
<view style="flex: 1;"></view>
<view class="uni-flex uni-column" style="flex: 5;">
<navigator url="../bind/bind" hover-class="navigator-hover">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/callOut.png" />
</view>
<view class="function-text">货架送回</view>
</navigator>
</view>
<view class="uni-flex uni-column" style="flex: 5;">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/stockTaking.png" />
</view>
<view class="function-text">库存盘点</view>
</view>
<view class="uni-flex uni-column" style="flex: 5;">
<view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;">
<image class="function-image" src="/static/task.png" />
</view>
<view class="function-text">任务管理</view>
</view>
<view style="flex: 1;"></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style>
.bg-image {
background-image: url('/static/background.png');
/* 背景图片路径 */
background-size: cover;
/* 背景图片覆盖整个元素 */
background-position: center;
/* 背景图片居中 */
height: 100%;
/* 视图高度设置为100% */
width: 100%;
/* 视图宽度设置为100% */
position: fixed;
/* 视图定位为固定 */
top: 0;
left: 0;
/* z-index: -1; */
}
.logOut-container {
display: flex;
flex-direction: row;
justify-content: flex-end;
/* 水平方向上靠右 */
align-items: flex-start;
/* 垂直方向上靠上 */
height: 100%;
/* 或者其他适当的值 */
/* 其他样式 */
}
.logOut-image {
top: 20rpx;
right: 20rpx;
height: 60rpx;
width: 60rpx;
/* 不需要额外的定位样式 */
}
.function-image {
height: 140rpx;
width: 140rpx;
margin: 20rpx;
padding-left: 20rpx;
}
.function-text {
color: black;
text-align: center;
font-weight: bold;
font-size: 35rpx;
}
</style>