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

<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>