480 lines
10 KiB
Vue
480 lines
10 KiB
Vue
<template>
|
|
<view class="ConsumablesTop">
|
|
<view @tap="pageData.show = !pageData.show" style="display: flex; align-items: center">
|
|
{{ pageData.title }}
|
|
<up-icon name="arrow-down" size="12"></up-icon>
|
|
</view>
|
|
<view>
|
|
<input v-model="pageData.query.conName" @input="inputEvent" type="text" placeholder="请输入耗材名称" />
|
|
</view>
|
|
<view @tap="toUrl('PAGES_ADD_TYPE')">新增类别</view>
|
|
</view>
|
|
|
|
<view class="ConsumablesConent" v-if="pageData.list.length">
|
|
<view v-for="(item, index) in pageData.list" :key="index">
|
|
<view>
|
|
{{ item.conName }}
|
|
<view>{{ item.consGroupName }}</view>
|
|
</view>
|
|
<view>
|
|
<view>
|
|
<view style="color: #333333">{{ item.conUnit }}</view>
|
|
<view>耗材单位</view>
|
|
</view>
|
|
<view>
|
|
<view style="color: #318afe">{{ item.stockNumber }}</view>
|
|
<view>剩余库存</view>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<view
|
|
style="background-color: #fff"
|
|
@tap="
|
|
show = true;
|
|
showData = filtersSproductId(item.productList);
|
|
"
|
|
>
|
|
所属商品:
|
|
{{ filtersSproductId(item.productList).length > 7 ? filtersSproductId(item.productList).substring(0, 6) + '...' : filtersSproductId(item.productList) }}
|
|
</view>
|
|
<view class="">
|
|
<up-button
|
|
shape="circle"
|
|
type="primary"
|
|
size="mini"
|
|
color="#999"
|
|
@tap="toUrl('PAGES_VIEWRECORDS', { item: JSON.stringify(item) })"
|
|
:plain="true"
|
|
text="查看记录"
|
|
></up-button>
|
|
|
|
<up-button type="primary" shape="circle" size="mini" @click="toggle(item)" :plain="true" text="更多操作"></up-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="background-color: rgba(0, 0, 0, 0); height: 200rpx"></view>
|
|
</view>
|
|
<view v-else style="text-align: center">
|
|
<image src="./bg.png" style="width: 325rpx; height: 335rpx" mode=""></image>
|
|
<view style="font-size: 28rpx; color: #999">暂无数据</view>
|
|
</view>
|
|
<view class="ConsumablesBottom">
|
|
<view @tap="toUrl('PAGES_ADD_CONSUMABLES')">新增耗材</view>
|
|
<view @tap="toUrl('PAGES_SUPPLIER')">供应商管理</view>
|
|
</view>
|
|
<my-reportDamage ref="reportDamage" title="耗材报损" :item="report.data" @affirm="affirm"></my-reportDamage>
|
|
<up-popup :show="show" :round="18" mode="center">
|
|
<view class="zhezhaopop">
|
|
<view class="">
|
|
<span></span>
|
|
<span></span>
|
|
<up-icon @tap="show = false" name="close-circle-fill"></up-icon>
|
|
</view>
|
|
<view class="">
|
|
{{ showData }}
|
|
</view>
|
|
</view>
|
|
</up-popup>
|
|
<up-action-sheet :round="10" @select="actionSelect" @close="actions.show = false" cancelText="取消" :actions="actions.list" :show="actions.show"></up-action-sheet>
|
|
<up-picker :show="pageData.show" :columns="pageData.typeList" keyName="name" @cancel="pageData.show = false" @confirm="confirmConsGroup"></up-picker>
|
|
<!-- 批量入库悬浮按钮 -->
|
|
<view class="fixed-in-btn" @click="toBatchPage">
|
|
<image class="img" src="https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/4/bd8cde310fc247f6855ad39fbda4d75d.png" mode="widthFix"></image>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { onShow, onLoad } from '@dcloudio/uni-app';
|
|
import { ref, reactive, computed } from 'vue';
|
|
import myReportDamage from './components/my-reportDamage';
|
|
|
|
import go from '@/commons/utils/go.js';
|
|
import { hasPermission } from '@/commons/utils/hasPermission.js';
|
|
import { getConsPage, getConsGrpupList } from '@/http/api/cons.js';
|
|
|
|
let reportDamage = ref(null);
|
|
let show = ref(false);
|
|
let showData = ref();
|
|
const report = reactive({
|
|
data: {
|
|
name: '美式咖啡',
|
|
unit: '杯'
|
|
}
|
|
});
|
|
let pageData = reactive({
|
|
show: false,
|
|
query: {
|
|
conName: '',
|
|
consGroupId: '',
|
|
size: 100,
|
|
page: 1
|
|
},
|
|
list: [],
|
|
// 类型列表
|
|
typeList: [],
|
|
title: '耗材类型'
|
|
});
|
|
|
|
/**
|
|
* 更多操作列表
|
|
*/
|
|
const actions = reactive({
|
|
list: [
|
|
{ name: '报损', color: 'red', fontSize: '16' },
|
|
{ name: '编辑', color: '#333', fontSize: '16' },
|
|
{ name: '清点', color: '#333', fontSize: '16' },
|
|
{ name: '入库', color: '#333', fontSize: '16' },
|
|
{ name: '出库', color: '#333', fontSize: '16' }
|
|
],
|
|
data: null,
|
|
show: false
|
|
});
|
|
|
|
onShow(() => {
|
|
getList();
|
|
gettbConsTypeList();
|
|
});
|
|
|
|
// 跳转去批量入库
|
|
function toBatchPage() {
|
|
uni.navigateTo({
|
|
url: '/pageConsumables/batch_in'
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 获取耗材列表
|
|
*/
|
|
async function getList() {
|
|
getConsPage(pageData.query).then((res) => {
|
|
pageData.list = res.records;
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 获取耗材类别
|
|
*/
|
|
let gettbConsTypeList = () => {
|
|
getConsGrpupList({
|
|
page: 1,
|
|
size: 30
|
|
}).then((res) => {
|
|
pageData.typeList = [[{ name: '全部', id: '' }, ...res]];
|
|
});
|
|
};
|
|
|
|
function confirmConsGroup(e) {
|
|
pageData.show = false;
|
|
pageData.query.consGroupId = e.value[0].id;
|
|
pageData.title = e.value[0].name;
|
|
getList();
|
|
}
|
|
|
|
/**
|
|
* 报损确认
|
|
*/
|
|
function affirm() {
|
|
uni.showToast({
|
|
title: '操作成功',
|
|
icon: 'none'
|
|
});
|
|
getList();
|
|
// 获取分类列表
|
|
gettbConsTypeList();
|
|
}
|
|
|
|
let toggle = (d) => {
|
|
// refMoreSheet.value.open()
|
|
actions.show = true;
|
|
actions.actions = d;
|
|
report.data.consId = d.id;
|
|
};
|
|
|
|
let actionSelect = (e) => {
|
|
if (e.name == '报损') {
|
|
// 权限
|
|
hasPermission('允许提交报损').then((ele) => {
|
|
if (ele) {
|
|
//打开报损弹窗
|
|
reportDamage.value.open(actions.actions.id);
|
|
report.data.name = actions.actions.conName;
|
|
report.data.unit = actions.actions.conUnit;
|
|
}
|
|
});
|
|
} else if (e.name == '编辑') {
|
|
toUrl('PAGES_ADD_CONSUMABLES', {
|
|
item: JSON.stringify(actions.actions)
|
|
});
|
|
} else if (e.name == '清点') {
|
|
hasPermission('允许耗材盘点').then((ele) => {
|
|
if (ele) {
|
|
toUrl('PAGES_SALES_INVENTORYCHECK', {
|
|
item: JSON.stringify(actions.actions)
|
|
});
|
|
}
|
|
});
|
|
} else if (e.name == '入库') {
|
|
hasPermission('允许耗材入库').then((ele) => {
|
|
if (ele) {
|
|
toUrl('PAGES_SALES_WAREHOUSEENTRY', {
|
|
consId: actions.actions.id,
|
|
item: JSON.stringify(actions.actions)
|
|
});
|
|
}
|
|
});
|
|
} else if (e.name == '出库') {
|
|
hasPermission('允许耗材出库').then((ele) => {
|
|
if (ele) {
|
|
toUrl('PAGES_SALES_OUTBOUND', {
|
|
consId: actions.actions.id,
|
|
item: JSON.stringify(actions.actions)
|
|
});
|
|
}
|
|
});
|
|
}
|
|
};
|
|
|
|
function inputEvent(d) {
|
|
pageData.query.conName = d.detail.value.replace(/\s*/g, '');
|
|
getList();
|
|
}
|
|
|
|
function filtersSproductId(d) {
|
|
if (!d) return '';
|
|
// const dataArr = d.split(',')
|
|
let str = '';
|
|
d.forEach((ele) => {
|
|
// str += ele.name
|
|
// const startIndex = ele.indexOf('_')
|
|
// const productId = ele.slice(0, startIndex)
|
|
// const productName = ele.slice(startIndex + 1, ele.length)
|
|
str = ele.name + ',' + str;
|
|
});
|
|
return str;
|
|
}
|
|
let toUrl = (url, d) => {
|
|
go.to(url, d);
|
|
};
|
|
</script>
|
|
<style>
|
|
page {
|
|
background-color: #f9f9f9;
|
|
}
|
|
</style>
|
|
<style scoped lang="less">
|
|
ul,
|
|
li {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
|
|
.ConsumablesTop {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
padding-bottom: 22rpx;
|
|
background-color: #fff;
|
|
|
|
> view:first-child,
|
|
> view:last-child {
|
|
font-size: 24rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
|
|
> view:last-child {
|
|
color: #318afe;
|
|
}
|
|
|
|
> view:nth-child(2) {
|
|
width: 414rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
background: #f9f9f9;
|
|
border-radius: 32rpx 32rpx 32rpx 32rpx;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #999999;
|
|
}
|
|
}
|
|
|
|
.ConsumablesConent {
|
|
min-height: 80vh;
|
|
background-color: #f9f9f9;
|
|
padding-top: 1rpx;
|
|
|
|
> view {
|
|
width: 694rpx;
|
|
height: 332rpx;
|
|
background: #ffffff;
|
|
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
|
padding: 32rpx 16rpx;
|
|
box-sizing: border-box;
|
|
margin: 32rpx auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
> view:first-child {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
.df;
|
|
|
|
> view {
|
|
// width: 90rpx;
|
|
padding: 2rpx 10rpx;
|
|
height: 36rpx;
|
|
line-height: 36rpx;
|
|
background: #ebf4fc;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
text-align: center;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #318afe;
|
|
margin-left: 12rpx;
|
|
}
|
|
}
|
|
|
|
> view:nth-child(2) {
|
|
width: 662rpx;
|
|
height: 128rpx;
|
|
background: #f9f9f9;
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
.df;
|
|
justify-content: space-around;
|
|
text-align: center;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #666666;
|
|
}
|
|
|
|
> view:last-child {
|
|
.df;
|
|
justify-content: space-between;
|
|
|
|
> view:last-child {
|
|
.df;
|
|
|
|
> button {
|
|
width: 128rpx;
|
|
height: 48rpx;
|
|
background: #ffffff;
|
|
// border-radius: 28rpx 28rpx 28rpx 28rpx;
|
|
}
|
|
|
|
> button:last-child {
|
|
margin-left: 24rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.ConsumablesBottom {
|
|
.df;
|
|
position: fixed;
|
|
bottom: 20rpx;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
|
|
> view {
|
|
width: 346rpx;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
border: 2rpx solid #318afe;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
}
|
|
|
|
> view:first-child {
|
|
border-radius: 56rpx 0rpx 0rpx 56rpx;
|
|
color: #318afe;
|
|
background-color: #fff;
|
|
}
|
|
|
|
> view:last-child {
|
|
border-radius: 0 56rpx 56rpx 0;
|
|
background-color: #318afe;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.popup-content {
|
|
padding: 15px;
|
|
background-color: #fff;
|
|
margin: 0 auto;
|
|
|
|
> view {
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
width: 660rpx;
|
|
border-top: 10rpx solid #f9f9f9;
|
|
text-align: center;
|
|
}
|
|
|
|
.operate {
|
|
> view {
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
text-align: center;
|
|
width: 660rpx;
|
|
border-bottom: 2rpx solid #e5e5e5;
|
|
}
|
|
}
|
|
}
|
|
|
|
.status {
|
|
position: absolute;
|
|
// top: 100%;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 10;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.zhezhaopop {
|
|
padding: 34rpx 32rpx;
|
|
width: 594rpx;
|
|
|
|
> view:first-child {
|
|
.df;
|
|
justify-content: space-between;
|
|
|
|
> span:nth-child(2) {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
|
|
.df() {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.fixed-in-btn {
|
|
position: fixed;
|
|
right: 20upx;
|
|
bottom: 20%;
|
|
z-index: 999;
|
|
.img {
|
|
width: 120upx;
|
|
}
|
|
}
|
|
</style>
|