2025-11-07 17:31:30 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<view class="plsbuy-contain" v-if="show">
|
|
|
|
|
|
<view class="gys">
|
|
|
|
|
|
<view class="tlt">供应商</view>
|
|
|
|
|
|
<view class="gssel" @click="gysflag = true">
|
|
|
|
|
|
<view>
|
|
|
|
|
|
{{gysarr[gysidnum]?.name}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<text @click.stop="gysflag = !gysflag">调整</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="tanchu" v-if="gysflag">
|
|
|
|
|
|
<scroll-view scroll-y="true" class="gysscrol">
|
|
|
|
|
|
<view v-for="(v,i) in gysarr" :key='i' :class="gysidnum==i?'acts':''" @click="gysid(i)">
|
|
|
|
|
|
<text>{{v.name}}</text>
|
|
|
|
|
|
<image src="/static/index/warehouse/procurement/d.png" mode="aspectFill"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="calculator-father">
|
|
|
|
|
|
<view v-for="(item,index) in calculatorArray" :key="index">
|
|
|
|
|
|
<view :class="blueNumber == index ? `calculator-kuai-target` : ``" class="calculator-kuai"
|
|
|
|
|
|
@click="clickKuai(item,index)">
|
|
|
|
|
|
{{item}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="qinggou-font">
|
|
|
|
|
|
采购数量
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="stringShow-father">
|
|
|
|
|
|
<view class="jj" @click="jjnum(-1)" @longpress="handleTouchStart(-1)" @touchend="handleTouchEnd">
|
|
|
|
|
|
-
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="stringShow-kuai">
|
|
|
|
|
|
<view v-for="(item,index) in stringShow" :key="index" >
|
|
|
|
|
|
{{item}}
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="jj" @click="jjnum(1)" @longpress="handleTouchStart(1)" @touchend="handleTouchEnd">
|
|
|
|
|
|
+
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="plsbuy-bottom">
|
|
|
|
|
|
<view class="quxiao" @click="colse">
|
|
|
|
|
|
取消
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="plsbuy-bottom-blue" @click="closeIt">
|
|
|
|
|
|
确定
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
|
import {
|
|
|
|
|
|
ref,
|
|
|
|
|
|
onMounted,
|
|
|
|
|
|
onBeforeUnmount,
|
|
|
|
|
|
computed,
|
|
|
|
|
|
nextTick,
|
|
|
|
|
|
watch
|
|
|
|
|
|
} from 'vue';
|
|
|
|
|
|
const emit = defineEmits(['right','colse','jjnum'])
|
|
|
|
|
|
const blueNumber = ref(-1);
|
|
|
|
|
|
const gysflag = ref(false)
|
|
|
|
|
|
const gysarr = ref([])
|
|
|
|
|
|
const gysidnum = ref(0)
|
|
|
|
|
|
const props = defineProps({
|
|
|
|
|
|
doOnce: {
|
|
|
|
|
|
type: Number,
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
},
|
|
|
|
|
|
translateNumber: {
|
|
|
|
|
|
type: Number,
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
},
|
|
|
|
|
|
show: {
|
|
|
|
|
|
type: Boolean,
|
|
|
|
|
|
default:false,
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
},
|
|
|
|
|
|
caigouobj:{
|
|
|
|
|
|
type:Object,
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
watch(
|
|
|
|
|
|
() => props.doOnce,
|
|
|
|
|
|
() => {
|
|
|
|
|
|
relNumber.value = props.translateNumber
|
|
|
|
|
|
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
|
|
|
|
|
}
|
|
|
|
|
|
)
|
|
|
|
|
|
watch(
|
|
|
|
|
|
()=>props.show,
|
|
|
|
|
|
()=>{
|
|
|
|
|
|
if(props.show){
|
|
|
|
|
|
console.log(props.caigouobj)
|
|
|
|
|
|
let n = [];
|
|
|
|
|
|
let id = [];
|
|
|
|
|
|
gysarr.value = [];
|
|
|
|
|
|
n = props.caigouobj.suppliers_dictText.split(/[, ]+/);
|
|
|
|
|
|
id = props.caigouobj.suppliers.split(/[, ]+/);
|
|
|
|
|
|
n.forEach((item,i)=>{
|
|
|
|
|
|
gysarr.value.push({'name':item,'id':id[i]})
|
|
|
|
|
|
})
|
2025-11-12 17:32:02 +08:00
|
|
|
|
}else{
|
|
|
|
|
|
gysflag.value = false;
|
|
|
|
|
|
}
|
2025-11-07 17:31:30 +08:00
|
|
|
|
})
|
|
|
|
|
|
const gysid = (e:number)=>{
|
|
|
|
|
|
gysidnum.value = e;
|
|
|
|
|
|
gysflag.value = false;
|
|
|
|
|
|
}
|
|
|
|
|
|
const calculatorArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, "AC", 0, "CE"];
|
|
|
|
|
|
const stringShow = ref("0000");
|
|
|
|
|
|
const relNumber = ref(0);
|
|
|
|
|
|
// const isZero = ref(false);
|
|
|
|
|
|
const clickKuai = (item : any, index : number) => {
|
|
|
|
|
|
blueNumber.value = index;
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
|
blueNumber.value = -1
|
|
|
|
|
|
}, 300)
|
|
|
|
|
|
if (item == "AC") {
|
|
|
|
|
|
relNumber.value = 0;
|
|
|
|
|
|
stringShow.value = "0000"
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
if (item == "CE") {
|
|
|
|
|
|
relNumber.value = Math.trunc(relNumber.value / 10)
|
|
|
|
|
|
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if (digitCountByString(relNumber.value) > 3) {
|
|
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
if (!relNumber.value) {
|
|
|
|
|
|
relNumber.value = item
|
|
|
|
|
|
} else {
|
|
|
|
|
|
relNumber.value = relNumber.value * 10 + item;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
const InteroutId = ref(null)
|
|
|
|
|
|
const handleTouchStart = (e:number)=> {
|
|
|
|
|
|
Interval(e)
|
|
|
|
|
|
}
|
|
|
|
|
|
const handleTouchEnd=()=> {
|
|
|
|
|
|
clearInterval(InteroutId.value);
|
|
|
|
|
|
// 清除定时器
|
|
|
|
|
|
}
|
|
|
|
|
|
const Interval = (e:number)=>{
|
|
|
|
|
|
InteroutId.value = setInterval(() => {
|
|
|
|
|
|
jjnum(e);
|
|
|
|
|
|
}, 120);
|
|
|
|
|
|
}
|
|
|
|
|
|
const jjnum = (e:number)=>{
|
|
|
|
|
|
emit('jjnum',e)
|
|
|
|
|
|
}
|
|
|
|
|
|
const closeIt = () => {
|
|
|
|
|
|
emit('right', relNumber.value,gysarr.value[gysidnum.value])
|
|
|
|
|
|
}
|
|
|
|
|
|
const colse = ()=>{
|
|
|
|
|
|
emit('colse')
|
|
|
|
|
|
}
|
|
|
|
|
|
// 这个方法是查看数字有多少位
|
|
|
|
|
|
function digitCountByString(n) {
|
|
|
|
|
|
// 先处理负数
|
|
|
|
|
|
const s = Math.abs(n).toString();
|
|
|
|
|
|
// 若不想统计小数点,可去掉小数点后再取长度:
|
|
|
|
|
|
// return s.replace('.', '').length;
|
|
|
|
|
|
return s.length;
|
|
|
|
|
|
}
|
|
|
|
|
|
// 这个方法是将Number转为String
|
|
|
|
|
|
function toFixed4ByPadStart(n) {
|
|
|
|
|
|
// 1. 取绝对值并向下取整,防止小数和负号影响
|
|
|
|
|
|
const intPart = Math.floor(Math.abs(n));
|
|
|
|
|
|
// 2. 转字符串并 padStart 到长度 4,不足时前面补 '0'
|
|
|
|
|
|
return String(intPart).padStart(4, '0');
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
|
.gys{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 8vw;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
>.tanchu{
|
|
|
|
|
|
width: 25vw;
|
|
|
|
|
|
height: 7vw;
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
box-shadow: 0rpx 0rpx 0.5vw 0rpx rgba(174,175,176,0.35);
|
|
|
|
|
|
border-radius: 1.1vw;
|
|
|
|
|
|
padding: 0 1.4vw;
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 7.2vw;
|
|
|
|
|
|
top: 7vw;
|
|
|
|
|
|
.gysscrol{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 7vw;
|
|
|
|
|
|
.acts{
|
|
|
|
|
|
color: #0385FA !important;
|
|
|
|
|
|
image{
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
view{
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 1vw;
|
|
|
|
|
|
color: #666666;
|
|
|
|
|
|
margin-bottom: 0.9vw;
|
|
|
|
|
|
&:nth-child(1){
|
|
|
|
|
|
margin-top: 0.9vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
image{
|
|
|
|
|
|
width: 1vw !important;
|
|
|
|
|
|
height: 0.7vw !important;
|
|
|
|
|
|
display: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
.gssel{
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-top: 1vw;
|
|
|
|
|
|
text{
|
|
|
|
|
|
width: 7.1vw;
|
|
|
|
|
|
height: 3.3vw;
|
|
|
|
|
|
background: linear-gradient(-45deg, rgba(223, 244, 252, 0.43), rgba(204, 228, 249, 0.43));
|
|
|
|
|
|
border-radius: 1.65vw;
|
|
|
|
|
|
border: 1px solid #1083F8;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 1.5vw;
|
|
|
|
|
|
color: #1083F8;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
>view{
|
|
|
|
|
|
width: 22vw;
|
|
|
|
|
|
height: 3.3vw;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
font-weight: 400;
|
|
|
|
|
|
font-size: 1.6vw;
|
|
|
|
|
|
color: #555555;
|
|
|
|
|
|
line-height: 3.3vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.tlt{
|
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
font-size: 1.8vw;
|
|
|
|
|
|
color: #333333;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.plsbuy-contain {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 36vw;
|
|
|
|
|
|
height: 90vh;
|
|
|
|
|
|
background: rgba(250, 251, 252, 1);
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
box-shadow: 0rpx 0rpx 1.6vw 0rpx rgba(136,141,153,0.28);
|
|
|
|
|
|
border-radius: 2.2vw;
|
2025-11-10 17:14:13 +08:00
|
|
|
|
top: 5vw;
|
2025-11-07 17:31:30 +08:00
|
|
|
|
left: 32vw;
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
z-index: 200;
|
|
|
|
|
|
padding: 2.8vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.plsbuy-bottom {
|
|
|
|
|
|
width: 90%;
|
|
|
|
|
|
margin-top: 4.5vw;
|
|
|
|
|
|
height: 70rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
view{
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 9vw;
|
|
|
|
|
|
height: 3.8vw;
|
|
|
|
|
|
color: rgba(92, 121, 146, 1);
|
|
|
|
|
|
border-radius:1.6vw;
|
|
|
|
|
|
font-size: 1.8vw;
|
|
|
|
|
|
border: 1px solid #A2B4CF;
|
|
|
|
|
|
margin-left: 1vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
.quxiao{
|
|
|
|
|
|
background: #FFFFFF;
|
|
|
|
|
|
}
|
|
|
|
|
|
.plsbuy-bottom-blue {
|
|
|
|
|
|
background: linear-gradient(0deg, #CAE0F9, #E9F4FF);
|
|
|
|
|
|
border: 1px solid rgba(3,133,250,0.34);
|
|
|
|
|
|
background: linear-gradient(-61deg, #EAF5FF, #CBE7FF);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.calculator-father {
|
|
|
|
|
|
width: 24vw;
|
|
|
|
|
|
height: 57%;
|
|
|
|
|
|
margin :0 auto 0;
|
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
display: grid;
|
|
|
|
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
|
|
|
|
|
|
|
|
|
|
.calculator-kuai {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
background: url('/static/index/procurement/bt.png') no-repeat;
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
border-radius: 25rpx;
|
|
|
|
|
|
font-size: 42rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
margin: 15rpx 20rpx 0 20rpx;
|
|
|
|
|
|
width: 6.1vw;
|
|
|
|
|
|
height: 6.1vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
.calculator-kuai:active{
|
|
|
|
|
|
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 45rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.stringShow-father {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 70rpx;
|
|
|
|
|
|
margin-top: 20rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
.jj{
|
|
|
|
|
|
width: 5vw;
|
|
|
|
|
|
height: 5vw;
|
|
|
|
|
|
margin: 0 1vw;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
background: url('/static/index/procurement/bt.png') no-repeat;
|
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
|
border-radius: 25rpx;
|
|
|
|
|
|
font-size: 42rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
.jj:active{
|
|
|
|
|
|
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
background-color: #DCDCEE;
|
|
|
|
|
|
border-radius: 25rpx;
|
|
|
|
|
|
font-size: 45rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
}
|
|
|
|
|
|
.stringShow-kuai {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 18.5vw;
|
|
|
|
|
|
height: 5vw;
|
|
|
|
|
|
background: #F3F5F9;
|
|
|
|
|
|
border-radius: 1vw;
|
|
|
|
|
|
border: 1px solid #CBCFD0;
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
box-shadow: 0rpx 0.1vw 0.3vw 0rpx rgba(140,143,153,0.17) inset;
|
|
|
|
|
|
view{
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 42rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
width:3.5vw;
|
|
|
|
|
|
height: 5vw;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.qinggou-font {
|
|
|
|
|
|
font-size: 27rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
margin: 1.4vw auto;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|