This commit is contained in:
Teng 2025-12-16 11:05:37 +08:00
parent da753516af
commit 2428c26dd8
2 changed files with 163 additions and 83 deletions

View File

@ -1,16 +1,18 @@
<template> <template>
<view> <view>
<scroll-view scroll-y="true" class="itembox" scroll-with-animation @scrolltolower="scrolltolower()" enable-back-to-top> <scroll-view scroll-y="true" class="itembox" scroll-with-animation @scrolltolower="scrolltolower()"
enable-back-to-top>
<view class="box"> <view class="box">
<view class="fler" v-for="(v,index) in InvoicingList" :key="index"> <view class="fler" v-for="(v,index) in InvoicingList" :key="index">
<scroll-view class="carditem guodu" @touchend="handleTouchEnd($event,v,index)" <scroll-view class="carditem guodu" @touchend="handleTouchEnd($event,v,index)"
@touchstart="touchstart($event,v,index)" scroll-with-animation scroll-x="true" @touchstart="touchstart($event,v,index)" scroll-with-animation scroll-x="true"
:scroll-left="v.scrollleft" @scroll="scroll" > :scroll-left="v.scrollleft" @scroll="scroll">
<view class="zding" v-if="v.zhiDingId"> <view class="zding" v-if="v.zhiDingId">
<image src="/static/index/procurement/zd.png" mode="aspectFill"></image> <image src="/static/index/procurement/zd.png" mode="aspectFill"></image>
</view> </view>
<view class="speitem guodu" > <view class="speitem guodu">
<image :src="v.materialInfo?.materialImg?serverUrl+v.materialInfo?.materialImg:'/static/index/procurement/k.png'" <image
:src="v.materialInfo?.materialImg?serverUrl+v.materialInfo?.materialImg:'/static/index/procurement/k.png'"
mode="aspectFill"> mode="aspectFill">
</image> </image>
<view class="cardp"> <view class="cardp">
@ -18,12 +20,12 @@
<view v-if="v.materialInfo?.typeName">{{v.materialInfo?.typeName}}</view> <view v-if="v.materialInfo?.typeName">{{v.materialInfo?.typeName}}</view>
</view> </view>
</view> </view>
<view class="msitem guodu" > <view class="msitem guodu">
<view> <view>
<view>{{v.materialInfo?.materialName}}</view> <view>{{v.materialInfo?.materialName}}</view>
</view> </view>
<view> <view>
<text style="white-space: nowrap;"> 规格型号: </text> <text style="white-space: nowrap;"> 规格型号: </text>
<view>{{v.materialInfo?.specificationModel}}</view> <view>{{v.materialInfo?.specificationModel}}</view>
</view> </view>
<view> <view>
@ -37,11 +39,16 @@
</view> </view>
</view> </view>
</view> </view>
<view class="add" > <view class="add">
<view v-if="v.isAdd==1">已添加</view> <view v-if="v.isAdd==1">已添加</view>
<!-- <image v-if="v.isAdd!=1" :src="'/static/index/procurement/+.png'" mode="aspectFill"></image> <!-- <image v-if="v.isAdd!=1" :src="'/static/index/procurement/+.png'" mode="aspectFill"></image>
<image v-if="v.isAdd==1" :src="'/static/index/procurement/-.png'" mode="aspectFill"></image> --> <image v-if="v.isAdd==1" :src="'/static/index/procurement/-.png'" mode="aspectFill"></image> -->
</view> </view>
<view class="nextadd" @click.stop="clkzk(v,index)">
<image class="guodu" :style="v.zk?'transform: rotate(180deg);':''"
:src="'/static/index/procurement/l.png'" mode="aspectFill"></image>
</view>
<view class="zkadd guodu" v-if="status<2"> <view class="zkadd guodu" v-if="status<2">
<view @click.stop="comfig(v,index,1)" @touchend.stop> <view @click.stop="comfig(v,index,1)" @touchend.stop>
添加物料 添加物料
@ -49,16 +56,17 @@
</view> </view>
</scroll-view> </scroll-view>
</view> </view>
<defaultr cont="暂无数据" v-if="InvoicingList.length==0 " style="position: absolute;width: 10vw;height: 10vw;"></defaultr> <defaultr cont="暂无数据" v-if="InvoicingList.length==0 "
style="position: absolute;width: 10vw;height: 10vw;"></defaultr>
</view> </view>
</scroll-view> </scroll-view>
<taking :show="tuihuoshow" :objtake="tuihuoobj" @fill="tuihuoshow = false" @right="right"></taking> <taking :show="tuihuoshow" :objtake="tuihuoobj" @fill="tuihuoshow = false" @right="right"></taking>
<errorshow :show="openerror" :font="errmsg" @close="openerror=false" /> <errorshow :show="openerror" :font="errmsg" @close="openerror=false" />
</view> </view>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue'; import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
import taking from './takeing.vue' import taking from './takeing.vue'
import defaultr from '../components/default.vue' import defaultr from '../components/default.vue'
@ -76,24 +84,43 @@
const carnum = ref(0) const carnum = ref(0)
const caigouobj = ref({}) const caigouobj = ref({})
const serverUrl = ref(uni.getStorageSync('serverUrl') + '/sys/common/static/') const serverUrl = ref(uni.getStorageSync('serverUrl') + '/sys/common/static/')
const emit = defineEmits([ 'scrolltolower' ,'comfig']) const emit = defineEmits(['scrolltolower', 'comfig'])
const pageX = ref(0); const pageX = ref(0);
const pageY = ref(0); const pageY = ref(0);
const ones = ref(true) const ones = ref(true)
const touchstart = (event : any, v : any,i:number) => { const clkzk = (v : any, i : number) => {
if(v.zk==true){
v.zk = false;
v.scrollleft =0.01
setTimeout(()=>{
v.scrollleft = 0
},20)
}else{
v.zk = true;
v.scrollleft =149.99
setTimeout(()=>{
v.scrollleft = 150;
},20)
}
solleft(v,i)
}
const touchstart = (event : any, v : any, i : number) => {
caigouobj.value = v; caigouobj.value = v;
pageX.value = event.changedTouches[0].pageX; pageX.value = event.changedTouches[0].pageX;
pageY.value = event.changedTouches[0].pageY; pageY.value = event.changedTouches[0].pageY;
if(ones.value){ if (ones.value) {
ones.value = false; ones.value = false;
solleft(v, i) solleft(v, i)
} }
} }
const tuihuoshow = ref(false) const tuihuoshow = ref(false)
const tuihuoobj = ref({}) const tuihuoobj = ref({})
const comfig=(v,i,t)=>{ const comfig = (v, i, t) => {
if(props.status == '0'){ if (props.status == '0') {
errmsg.value = '未开始服务不能添加退货物料!'; errmsg.value = '未开始服务不能添加退货物料!';
openerror.value = true; openerror.value = true;
return return
@ -103,8 +130,8 @@
// emit('comfig',v,i,t) // emit('comfig',v,i,t)
} }
const right = (e,v) =>{ const right = (e, v) => {
emit('comfig',e,v); emit('comfig', e, v);
tuihuoshow.value = false; tuihuoshow.value = false;
} }
const handleTouchEnd = (event : any, v : any, i : number) => { const handleTouchEnd = (event : any, v : any, i : number) => {
@ -113,29 +140,29 @@
let absx = Math.abs(x - pageX.value) let absx = Math.abs(x - pageX.value)
let absy = Math.abs(y - pageY.value); let absy = Math.abs(y - pageY.value);
ones.value = true; ones.value = true;
if (absy > 30 && absx+10<absy) { if (absy > 30 && absx + 10 < absy) {
caigouobj.value.scrollleft = 0.01 caigouobj.value.scrollleft = 0.01
setTimeout(()=>{ setTimeout(() => {
caigouobj.value.scrollleft = 0 caigouobj.value.scrollleft = 0
},20) }, 20)
return return
} }
if (absx < 10 && absy < 10) { if (absx < 10 && absy < 10) {
if(caigouobj.value.zk==false){ if (caigouobj.value.zk == false) {
setTimeout(()=>{ setTimeout(() => {
caigouobj.value.scrollleft = 0 caigouobj.value.scrollleft = 0
},20) }, 20)
} }
return return
} }
if(scrollLeft.value <=40){ if (scrollLeft.value <= 40) {
caigouobj.value.scrollleft = scrollLeft.value; caigouobj.value.scrollleft = scrollLeft.value;
caigouobj.value.zk = false; caigouobj.value.zk = false;
nextTick(()=>{ nextTick(() => {
caigouobj.value.scrollleft = 0; caigouobj.value.scrollleft = 0;
scrollLeft.value = 0; scrollLeft.value = 0;
}) })
}else{ } else {
scrollLeft.value = 150 scrollLeft.value = 150
caigouobj.value.scrollleft = scrollLeft.value; caigouobj.value.scrollleft = scrollLeft.value;
caigouobj.value.zk = true; caigouobj.value.zk = true;
@ -146,17 +173,17 @@
const solleft = (v : any, i : number) => { const solleft = (v : any, i : number) => {
console.log(v) console.log(v)
props.InvoicingList.forEach((item, k) => { props.InvoicingList.forEach((item, k) => {
if (k != i&&item.zk==true) { if (k != i && item.zk == true) {
item.zk = false; item.zk = false;
item.scrollleft = 0; item.scrollleft = 0;
} }
}) })
} }
const scrolltolower = () => { const scrolltolower = () => {
emit('scrolltolower') emit('scrolltolower')
} }
const scrollLeft = ref(0) const scrollLeft = ref(0)
const scroll = (e)=>{ const scroll = (e) => {
scrollLeft.value = e.detail.scrollLeft scrollLeft.value = e.detail.scrollLeft
// console.log(e.detail.scrollLeft) // console.log(e.detail.scrollLeft)
} }
@ -171,10 +198,12 @@
position: absolute; position: absolute;
top: 0; top: 0;
right: -9vw; right: -9vw;
view:active{
background:rgba(85, 166, 249, 1) !important; view:active {
background: rgba(85, 166, 249, 1) !important;
color: #FFFFFF !important; color: #FFFFFF !important;
} }
>view { >view {
width: 3.6vw; width: 3.6vw;
height: 100%; height: 100%;
@ -185,21 +214,22 @@
align-items: center; align-items: center;
writing-mode: vertical-rl; writing-mode: vertical-rl;
text-orientation: upright; text-orientation: upright;
letter-spacing:2px; letter-spacing: 2px;
background:rgba(85, 166, 249, 1) !important; background: rgba(85, 166, 249, 1) !important;
color: #FFFFFF !important; color: #FFFFFF !important;
} }
} }
.add { .add {
width:5vw; width: 5vw;
height: 13vw; height: 13vw;
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
position: absolute; position: absolute;
top:0; top: 0;
right:0.8vw; right: 0.8vw;
>view { >view {
width: 4.5vw; width: 4.5vw;
height: 1.8vw; height: 1.8vw;
@ -225,12 +255,14 @@
right: 0vw; right: 0vw;
} }
} }
.msitem { .msitem {
width: 11vw; width: 11vw;
height: 100%; height: 100%;
position: absolute; position: absolute;
top:0; top: 0;
left: 10vw; left: 10vw;
>view { >view {
margin-top: 0vw; margin-top: 0vw;
@ -239,22 +271,26 @@
height: 3.4vw; height: 3.4vw;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
>view { >view {
width: 50%; width: 50%;
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative; position: relative;
margin-top:1vw; margin-top: 1vw;
white-space: nowrap; white-space: nowrap;
&:nth-child(1){
&:nth-child(1) {
padding-right: 1.7vw; padding-right: 1.7vw;
align-items: flex-start; align-items: flex-start;
} }
&:nth-child(2){
&:nth-child(2) {
padding-left: 1.7vw; padding-left: 1.7vw;
align-items: flex-start; align-items: flex-start;
} }
&:nth-child(1)::after { &:nth-child(1)::after {
content: ''; content: '';
position: absolute; position: absolute;
@ -282,12 +318,13 @@
} }
} }
&:nth-child(2) { &:nth-child(2) {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-direction: column; flex-direction: column;
margin-top: 0.1vw; margin-top: 0.1vw;
view{
view {
font-size: 1.4vw; font-size: 1.4vw;
color: #888888; color: #888888;
text-overflow: ellipsis; text-overflow: ellipsis;
@ -304,7 +341,7 @@
} }
&:nth-child(1) { &:nth-child(1) {
view{ view {
display: inline-block; display: inline-block;
width: 10vw; width: 10vw;
font-weight: bold; font-weight: bold;
@ -319,34 +356,39 @@
} }
} }
} }
.zding{
.zding {
width: 4.6vw; width: 4.6vw;
height: 4.6vw; height: 4.6vw;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
z-index: 11; z-index: 11;
image{
image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.speitem { .speitem {
width: 10vw; width: 10vw;
height: 100%; height: 100%;
display: inline-flex; display: inline-flex;
flex-direction: column; flex-direction: column;
position: absolute; position: absolute;
top:0; top: 0;
left: 0; left: 0;
.cardp { .cardp {
width:8vw; width: 8vw;
height: 4.2vw; height: 4.2vw;
display: flex; display: flex;
margin: 0 auto; margin: 0 auto;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
view { view {
min-width: 5.5vw; min-width: 5.5vw;
height: 1.8vw; height: 1.8vw;
@ -372,25 +414,28 @@
.itembox{ .itembox {
width: 100%; width: 100%;
height: calc(100vh - 22vw); height: calc(100vh - 22vw);
padding:1vw 0.5vw 1vw; padding: 1vw 0.5vw 1vw;
background: #fff; background: #fff;
.box{
.box {
width: 100%; width: 100%;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
// display: grid; // display: grid;
// grid-template-columns: 1fr 1fr; // grid-template-columns: 1fr 1fr;
} }
.fler{
.fler {
width: 31.5vw; width: 31.5vw;
height: 13vw; height: 13vw;
margin-bottom: 0.9vw; margin-bottom: 0.9vw;
margin-left: 0.5vw; margin-left: 0.5vw;
.carditem{
.carditem {
width: 31vw; width: 31vw;
height: 13vw; height: 13vw;
background: rgba(245, 246, 248, 1); background: rgba(245, 246, 248, 1);
@ -400,4 +445,45 @@
} }
} }
} }
.nextadd {
position: absolute;
right: 0;
top: -2vw;
width: 6vw;
height: 17vw;
display: inline-flex;
justify-content: center;
align-items: center;
>view {
width: 4.5vw;
height: 1.9vw;
background: #E3EEF7;
border-radius: 0.9vw;
border: 1px solid rgba(3, 133, 250, 0.34);
font-weight: 400;
font-size: 1.1vw;
color: #1083F8;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0vw;
right: 0vw;
}
image {
width: 3vw;
height: 3vw;
}
}
.guodu {
transition: .4s;
-webkit-transform-style: preserve-3d;
-webkit-overflow-scrolling: touch;
}
</style> </style>

View File

@ -108,13 +108,7 @@
} }
const caigouobj = ref({}) const caigouobj = ref({})
const clkzk = (v : any, i : number) => { const clkzk = (v : any, i : number) => {
// caigouobj.value = v;
// caigouobj.value.Limitnum = Number(caigouobj.value?.upperLimit) - Number(caigouobj.value.kcsl);
// caigouobj.value.index = i;
// caigouobj.value.yj = false;
// let n = caigouobj.value.suppliers_dictText.split(/[, ]+/);
// let id = caigouobj.value.suppliers.split(/[, ]+/);
// let obj = {id:id[0],name:n[0]}
if(v.zk==true){ if(v.zk==true){
v.zk = false; v.zk = false;
v.scrollleft = 0 v.scrollleft = 0