This commit is contained in:
parent
13bfa311bf
commit
c6b28b02bf
|
|
@ -256,7 +256,6 @@
|
|||
|
||||
// 变更菜单
|
||||
const changeMenu = (index) => {
|
||||
console.log(index)
|
||||
if (index === menuIndex.value) {
|
||||
return
|
||||
}
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@
|
|||
<image :src="'/static/index/procurement/+.png'" mode="aspectFill"></image>
|
||||
</view> -->
|
||||
<view class="zkadd guodu" >
|
||||
<view class="zkadd-white" style="background: #F1F1F1;" @click.stop="crk(v,index)" @touchend.stop>盘点</view>
|
||||
<view class="zkadd-white" style="background: #F1F1F1;" @click.stop="pandian(v,index)" @touchend.stop>盘点</view>
|
||||
<view class="zkadd-white" @click.stop="crk(v,index)" @touchend.stop>出入库</view>
|
||||
<view class="zkadd-blue" @click.stop="addcar(v,index)" v-if="v.isAdd!=1" @touchend.stop>
|
||||
<view>
|
||||
|
|
@ -77,12 +77,18 @@
|
|||
<u-loadmore :status="status" :loadText="{nomore:'暂无更多数据'}" v-if="InvoicingList.length>6" />
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="mengban"> </view>
|
||||
<view class="mengban" v-if="priceshow" @click="priceshow = false"> </view>
|
||||
<price :show="priceshow" @close="priceshow = false"></price>
|
||||
|
||||
<view class="mengban" v-if="pd" @click="guanbipd"> </view>
|
||||
<inventory :isShow="pd" v-if="pds"></inventory>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
import price from './price.vue'
|
||||
import inventory from './inventory.vue'
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
type: Array
|
||||
|
|
@ -95,16 +101,30 @@
|
|||
default: false
|
||||
},
|
||||
})
|
||||
const priceshow = ref(false)
|
||||
const pd = ref(false)
|
||||
const pds = ref(false)
|
||||
const emit = defineEmits(['addcartory', 'scrolltolower', 'addcar', 'crk'])
|
||||
const serverUrl = ref('')
|
||||
onMounted(() => {
|
||||
serverUrl.value = uni.getStorageSync('serverUrl') + '/sys/common/static/';
|
||||
// setTimeout(()=>{
|
||||
// console.log(serverUrl.value+props.InvoicingList[0].materialImg)
|
||||
// },3000)
|
||||
})
|
||||
const pandian = ()=>{
|
||||
pds.value = true
|
||||
setTimeout(()=>{
|
||||
pd.value = true
|
||||
},10)
|
||||
}
|
||||
const guanbipd = ()=>{
|
||||
pd.value = false;
|
||||
setTimeout(()=>{
|
||||
pds.value = false
|
||||
},450)
|
||||
|
||||
}
|
||||
const caigouobj = ref({})
|
||||
const addcar = (v : any, i : number) => {
|
||||
priceshow.value = true
|
||||
// console.log("为啥点击不上啊",i)
|
||||
if (Number(v.kcsl) >= Number(v.upperLimit)) {
|
||||
uni.showToast({
|
||||
|
|
@ -300,7 +320,7 @@
|
|||
margin: 0.6vw 0;
|
||||
}
|
||||
view{
|
||||
font-size: 13px;
|
||||
font-size: 1.3vw;
|
||||
color: #777777;
|
||||
font-style: normal;
|
||||
text-transform: none;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,37 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="crkd guodu" :style="!show?'width: 0;right:-4vw':'width: 86.8vw'" >
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
const props = defineProps({
|
||||
show: {
|
||||
type: Boolean
|
||||
},
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.crkd{
|
||||
width: 86.8vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index:101;
|
||||
padding:0 2vw;
|
||||
background: #FFFFFF;
|
||||
border-radius: 3vw 0 0 3vw;
|
||||
}
|
||||
.guodu {
|
||||
transition: .4s;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,205 @@
|
|||
<template>
|
||||
<div
|
||||
class="circle-progress"
|
||||
:style="{
|
||||
width: '5vw',
|
||||
height: '5vw',
|
||||
}"
|
||||
>
|
||||
<!-- 背景圆环 -->
|
||||
<div class="circle-bg" :style="{ borderColor: bgColor }"></div>
|
||||
|
||||
<!-- 进度圆环容器（用于实现圆角） -->
|
||||
<div class="circle-bar-wrapper">
|
||||
<!-- 进度圆环（核心） -->
|
||||
<div
|
||||
class="circle-bar"
|
||||
:style="{
|
||||
background: `conic-gradient(${color} ${animateProgress}%, transparent ${animateProgress}%)`,
|
||||
'--thickness': `${thickness}px`,
|
||||
'--half-thickness': `${thickness / 2}px`,
|
||||
}"
|
||||
></div>
|
||||
</div>
|
||||
|
||||
<!-- 中间文字 -->
|
||||
<div class="circle-content" v-if="showText">
|
||||
<div class="progress-number">{{ Math.round(animateProgress) }}%</div>
|
||||
<div class="progress-label">进度</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, onMounted, watch } from 'vue';
|
||||
|
||||
/**
|
||||
* 纯CSS环形进度条组件（APP/移动端专用）
|
||||
* 适配设计图样式，带数字加载动效
|
||||
*/
|
||||
interface ProgressProps {
|
||||
/** 进度 0~100 */
|
||||
progress?: number;
|
||||
/** 进度条颜色 */
|
||||
color?: string;
|
||||
/** 背景圆环颜色 */
|
||||
bgColor?: string;
|
||||
/** 圆环粗细（优化后默认更细） */
|
||||
thickness?: number;
|
||||
/** 是否显示中间文字 */
|
||||
showText?: boolean;
|
||||
/** 动画时长(秒) */
|
||||
duration?: number;
|
||||
}
|
||||
|
||||
// 定义Props（thickness默认改为1px，更细）
|
||||
const props = withDefaults(defineProps<ProgressProps>(), {
|
||||
progress: 0,
|
||||
color: '#409EFF', // 匹配设计图蓝色
|
||||
bgColor: '#E5E5E5', // 灰色背景（提高不透明度，保证显示清晰）
|
||||
thickness: 1, // 进度条更细，默认1px
|
||||
showText: true,
|
||||
duration: 1.5, // 动画时长
|
||||
});
|
||||
|
||||
// 限制进度在0-100之间
|
||||
const realProgress = computed(() => {
|
||||
const p = Number(props.progress);
|
||||
return isNaN(p) ? 0 : Math.max(0, Math.min(100, p));
|
||||
});
|
||||
|
||||
// 动画进度值
|
||||
const animateProgress = ref(0);
|
||||
|
||||
// 数字加载动画
|
||||
const startProgressAnimation = () => {
|
||||
const target = realProgress.value;
|
||||
const duration = props.duration * 1000;
|
||||
const frameRate = 60;
|
||||
const totalFrames = duration / (1000 / frameRate);
|
||||
const increment = target / totalFrames;
|
||||
|
||||
let currentFrame = 0;
|
||||
const timer = setInterval(() => {
|
||||
currentFrame++;
|
||||
animateProgress.value += increment;
|
||||
|
||||
if (currentFrame >= totalFrames || animateProgress.value >= target) {
|
||||
animateProgress.value = target;
|
||||
clearInterval(timer);
|
||||
}
|
||||
}, 1000 / frameRate);
|
||||
};
|
||||
|
||||
// 监听进度变化重新执行动画
|
||||
watch(realProgress, () => {
|
||||
animateProgress.value = 0;
|
||||
startProgressAnimation();
|
||||
}, { immediate: false });
|
||||
|
||||
// 组件挂载时执行动画
|
||||
onMounted(() => {
|
||||
startProgressAnimation();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.circle-progress {
|
||||
position: relative;
|
||||
flex-shrink: 0;
|
||||
aspect-ratio: 1/1;
|
||||
/* 增加立体阴影，提升层次感 */
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||
border-radius: 50%;
|
||||
/* 背景色保证阴影显示完整 */
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* 背景圆环（完整显示灰色环） */
|
||||
.circle-bg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
border: 3px solid #E8E9EA;
|
||||
box-sizing: border-box;
|
||||
opacity: 1;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 进度圆环容器（核心：实现进度条圆角） */
|
||||
.circle-bar-wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
z-index: 3;
|
||||
/* 裁剪超出部分，保证圆角效果 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 进度圆环（核心） */
|
||||
.circle-bar {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
/* 环形核心：锥形渐变 + 遮罩 */
|
||||
-webkit-mask: radial-gradient(
|
||||
transparent calc(50% - 3px),
|
||||
black calc(50% - 3px)
|
||||
);
|
||||
mask: radial-gradient(
|
||||
transparent calc(50% - 3px),
|
||||
black calc(50% - 3px)
|
||||
);
|
||||
/* 进度条圆角关键：通过伪元素实现 */
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 3px;
|
||||
right: 3px;
|
||||
bottom: 3px;
|
||||
border-radius: 50%;
|
||||
box-shadow: inset 0 0 0 13px rgba(255, 255, 255, 1);
|
||||
}
|
||||
/* 进度条末端圆角优化 */
|
||||
clip-path: circle(50% at center);
|
||||
}
|
||||
|
||||
/* 中间文字容器 */
|
||||
.circle-content {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 3; /* 文字层级最高 */
|
||||
}
|
||||
|
||||
/* 百分比数字样式 - 匹配设计图 */
|
||||
.progress-number {
|
||||
font-size: 1.2vw; /* 适配5vw容器的字体大小 */
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
line-height: 1;
|
||||
margin-bottom: 0.2vw;
|
||||
}
|
||||
|
||||
/* 进度标签样式 - 匹配设计图 */
|
||||
.progress-label {
|
||||
font-size: 1.1vw; /* 适配5vw容器的字体大小 */
|
||||
color: #666;
|
||||
line-height: 1;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,19 +1,456 @@
|
|||
<template>
|
||||
<view>
|
||||
|
||||
<view class="box guodu" :style="!show?'width: 0;right:-6vw':'width: 78vw'" >
|
||||
<view class="title">
|
||||
<view></view>
|
||||
销售价格
|
||||
</view>
|
||||
<view class="gys">供应商：长春市天林商贸有限公司</view>
|
||||
<view class="list">
|
||||
<view class="cgdh">
|
||||
<view class="zc">
|
||||
采购单号 101C20251012001
|
||||
<view>库存数量<text>105</text></view>
|
||||
</view>
|
||||
<view class="sxd" @click="sxd = true">随行单</view>
|
||||
</view>
|
||||
<view class="contents">
|
||||
<view class="carditem guodu" >
|
||||
|
||||
<view class="speitem guodu">
|
||||
<view class="imghs">
|
||||
<image style="border-radius: 1vw;"
|
||||
:src=" '/static/index/procurement/k.png'"
|
||||
mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<view class="cardp">
|
||||
<view>复健用品</view>
|
||||
<view>复健用品</view>
|
||||
</view>
|
||||
<!-- <view class="cardp">
|
||||
<view v-if="v.categoryId_dictText">{{v.categoryId_dictText}}</view>
|
||||
<view v-if="v.typeId_dictText">{{v.typeId_dictText}}</view>
|
||||
<view v-if="v.medicationId_dictText">{{v.medicationId_dictText}}</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="msitem guodu">
|
||||
<view>
|
||||
<view>纸尿裤-拉拉裤纸尿裤拉拉裤纸尿裤</view>
|
||||
</view>
|
||||
<view style="margin-top: 1vw;">
|
||||
<text style="white-space: nowrap;"> 物料编码: ZHYP044</text>
|
||||
</view>
|
||||
<view>
|
||||
<text style="white-space: nowrap;"> 规格型号: 800mm*680mm</text>
|
||||
</view>
|
||||
<view>
|
||||
<text style="white-space: nowrap;"> 品牌型号：品牌型号名称</text>
|
||||
</view>
|
||||
<view>
|
||||
<text style="white-space: nowrap;"> 生产厂家：吉林省捌零信创科技有限...</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="righs">
|
||||
<view class="hezi">
|
||||
<view>
|
||||
<text>￥</text>
|
||||
0.35
|
||||
</view>
|
||||
<view class="jg">
|
||||
采购价格
|
||||
<text class="s">↑</text><text class="sb ss">￥0.26 </text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="hezi">
|
||||
<view>
|
||||
<text>￥</text>0.35
|
||||
<image src="/static/index/material/edh.png" mode="aspectFill"></image>
|
||||
<image src="/static/index/material/edl.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="jg">
|
||||
销售价格
|
||||
<text class="j">↓</text><text class="sb jj">￥0.26 </text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="hezi">
|
||||
<view>
|
||||
片
|
||||
</view>
|
||||
<text>采购单位</text>
|
||||
</view>
|
||||
<view class="hezi">
|
||||
<view style="padding-left: 0.3vw;">
|
||||
片
|
||||
<image src="/static/index/material/edr.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<text>采购单位</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<view class="qx" @click="emit('close')">取消</view>
|
||||
<view class="qd">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mengban" v-if="sxd" @click="sxd = false"> </view>
|
||||
<sxds :show="sxd" @close="sxd = false"></sxds>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
import sxds from './sxd.vue'
|
||||
const props = defineProps({
|
||||
show: {
|
||||
type: Boolean
|
||||
},
|
||||
})
|
||||
const sxd = ref(false)
|
||||
const emit = defineEmits(['close' ])
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
|
||||
<style lang="less" scoped>
|
||||
.mengban{
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
background: RGBA(240, 240, 240, 0.64);
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1010;
|
||||
}
|
||||
.box{
|
||||
width: 0;
|
||||
height: 100vh;
|
||||
background: #FFFFFF;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 1001;
|
||||
overflow: hidden;
|
||||
border-radius: 3vw 0 0 3vw;
|
||||
padding: 3vw;
|
||||
.btn{
|
||||
position: absolute;
|
||||
right: 3.5vw;
|
||||
bottom: 2.7vw;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
view{
|
||||
width: 8vw;
|
||||
height: 3.4vw;
|
||||
border-radius: 1.1vw;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: 1vw;
|
||||
}
|
||||
.qd{
|
||||
background: #57A8FA;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.qx{
|
||||
background: #E1F0FF;
|
||||
color: #555555;
|
||||
}
|
||||
}
|
||||
.list::after{
|
||||
content: '';
|
||||
width: 1rpx;
|
||||
height: 15vw;
|
||||
background: #D2D2D2;
|
||||
position: absolute;
|
||||
top: 4vw;
|
||||
left: 39.7vw;
|
||||
}
|
||||
.list{
|
||||
width: 71.9vw;
|
||||
height: 21.5vw;
|
||||
background: #FFFFFF;
|
||||
border-radius:2.2vw;
|
||||
border: 1px solid #D2D2D2;
|
||||
margin-top: 1.7vw;
|
||||
padding: 1.8vw 2.3vw 0;
|
||||
position: relative;
|
||||
.contents{
|
||||
width: 100%;
|
||||
height: 16vw;
|
||||
display: flex;
|
||||
.righs{
|
||||
width: 30vw;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-top: 3vw;
|
||||
.s{
|
||||
color: #FF5B5B !important;
|
||||
margin: 0 0.5vw;
|
||||
}
|
||||
.j{
|
||||
color: #0385FA !important;
|
||||
margin: 0 0.5vw;
|
||||
}
|
||||
.ss{
|
||||
background: #FF5B5B !important;
|
||||
}
|
||||
.jj{
|
||||
background: #0385FA !important;
|
||||
|
||||
}
|
||||
.sb{
|
||||
width: 4.8vw;
|
||||
height: 2.1vw;
|
||||
border-radius: 0.5vw;
|
||||
font-weight: 400;
|
||||
font-size: 1.4vw;
|
||||
color: #FFFFFF !important;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.hezi{
|
||||
width: 14vw;
|
||||
height: 70rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
>view{
|
||||
font-size: 2.2vw;
|
||||
color: #333333;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
font-weight: bold;
|
||||
height: 2.4vw;
|
||||
white-space: nowrap;
|
||||
text{
|
||||
font-size: 1.4vw;
|
||||
line-height: 2.3vw;
|
||||
|
||||
}
|
||||
image{
|
||||
width: 1.4vw;
|
||||
height: 1.4vw;
|
||||
position: relative;
|
||||
top:-0.4vw;
|
||||
}
|
||||
}
|
||||
.jg{
|
||||
font-size: 1.3vw;
|
||||
color: #888888;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.cgdh{
|
||||
width: 100%;
|
||||
height: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
white-space: nowrap;
|
||||
.zc{
|
||||
font-size: 1.5vw;
|
||||
color: #777777;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
view{
|
||||
margin-left: 4.5vw;
|
||||
text{
|
||||
font-weight: bold;
|
||||
font-size: 2vw;
|
||||
color: #222222;
|
||||
}
|
||||
}
|
||||
}
|
||||
.sxd{
|
||||
width: 5.5vw;
|
||||
height: 2.4vw;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0.9vw;
|
||||
border: 1px solid #0385FA;
|
||||
font-size: 1.2vw;
|
||||
color: #0385FA;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.gys{
|
||||
font-weight: bold;
|
||||
font-size: 1.4vw;
|
||||
color: #777777;
|
||||
margin-top: 2.3vw;
|
||||
}
|
||||
.title{
|
||||
font-size: 1.7vw;
|
||||
color: #222222;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
view{
|
||||
width: 0.5vw;
|
||||
height: 1.4vw;
|
||||
background: radial-gradient( 0% 0% at 0% 0%, #006DC9 7.25%, #0385FA 100%), #F7F7F7;
|
||||
border-radius: 0.2vw;
|
||||
margin-right: 1vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
.guodu {
|
||||
transition: .4s;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
|
||||
.carditem {
|
||||
height: 100%;
|
||||
width: 39.7vw;
|
||||
display: flex;
|
||||
transition: transform 500ms cubic-bezier(.2, .8, .2, 1);
|
||||
will-change: transform;
|
||||
margin-top: 2vw;
|
||||
justify-content: space-between;
|
||||
padding-right: 1.8vw;
|
||||
.msitem {
|
||||
min-width: 23vw;
|
||||
height: 14vw;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
>view {
|
||||
&:nth-child(2),
|
||||
&:nth-child(3),
|
||||
&:nth-child(4),
|
||||
&:nth-child(6),
|
||||
&:nth-child(5) {
|
||||
margin-top: 0.25vw;
|
||||
max-width: 23vw;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 1.3vw;
|
||||
color: #777777;
|
||||
margin-top: 0.25vw;
|
||||
}
|
||||
}
|
||||
|
||||
&:nth-child(1) {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 2vw;
|
||||
margin-top: 1vw;
|
||||
|
||||
>view {
|
||||
width: 19vw;
|
||||
height: 2vw;
|
||||
font-weight: bold;
|
||||
font-size: 1.8vw;
|
||||
color: #222222;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
text {
|
||||
width: 6vw;
|
||||
font-weight: 300;
|
||||
font-size: 1.4vw;
|
||||
color: #222222;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// .spleft{
|
||||
// margin-left: -15vw !important;
|
||||
// }
|
||||
.speitem {
|
||||
min-width: 13vw;
|
||||
height: 14vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.cardp {
|
||||
width: 12.5vw;
|
||||
height: 4vw;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: 0 auto;
|
||||
align-items: center;
|
||||
|
||||
view {
|
||||
min-width: 5.5vw;
|
||||
height: 1.8vw;
|
||||
border-radius: 0.9vw;
|
||||
border: 1px solid #D2D2D2;
|
||||
margin: 0.5vw 0 0 0.5vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 1vw;
|
||||
color: #555555;
|
||||
padding: 0 0.25vw;
|
||||
|
||||
&:nth-child(1),
|
||||
&:nth-child(2) {
|
||||
max-width: 6vw;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: block;
|
||||
line-height: 1.8vw;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
max-width: 11.5vw;
|
||||
padding: 0 0.8vw;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: block;
|
||||
line-height: 1.8vw;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.imghs {
|
||||
width: 10vw;
|
||||
height: 10vw;
|
||||
margin: 1vw auto 0.25vw;
|
||||
padding: 0.2vw;
|
||||
background: #fff;
|
||||
border-radius: 1.1vw;
|
||||
|
||||
>image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 1.1vw;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,317 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="box guodu" :style="!show?'width: 0;right:-6vw':'width: 67vw'" >
|
||||
<view class="title">
|
||||
<view></view>
|
||||
随行单
|
||||
</view>
|
||||
<scroll-view scroll-y="true" class="scrolsxd">
|
||||
<view>
|
||||
<view class="cgz">
|
||||
<view class="left">
|
||||
<image src="/static/index/material/cgd.png" mode="aspectFill"></image>
|
||||
采购单
|
||||
</view>
|
||||
<view class="cd">
|
||||
采购中
|
||||
</view>
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>采购单号：</view>
|
||||
101C20251121006
|
||||
<view class="je">
|
||||
<text> ￥25</text>
|
||||
<text>订单金额</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>采购日期：</view>
|
||||
2025-10-12
|
||||
</view>
|
||||
|
||||
<view class="cgz top1">
|
||||
<view class="left">
|
||||
<image src="/static/index/material/jg.png" mode="aspectFill"></image>
|
||||
机构信息
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dz">
|
||||
<view>机构名称：</view>
|
||||
吉林省久泰健康产业有限公司
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>收货地址：</view>
|
||||
吉林省长春市朝阳区开运街41号吉省长春市朝阳区开运街41号
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>联系人：</view>
|
||||
张某
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>电话：</view>
|
||||
13845337753
|
||||
</view>
|
||||
|
||||
<view class="cgz top1">
|
||||
<view class="left">
|
||||
<image src="/static/index/material/gys.png" mode="aspectFill"></image>
|
||||
供应商信息
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dz">
|
||||
<view>供应商：</view>
|
||||
吉林天林商贸有限公司
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>联系人：</view>
|
||||
吕婧文
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>电话：</view>
|
||||
13356856633
|
||||
</view>
|
||||
|
||||
<view class="conts">
|
||||
<view class="tittop">
|
||||
<text>纸尿裤-拉拉裤纸尿裤</text>
|
||||
<view>
|
||||
采购数量
|
||||
<text>155</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>规格型号：</view>
|
||||
800mm*680mm
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>品牌型号：</view>
|
||||
品牌型号名称
|
||||
</view>
|
||||
<view class="dz">
|
||||
<view>生产厂家：</view>
|
||||
吉林省捌零信创科技有限
|
||||
</view>
|
||||
|
||||
<view class="jglb" style="margin-top: 2.5vw;">
|
||||
<view>
|
||||
<text>¥0.32</text>
|
||||
<text>采购价格</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>片</text>
|
||||
<text>采购单位</text>
|
||||
</view>
|
||||
<view class="l">
|
||||
<text>¥0.56</text>
|
||||
<text>销售价格</text>
|
||||
</view>
|
||||
<view class="l">
|
||||
<text>片</text>
|
||||
<text>销售单位</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="jglb">
|
||||
<view>
|
||||
<text>350</text>
|
||||
<text>入库数量</text>
|
||||
</view>
|
||||
<view>
|
||||
<text>150</text>
|
||||
<text>挂账数量</text>
|
||||
</view>
|
||||
<view >
|
||||
<text>12</text>
|
||||
<text>销账数量</text>
|
||||
</view>
|
||||
<view >
|
||||
<text>￥0.56</text>
|
||||
<text>销售金额</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
const props = defineProps({
|
||||
show: {
|
||||
type: Boolean
|
||||
},
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.conts{
|
||||
width: 57vw;
|
||||
height: 36vw;
|
||||
background: #FFFFFF;
|
||||
border-radius: 1.6vw;
|
||||
border: 1px solid #DCDCDC;
|
||||
padding: 1.8vw 3.3vw;
|
||||
margin-top: 2vw;
|
||||
.jglb{
|
||||
width: 100%;
|
||||
height: 9vw;
|
||||
border-top: 1px solid #E5E5E5;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
view{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text{
|
||||
&:nth-child(1){
|
||||
font-size: 2.1vw;
|
||||
color: #555555;
|
||||
font-weight: bold;
|
||||
}
|
||||
&:nth-child(2){
|
||||
font-size: 1.4vw;
|
||||
color: #555555;
|
||||
}
|
||||
}
|
||||
}
|
||||
.l{
|
||||
color: #0385FA;
|
||||
}
|
||||
}
|
||||
.tittop{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 4.5vw;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
margin-bottom: 1.5vw;
|
||||
text{
|
||||
font-weight: bold;
|
||||
font-size: 2.1vw;
|
||||
color: #222222;
|
||||
}
|
||||
view{
|
||||
font-size: 1.3vw;
|
||||
color: #888888;
|
||||
text{
|
||||
font-weight: bold;
|
||||
font-size: 2.4vw;
|
||||
color: #333333;
|
||||
margin-left: 0.6vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.box{
|
||||
width: 0;
|
||||
height: 100vh;
|
||||
background: #FFFFFF;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 1011;
|
||||
overflow: hidden;
|
||||
border-radius: 3vw 0 0 3vw;
|
||||
padding: 3vw;
|
||||
.scrolsxd{
|
||||
width: 100%;
|
||||
height: calc(100vh - 10vw);
|
||||
margin-top: 2vw;
|
||||
padding-left: 1.2vw;
|
||||
.dz{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 0.7vw;
|
||||
font-size: 1.4vw;
|
||||
color: #333333;
|
||||
position: relative;
|
||||
view{
|
||||
width: 7vw;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.je{
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -0.5vw;
|
||||
text{
|
||||
&:nth-child(1){
|
||||
font-weight: bold;
|
||||
font-size:2.4vw;
|
||||
color: #333333;
|
||||
}
|
||||
&:nth-child(2){
|
||||
font-size:1.3vw;
|
||||
color: #888888;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.top1{
|
||||
margin-top: 1vw;
|
||||
}
|
||||
.cgz{
|
||||
width: 100%;
|
||||
height: 4.2vw;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
margin-bottom: 2vw;
|
||||
.left{
|
||||
font-weight: bold;
|
||||
font-size: 1.7vw;
|
||||
color: #333333;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
width: 2.1vw;
|
||||
height: 2.1vw;
|
||||
margin-right: 0.8vw;
|
||||
}
|
||||
}
|
||||
.cd{
|
||||
width: 7.9vw;
|
||||
height: 3.2vw;
|
||||
border-radius: 1.1vw;
|
||||
border: 1px solid #0385FA;
|
||||
font-size: 1.6vw;
|
||||
color: #0385FA;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
.title{
|
||||
font-size: 1.7vw;
|
||||
color: #222222;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
view{
|
||||
width: 0.5vw;
|
||||
height: 1.4vw;
|
||||
background: radial-gradient( 0% 0% at 0% 0%, #006DC9 7.25%, #0385FA 100%), #F7F7F7;
|
||||
border-radius: 0.2vw;
|
||||
margin-right: 1vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
.guodu {
|
||||
transition: .4s;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,353 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="jsuq guodu" >
|
||||
<view class="leftsa">
|
||||
<view class="shu">数量</view>
|
||||
<view class="jiajian">
|
||||
<view :class="pddType!='3'? `jj`:`jj-bad`" @click="jjnum(-1)" @touchstart="handleTouchStart(-1)" @touchend="handleTouchEnd">
|
||||
-
|
||||
</view>
|
||||
<view :class="pddType!='3'? `stringShow-kuai`:`stringShow-kuai-bad`">
|
||||
<view v-for="(item,index) in stringShow" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view :class="pddType!='3'? `jj`:`jj-bad`" @click="jjnum(1)" @touchstart="handleTouchStart(1)" @touchend="handleTouchEnd">
|
||||
+
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="jiajian"> </view> -->
|
||||
</view>
|
||||
<view class="rigsbt">
|
||||
<view class="calculator-father">
|
||||
<view v-for="(item,index) in calculatorArray" :key="index">
|
||||
<view :class="pddType!='3'?`calculator-kuai`:`calculator-kuai-bad`" v-if="item==`AC`" @click="clickKuai(item,index)">
|
||||
<image src="/static/cleanone.png" mode="aspectFill"
|
||||
style="width: 50%;height: 50%;margin-left: -5rpx;"></image>
|
||||
|
||||
</view>
|
||||
<view :class="pddType!='3'?`calculator-kuai`:`calculator-kuai-bad`" v-else-if="item==`AE`" style="font-size: 1.2vw;color: #0385FA;"
|
||||
@click="clickKuai(item,index)">
|
||||
同步
|
||||
</view>
|
||||
<view :class="pddType!='3'?`calculator-kuai`:`calculator-kuai-bad`" v-else @click="clickKuai(item,index)">
|
||||
{{item}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
const stringShow = ref("0000");
|
||||
const relNumber = ref(0);
|
||||
const calculatorArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, "AC", "AE"];
|
||||
const props = defineProps({
|
||||
show: {
|
||||
type: Boolean
|
||||
},
|
||||
tb: {
|
||||
type: Number
|
||||
},
|
||||
idex: {
|
||||
type: Number
|
||||
},
|
||||
pdsl: {
|
||||
type: Number
|
||||
},
|
||||
pddType: {
|
||||
type: String
|
||||
},
|
||||
// pz:{
|
||||
// // type: Boolean
|
||||
// },
|
||||
});
|
||||
watch(() => props.show,
|
||||
() => {
|
||||
if (props.show == true) {
|
||||
relNumber.value = props.pdsl ? props.pdsl : 0;
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value);
|
||||
isZero.value = false
|
||||
} else {
|
||||
relNumber.value = 0;
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['pddjjnum'])
|
||||
const isZero = ref(false);
|
||||
const clickKuai = (item : any, index : number) => {
|
||||
if (props.pddType != '1') { return }
|
||||
if (item == "AE") {
|
||||
relNumber.value = props.tb;
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value);
|
||||
emit('pddjjnum', relNumber.value, props.idex);
|
||||
return
|
||||
}
|
||||
if (item == "AC") {
|
||||
relNumber.value = Math.trunc(relNumber.value / 10)
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value);
|
||||
emit('pddjjnum', relNumber.value, props.idex);
|
||||
return
|
||||
}
|
||||
if (isZero.value == false) {
|
||||
isZero.value = true;
|
||||
relNumber.value = item;
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value);
|
||||
emit('pddjjnum', relNumber.value, props.idex);
|
||||
return
|
||||
}
|
||||
if (digitCountByString(relNumber.value) > 3) {
|
||||
|
||||
} else {
|
||||
if (!relNumber.value) {
|
||||
relNumber.value = item
|
||||
} else {
|
||||
relNumber.value = relNumber.value * 10 + item;
|
||||
}
|
||||
emit('pddjjnum', relNumber.value, props.idex);
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
||||
}
|
||||
|
||||
}
|
||||
const InteroutId = ref(null)
|
||||
let longPressTimer = null;
|
||||
let longPressed = false;
|
||||
const handleTouchStart = (e : number) => {
|
||||
if (props.pddType != '1') { return }
|
||||
longPressed = false;
|
||||
if (longPressTimer) {
|
||||
clearTimeout(longPressTimer);
|
||||
longPressTimer = null;
|
||||
}
|
||||
longPressTimer = setTimeout(() => {
|
||||
longPressTimer = null;
|
||||
longPressed = true;
|
||||
Interval(e)
|
||||
}, 800); // 1000ms = 1s
|
||||
}
|
||||
const handleTouchEnd = () => {
|
||||
if (longPressTimer) {
|
||||
clearTimeout(longPressTimer);
|
||||
longPressTimer = null;
|
||||
// console.log('未达到 1 秒：取消长按');
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果已经触发过长按
|
||||
if (longPressed) {
|
||||
// console.log('长按已触发，用户放手');
|
||||
clearInterval(InteroutId.value);
|
||||
longPressed = false; // 重置状态（按需）
|
||||
} else {
|
||||
console.log('无效状态（通常不会到这）');
|
||||
}
|
||||
}
|
||||
const Interval = (e : number) => {
|
||||
InteroutId.value = setInterval(() => {
|
||||
jjnum(e);
|
||||
}, 120);
|
||||
}
|
||||
const jjnum = (e : number) => {
|
||||
if (props.pddType != '1') { return }
|
||||
let num = 9999;
|
||||
if (num <= relNumber.value && e == 1) { relNumber.value = num; return }
|
||||
if (relNumber.value <= 0 && e == -1) { relNumber.value = 0; return }
|
||||
relNumber.value += e;
|
||||
stringShow.value = toFixed4ByPadStart(relNumber.value)
|
||||
emit('pddjjnum', relNumber.value, props.idex)
|
||||
}
|
||||
function digitCountByString(n) {
|
||||
const s = Math.abs(n).toString();
|
||||
return s.length;
|
||||
}
|
||||
function toFixed4ByPadStart(n) {
|
||||
const intPart = Math.floor(Math.abs(n));
|
||||
return String(intPart).padStart(4, '0');
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.jsuq {
|
||||
width: 50vw;
|
||||
display: flex;
|
||||
height: 16vw;
|
||||
justify-content: space-between;
|
||||
// background-color: red;
|
||||
margin-top: -1.5vw;
|
||||
|
||||
.rigsbt {
|
||||
width: 25vw;
|
||||
height: 100%;
|
||||
margin-right: 1vw;
|
||||
|
||||
.calculator-father {
|
||||
width: 23vw;
|
||||
height: 90%;
|
||||
margin: 0 auto 0;
|
||||
flex-wrap: wrap;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||
|
||||
|
||||
.calculator-kuai {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
// background-color: #F3F5F9;
|
||||
background-size: 100% 100%;
|
||||
font-size: 1.5vw;
|
||||
font-weight: 500;
|
||||
width: 4.2vw;
|
||||
height: 4.2vw;
|
||||
background: url('/static/index/procurement/bt.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 25rpx;
|
||||
}
|
||||
|
||||
.calculator-kuai:active {
|
||||
background: linear-gradient(to bottom, #019cef, #0084fa);
|
||||
color: #fff !important;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-size: 100% 100%;
|
||||
font-size: 1.5vw;
|
||||
width: 4.2vw;
|
||||
height: 4.2vw;
|
||||
border-radius: 1.6vw;
|
||||
}
|
||||
.calculator-kuai-bad{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #F3F5F9;
|
||||
color: #999;
|
||||
border-radius: 30rpx;
|
||||
background-size: 100% 100%;
|
||||
font-size: 1.5vw;
|
||||
font-weight: 500;
|
||||
width: 5vw;
|
||||
height: 4vw;
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.leftsa {
|
||||
width: 21.8vw;
|
||||
height: 80%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0 1.5vw;
|
||||
margin-left: 2.5vw;
|
||||
|
||||
.shu {
|
||||
font-weight: 400;
|
||||
font-size: 1.2vw;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.stringShow-kuai {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 9vw;
|
||||
height: 3.4vw;
|
||||
background: #F3F5F9;
|
||||
border-radius: 1vw;
|
||||
// color: #999;
|
||||
color: black;
|
||||
border: 1px solid #CBCFD0;
|
||||
justify-content: space-around;
|
||||
box-shadow: 0rpx 0.1vw 0.3vw 0rpx rgba(140, 143, 153, 0.17) inset;
|
||||
opacity: 0.6;
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.7vw;
|
||||
font-weight: 500;
|
||||
width: 2.2vw;
|
||||
height: 3.4vw;
|
||||
}
|
||||
}
|
||||
.stringShow-kuai-bad {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 9vw;
|
||||
height: 3.4vw;
|
||||
background: #F3F5F9;
|
||||
border-radius: 1vw;
|
||||
color: #999;
|
||||
border: 1px solid #CBCFD0;
|
||||
justify-content: space-around;
|
||||
box-shadow: 0rpx 0.1vw 0.3vw 0rpx rgba(140, 143, 153, 0.17) inset;
|
||||
opacity: 0.6;
|
||||
|
||||
view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.7vw;
|
||||
font-weight: 500;
|
||||
width: 2.2vw;
|
||||
height: 3.4vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.jiajian {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.jj-bad{
|
||||
width: 4.2vw;
|
||||
height: 4.2vw;
|
||||
margin: 0 0.4vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #999;
|
||||
background: url('/static/index/procurement/bt.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
border-radius: 25rpx;
|
||||
font-size: 36rpx;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.jj {
|
||||
width: 4.2vw;
|
||||
height: 4.2vw;
|
||||
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: 36rpx;
|
||||
}
|
||||
|
||||
.jj:active {
|
||||
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #DCDCEE;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -11,18 +11,12 @@
|
|||
<image src="/static/index/procurement/shr.png" mode="aspectFill" class="shr"></image>
|
||||
检索
|
||||
</view>
|
||||
<!-- <view class="shx guodu" @click="ification=true">
|
||||
<image src="/static/index/purchaseorder/select.png" mode="aspectFill" class="sh"></image>
|
||||
<image src="/static/index/purchaseorder/selecttarget.png" mode="aspectFill" class="shr"></image>
|
||||
筛选
|
||||
</view> -->
|
||||
<view class="shx guodu" @click="chongzhi"
|
||||
v-if="form.categoryId!=''||form.wlParamInfo!=''||form.suppliers!=''">
|
||||
<image src="/static/index/procurement/cz.png" mode="aspectFill"></image>
|
||||
重置
|
||||
</view>
|
||||
<view class="back guodu" >
|
||||
<!-- <image src="/static/index/procurement/bk.png" mode="aspectFill"></image> -->
|
||||
<view class="back guodu" @click="crkshow = true">
|
||||
出入库
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -36,6 +30,9 @@
|
|||
<carditem :InvoicingList="InvoicingList" @addcartory="addcartory" @scrolltolower="scrolltolower" lower-threshold="300"
|
||||
:status="status" @crk="crk"></carditem>
|
||||
</view>
|
||||
<gress :progress="percent" :thickness="0.8" style="position: fixed;bottom: 4.7vw;right: 1.3vw;z-index: 3;"></gress>
|
||||
<view class="mengban" v-if="crkshow" @click="crkshow = false"> </view>
|
||||
<crkval :show="crkshow"></crkval>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
|
@ -43,7 +40,12 @@
|
|||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, inject, watch } from 'vue';
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import carditem from './component/carditem.vue'
|
||||
import gress from './component/gress.vue'
|
||||
import crkval from './component/crkval.vue'
|
||||
const percent = ref(0);
|
||||
const transition = ref(false)
|
||||
const crkshow = ref(false)
|
||||
|
||||
const props = defineProps({
|
||||
isShow: {
|
||||
type: Boolean
|
||||
|
|
@ -54,6 +56,9 @@
|
|||
(newVal, oldVal) => {
|
||||
if (!oldVal && newVal) {
|
||||
transition.value = false;
|
||||
setTimeout(()=>{
|
||||
percent.value = 55
|
||||
},1000)
|
||||
setTimeout(() => {
|
||||
transition.value = true;
|
||||
}, 50)
|
||||
|
|
@ -97,6 +102,15 @@
|
|||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.mengban{
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
background: RGBA(240, 240, 240, 0.64);
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 99;
|
||||
}
|
||||
.listcard {
|
||||
width: 90vw;
|
||||
height: calc(100vh - 4vw);
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 789 B |
Binary file not shown.
|
After Width: | Height: | Size: 856 B |
Binary file not shown.
|
After Width: | Height: | Size: 805 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Loading…
Reference in New Issue