You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
329 lines
10 KiB
329 lines
10 KiB
2 months ago
|
<template>
|
||
|
<view>
|
||
|
<u-navbar bgColor="#ffffff" :placeholder="true" :autoBack="true" titleStyle="font-weight:600">
|
||
|
|
||
|
</u-navbar>
|
||
|
<!-- 自定义导航栏 -->
|
||
|
<!-- <u-navbar bgColor="#ffffff" :placeholder="true" :autoBack="true" titleStyle="font-weight:600">
|
||
|
<view slot="center" style="display: flex;align-items: center;" @click="popCheBian()">
|
||
|
<span style="font-size: 32rpx; font-weight: 600;color: #333333;margin-right: 10rpx;">{{ changku }}</span>
|
||
|
<image style="width: 32rpx; height: 32rpx;" src="../../../static/images/wuzhi/zhuanhuan.png"></image>
|
||
|
</view>
|
||
|
</u-navbar> -->
|
||
|
<!-- 仓库管理 -->
|
||
|
<view class="paibanBox">
|
||
|
<view class="paiban">
|
||
|
<!-- 头部 -->
|
||
|
<view class="head">
|
||
|
<view class="headTime">仓库管理</view>
|
||
|
<!-- 副标题 -->
|
||
|
<view class="operate">
|
||
|
<!-- <view class="opInfo" @click="gotoTiaoBan">调班</view>
|
||
|
<view class="opInfo" @click="gotoPaiBan">开始排班</view> -->
|
||
|
</view>
|
||
|
</view>
|
||
|
<!-- 卡片 -->
|
||
|
<view class="paibanInfo">
|
||
|
<view style="display: flex;flex-wrap: wrap;align-items: center;justify-content: space-around;">
|
||
|
<view class="bgWz" style="background:#F2FEFF ;" @click="goToPage(1)">
|
||
|
<p class="textSize">仓库库存</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/kucun.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="background: #FBF6F8 ;" @click="goToPage(10)">
|
||
|
<p class="textSize">物资预警</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/kucunyujing.png"></image>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<!-- 出入库 -->
|
||
|
<view class="paibanBox">
|
||
|
<view class="paiban">
|
||
|
<!-- 头部 -->
|
||
|
<view class="head"><view class="headTime">出入库</view></view>
|
||
|
<!-- 卡片 -->
|
||
|
<view class="paibanInfo">
|
||
|
<view style="display: flex;flex-wrap: wrap;align-items: center;justify-content: space-around;">
|
||
|
<view class="bgWz" style="margin-bottom: 30rpx;background: #F2F8FF;" @click="goToPage(2)">
|
||
|
<p class="textSize">物资入库</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/ruku.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="margin-bottom: 30rpx;background: #FDF7F0 ;" @click="goToPage(4)">
|
||
|
<p class="textSize">物资出库</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/chuku.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="background:#F2F9F7 ;margin-bottom: 30rpx;" @click="goToPage(5)">
|
||
|
<p class="textSize">物资调拨</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/diaobo.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="background:#FBF6F8 ;margin-bottom: 30rpx;" @click="goToPage(3)">
|
||
|
<p class="textSize">物资盘点</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/pandian.png"></image>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="paibanBox">
|
||
|
<view class="paiban">
|
||
|
<!-- 头部 -->
|
||
|
<view class="head"><view class="headTime">出入库明细</view></view>
|
||
|
<!-- 卡片 -->
|
||
|
<view class="paibanInfo">
|
||
|
<view style="display: flex;flex-wrap: wrap;align-items: center;justify-content: space-around;">
|
||
|
<view class="bgWz" style="margin-bottom: 30rpx;background: #F2F8FF;" @click="goToPage(6)">
|
||
|
<p class="textSize">入库明细</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/rukumingxi.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="margin-bottom: 30rpx;background: #FDF7F0 ;" @click="goToPage(7)">
|
||
|
<p class="textSize">出库明细</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/cukumingxi.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="background:#F2F9F7 ;margin-bottom: 30rpx;" @click="goToPage(8)">
|
||
|
<p class="textSize">调拨明细</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/diaobomingxi.png"></image>
|
||
|
</view>
|
||
|
<view class="bgWz" style="background:#FBF6F8 ;margin-bottom: 30rpx;" @click="goToPage(9)">
|
||
|
<p class="textSize">盘点明细</p>
|
||
|
<image class="imgwh" src="../../../static/images/wuzhi/pandianmingxi.png"></image>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<!-- 侧边栏 -->
|
||
|
<u-popup :show="wuzhiCheBian" mode="left" :customStyle="{ width: '70vw' }" :safeAreaInsetBottom="true" @close="offPop()">
|
||
|
<view style="height: 50px;margin-bottom: 10rpx;"></view>
|
||
|
<u-search placeholder="请输入仓库名称搜索" v-model="keyword" :clearabled="false" :showAction="false"></u-search>
|
||
|
<scroll-view scroll-y="true" style="height: 95vh;" scroll-with-animation="true">
|
||
|
<view class="status_bar"></view>
|
||
|
<uni-list>
|
||
|
<uni-list-item v-for="(item, index) in titlelist" :title="`${index + 1}.${item.name}`" :clickable="true" @click="xuanZheChangKu(item)"></uni-list-item>
|
||
|
</uni-list>
|
||
|
<view style="height: 50px;"></view>
|
||
|
</scroll-view>
|
||
|
</u-popup>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import { listWarehouse } from '@/api/indexpage/yjWz/warehouse.js';
|
||
|
export default {
|
||
|
data() {
|
||
|
return {
|
||
|
timer: '', //防抖函数
|
||
|
keyword: '',
|
||
|
changku: '仓库名称', // 仓库名称
|
||
|
changkuId: '', //场库ID
|
||
|
wuzhiCheBian: false, //物资侧边栏
|
||
|
titlelist: [], //场库列表
|
||
|
deptName: ''
|
||
|
};
|
||
|
},
|
||
|
onLoad() {
|
||
|
this.getChangKu();
|
||
|
},
|
||
|
watch: {
|
||
|
keyword(newdata, olddata) {
|
||
|
let that = this;
|
||
|
//防抖函数
|
||
|
clearTimeout(that.timer);
|
||
|
that.timer = setTimeout(function() {
|
||
|
if (newdata === '') {
|
||
|
//发场库请求
|
||
|
listWarehouse().then(res => {
|
||
|
that.titlelist = res.rows;
|
||
|
});
|
||
|
} else {
|
||
|
//发场库请求
|
||
|
listWarehouse({ name: newdata }).then(res => {
|
||
|
that.titlelist = res.rows;
|
||
|
});
|
||
|
}
|
||
|
}, 600);
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
goToPage(bs) {
|
||
|
if (bs === 1) {
|
||
|
//仓库库存
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/cangKuKuCun/cangKuKuCun?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 2) {
|
||
|
//物资入库
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzRuKu/wzRuKu?ckId=${this.changkuId}&ckName=${this.changku}&deptName=${this.deptName}`);
|
||
|
} else if (bs === 3) {
|
||
|
//物资盘点
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzPanDian/wzPanDian?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 4) {
|
||
|
//物资出库
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzChuKu/wzChuKu?ckId=${this.changkuId}&ckName=${this.changku}&deptName=${this.deptName}`);
|
||
|
} else if (bs === 5) {
|
||
|
//物资调拨
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzDiaoBo/wzDiaoBo?ckId=${this.changkuId}&ckName=${this.changku}&deptName=${this.deptName}`);
|
||
|
} else if (bs === 6) {
|
||
|
//入库明细
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/rkMingXi/rkMingXi?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 7) {
|
||
|
//出库明细
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/ckMingXi/ckMingXi?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 8) {
|
||
|
//调拨明细
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/diaoboMingXi/diaoboMingXi?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 9) {
|
||
|
//盘点明细
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/pandianMingXi/pandianMingXi?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
} else if (bs === 10) {
|
||
|
this.$tab.navigateTo(`/pages/indexpage/YJgoods/wzYvJing/wzYvJing?ckId=${this.changkuId}&ckName=${this.changku}`);
|
||
|
}
|
||
|
},
|
||
|
getChangKu() {
|
||
|
//发场库请求
|
||
|
listWarehouse().then(res => {
|
||
|
this.titlelist = res.rows;
|
||
|
|
||
|
//选择第一个
|
||
|
this.changku = this.titlelist[0].name;
|
||
|
this.changkuId = this.titlelist[0].id;
|
||
|
this.deptName = this.titlelist[0].deptName;
|
||
|
});
|
||
|
},
|
||
|
//弹出侧边栏
|
||
|
popCheBian() {
|
||
|
//弹出侧边栏
|
||
|
this.wuzhiCheBian = true;
|
||
|
},
|
||
|
offPop() {
|
||
|
//弹出侧边栏
|
||
|
this.wuzhiCheBian = false;
|
||
|
//清空搜索
|
||
|
this.keyword = '';
|
||
|
},
|
||
|
xuanZheChangKu(item) {
|
||
|
//获取仓库名称和ID
|
||
|
this.changku = item.name;
|
||
|
this.changkuId = item.id;
|
||
|
this.deptName = item.deptName;
|
||
|
//弹出侧边栏
|
||
|
this.wuzhiCheBian = false;
|
||
|
//清空搜索
|
||
|
this.keyword = '';
|
||
|
}
|
||
|
}
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
// 日历日期
|
||
|
/deep/.uni-calendar__header-text {
|
||
|
font-weight: bolder;
|
||
|
color: #454545;
|
||
|
font-size: 30rpx;
|
||
|
}
|
||
|
|
||
|
// 选中日期
|
||
|
/deep/.uni-calendar-item--isDay {
|
||
|
background-color: #8792df !important;
|
||
|
border-radius: 15rpx;
|
||
|
}
|
||
|
|
||
|
page {
|
||
|
.paibanBox {
|
||
|
width: 100vw;
|
||
|
padding: 20rpx 30rpx;
|
||
|
|
||
|
.paiban {
|
||
|
width: 100%;
|
||
|
height: 100%;
|
||
|
background-color: #fff;
|
||
|
border-radius: 12rpx;
|
||
|
box-shadow: 0px 4rpx 12rpx 0px rgba(0, 37, 105, 0.1);
|
||
|
padding: 20rpx;
|
||
|
|
||
|
.head {
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
align-items: center;
|
||
|
border-bottom: 4rpx solid #f0f1f5;
|
||
|
padding-bottom: 13rpx;
|
||
|
|
||
|
.headTime {
|
||
|
font-weight: bolder;
|
||
|
color: #454545;
|
||
|
font-size: 30rpx;
|
||
|
}
|
||
|
|
||
|
.operate {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
|
||
|
.opInfo {
|
||
|
color: #8792df;
|
||
|
background-color: #e6e9fd;
|
||
|
padding: 0 15rpx;
|
||
|
font-weight: 600;
|
||
|
border-radius: 10rpx;
|
||
|
margin-left: 20rpx;
|
||
|
height: 55rpx;
|
||
|
line-height: 55rpx;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.paibanInfo {
|
||
|
padding: 15rpx 0;
|
||
|
overflow: scroll;
|
||
|
height: 90%;
|
||
|
.bgWz {
|
||
|
width: 288rpx;
|
||
|
height: 96rpx;
|
||
|
|
||
|
border-radius: 10rpx;
|
||
|
display: flex;
|
||
|
justify-content: space-around;
|
||
|
align-items: center;
|
||
|
}
|
||
|
.textSize {
|
||
|
font-size: 30rpx;
|
||
|
font-weight: 550;
|
||
|
}
|
||
|
.imgwh {
|
||
|
width: 68rpx;
|
||
|
height: 68rpx;
|
||
|
}
|
||
|
.list {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
margin-bottom: 15rpx;
|
||
|
|
||
|
.listName {
|
||
|
font-weight: bolder;
|
||
|
color: #454545;
|
||
|
font-size: 30rpx;
|
||
|
margin-right: 50rpx;
|
||
|
}
|
||
|
|
||
|
.status {
|
||
|
color: #fff;
|
||
|
background-color: #f5a233;
|
||
|
padding: 0 15rpx;
|
||
|
border-radius: 10rpx;
|
||
|
margin-left: 20rpx;
|
||
|
height: 42rpx;
|
||
|
line-height: 42rpx;
|
||
|
font-size: 26rpx !important;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.listName {
|
||
|
font-weight: bolder;
|
||
|
color: #454545;
|
||
|
font-size: 30rpx;
|
||
|
margin-right: 50rpx;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</style>
|