同步代码
This commit is contained in:
GaoHao
491
pageConsumables/index.vue
Normal file
491
pageConsumables/index.vue
Normal file
@@ -0,0 +1,491 @@
|
||||
<template>
|
||||
<view class="ConsumablesTop">
|
||||
<view @tap="showStatus = !showStatus" style="display: flex;align-items: center;">
|
||||
{{datas.title}}<up-icon name="arrow-down" size="12"></up-icon>
|
||||
</view>
|
||||
<view>
|
||||
<input v-model="datas.conName" @input="inputEvent" type="text" placeholder="请输入耗材名称" />
|
||||
</view>
|
||||
<view @tap="toUrl('PAGES_ADD_TYPE') ">
|
||||
新增类别
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view :style="{height:showStatus?statusHeight:0}" class="tranistion status overflow-hide">
|
||||
<view @tap="changeNowStatusIndex(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
|
||||
v-for="(item,index) in datas.typeLists" :key="index">
|
||||
<view :class="{'color-main':nowStatusIndex===index}">{{item}}</view>
|
||||
<uni-icons v-if="nowStatusIndex===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
|
||||
</view>
|
||||
<view :style="{height: '14px'}"></view>
|
||||
</view>
|
||||
|
||||
<view class="ConsumablesConent" v-if="datas.list.length">
|
||||
<view v-for="(item,index) in datas.list" :key="index">
|
||||
<view>
|
||||
{{item.conName}}
|
||||
<view> {{item.conTypeName}} </view>
|
||||
</view>
|
||||
<view>
|
||||
<view>
|
||||
<view style="color: #333333;">
|
||||
{{item.conUnit}}
|
||||
</view>
|
||||
<view>
|
||||
耗材单位
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view style="color: #318AFE;">
|
||||
{{item.stockNumber-item.stockConsume}}
|
||||
</view>
|
||||
<view>
|
||||
剩余库存
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view style="background-color: #fff;" @tap="show=true;showData = filtersSproductId(item.product)">
|
||||
所属商品:
|
||||
{{ filtersSproductId(item.product).length>7?filtersSproductId(item.product).substring(0,6)+'...':filtersSproductId(item.product)}}
|
||||
</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-action-sheet @itemClick="sheetClick" ref="refMoreSheet" :list="actionSheet.list"></my-action-sheet>
|
||||
<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>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import myActionSheet from './components/my-action-sheet';
|
||||
import myReportDamage from './components/my-reportDamage';
|
||||
import color from '@/commons/color.js';
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
computed
|
||||
} from 'vue';
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import go from '@/commons/utils/go.js';
|
||||
import {
|
||||
hasPermission
|
||||
} from '@/commons/utils/hasPermission.js';
|
||||
import {
|
||||
viewConInfoFlowget,
|
||||
tbConsType,
|
||||
tbConsTypeList
|
||||
} from '@/http/yskApi/requestAll.js';
|
||||
let reportDamage = ref(null)
|
||||
let refMoreSheet = ref(null)
|
||||
let show = ref(false)
|
||||
let showData = ref()
|
||||
const report = reactive({
|
||||
data: {
|
||||
// thumbnail: 'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/20240918/a17a62b7b55a4b65a2a2542050672b34.png',
|
||||
name: "美式咖啡",
|
||||
// title: "商品报损",
|
||||
unit: "杯",
|
||||
},
|
||||
})
|
||||
let datas = reactive({
|
||||
list: [],
|
||||
conName: "",
|
||||
showtwo: false,
|
||||
status: '0',
|
||||
// 类型列表
|
||||
typeList: [],
|
||||
// 类型列表渲染数组
|
||||
typeLists: ['全部'],
|
||||
title: '耗材类型'
|
||||
})
|
||||
const statusHeight = computed(() => {
|
||||
return 30 * datas.typeLists.length + 14 + 'px'
|
||||
})
|
||||
|
||||
const actionSheet = reactive({
|
||||
list: ['报损', '编辑', '清点', '入库', '出库', ],
|
||||
activeId: null,
|
||||
active: ""
|
||||
})
|
||||
let showStatus = ref(false)
|
||||
let nowStatusIndex = ref(0)
|
||||
onShow(() => {
|
||||
getList()
|
||||
// 获取分类列表
|
||||
gettbConsTypeList()
|
||||
})
|
||||
|
||||
function changeNowStatusIndex(i) {
|
||||
nowStatusIndex.value = i
|
||||
showStatus.value = false
|
||||
if (i == 0) {
|
||||
datas.title = '全部'
|
||||
getList()
|
||||
} else {
|
||||
datas.title = datas.typeList[i - 1].conTypeName
|
||||
getList(datas.typeList[i - 1].id)
|
||||
}
|
||||
}
|
||||
let gettbConsTypeList = () => {
|
||||
datas.typeLists = ['全部']
|
||||
tbConsTypeList({
|
||||
page: 0,
|
||||
size: 30,
|
||||
shopId: uni.getStorageSync("shopId"),
|
||||
}).then(res => {
|
||||
datas.typeList = res.content
|
||||
res.content.forEach(ele => {
|
||||
datas.typeLists.push(ele.conTypeName)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 报损确认
|
||||
*/
|
||||
function affirm() {
|
||||
getList()
|
||||
// 获取分类列表
|
||||
gettbConsTypeList()
|
||||
}
|
||||
|
||||
let toggle = (d) => {
|
||||
refMoreSheet.value.open()
|
||||
actionSheet.active = d
|
||||
actionSheet.activeId = d.id
|
||||
report.data.consId = d.id
|
||||
}
|
||||
|
||||
let sheetClick = (index) => {
|
||||
if (index == 0) {
|
||||
// 权限
|
||||
hasPermission('允许提交报损').then(ele => {
|
||||
if (ele) {
|
||||
//打开报损弹窗
|
||||
reportDamage.value.open(actionSheet.activeId);
|
||||
report.data.name = actionSheet.active.conName
|
||||
report.data.unit = actionSheet.active.conUnit
|
||||
}
|
||||
})
|
||||
} else if (index == 1) {
|
||||
toUrl('PAGES_EDIT_CONSUMABLES', {
|
||||
item: JSON.stringify(actionSheet.active)
|
||||
})
|
||||
} else if (index == 2) {
|
||||
hasPermission('允许耗材盘点').then(ele => {
|
||||
if (ele) {
|
||||
toUrl('PAGES_SALES_INVENTORYCHECK', {
|
||||
item: JSON.stringify(actionSheet.active)
|
||||
})
|
||||
}
|
||||
})
|
||||
} else if (index == 3) {
|
||||
hasPermission('允许耗材入库').then(ele => {
|
||||
if (ele) {
|
||||
toUrl('PAGES_SALES_WAREHOUSEENTRY', {
|
||||
consId: actionSheet.activeId,
|
||||
item: JSON.stringify(actionSheet.active)
|
||||
})
|
||||
}
|
||||
})
|
||||
} else if (index == 4) {
|
||||
hasPermission('允许耗材出库').then(ele => {
|
||||
if (ele) {
|
||||
toUrl('PAGES_SALES_OUTBOUND', {
|
||||
consId: actionSheet.activeId,
|
||||
item: JSON.stringify(actionSheet.active)
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
// async function viewpermission(d) {
|
||||
// let res = await hasPermission(d)
|
||||
// return res
|
||||
// }
|
||||
async function getList(d = "") {
|
||||
viewConInfoFlowget({
|
||||
shopId: uni.getStorageSync("shopId"),
|
||||
conName: datas.conName,
|
||||
conTypeId: d,
|
||||
size: 100,
|
||||
page: 0
|
||||
}).then(res => {
|
||||
datas.list = res.content
|
||||
})
|
||||
}
|
||||
|
||||
function inputEvent(d) {
|
||||
datas.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;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user