hldy_app/component/storeroom/drawer/finish/index.vue

287 lines
5.7 KiB
Vue
Raw Normal View History

2025-05-20 16:10:53 +08:00
<!-- 入库单 -->
<template>
<view class="draw-all">
<view class="draw-contain">
<view class="draw-title-father">
<view class="draw-title">
<view class="draw-font">货品名称:</view>
<view class="draw-weight">留置针敷贴(医用透明敷料)</view>
</view>
</view>
<view class="swiper-card">
<view class="swiper-card-top">
<view class="swiper-card-top-card">
<view class="card-img-father">
<image class="card-img" src="/static/index/guan.png" />
</view>
<view class="card-right">
<view class="card-right-title">
<view class="draw-flex">
<view class="title-gray">
货品名称
</view>
<view class="title-black">
引流袋医用透明
</view>
</view>
</view>
<view class="card-right-other">
<view class="draw-flex" style="width: 300rpx;">
<view class="title-gray">
货品编码
</view>
<view class="title-black">
FLYPO01
</view>
</view>
<view class="draw-flex" style="width: 300rpx;">
<view class="title-gray">
规格型号
</view>
<view class="title-black">
6cm*7cm
</view>
</view>
<view class="draw-flex" style="">
<view class="title-gray">
采购单位
</view>
<view class="title-black">
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="contant-mid">
<view class="">改价前到货单价:</view>
<view class="contant-mid-wight">{{savePrice}}</view>
</view>
<view class="contant-mid">
<view class="">改价后到货单价:</view>
<view class="contant-mid-wight-target" @click="openCal(changePrice)" >{{changePrice}}</view>
</view>
<view class="button-card">
<view class="swiper-button-white" @click="close()">
关闭
</view>
<view class="swiper-button-blue" @click="rightclose()">
确定
</view>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import {
ref,
onMounted,
onBeforeUnmount,
computed,
nextTick,
watch
} from 'vue';
const emit = defineEmits(['right', "close","openCal","closeCal","rightclose"])
const blueNumber = ref(-1);
const props = defineProps({
savePrice: {
type: Number,
required: true,
},
changePrice: {
type: Number,
required: true,
},
});
const close = () =>{
emit('close')
emit("closeCal")
}
const openCal = (many:any) =>{
emit("openCal",many)
}
const closeCal = () =>{
emit("closeCal")
}
const rightclose = () =>{
emit('close')
emit("closeCal")
emit("rightclose",props.changePrice)
}
// const close
</script>
<style lang="less" scoped>
.draw-all {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
background-color: #fff;
overflow: hidden;
.draw-contain {
width: 100%;
height: calc(100vh);
background-image: url("/static/index/fanpink.png");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
.draw-title-father {
width: 100%;
height: 150rpx;
display: flex;
justify-content: center;
align-items: center;
.draw-title {
display: flex;
font-size: 35rpx;
.draw-weight {
font-weight: 700;
}
}
}
}
}
.swiper-card {
margin: 0 0 30rpx 30rpx;
width: 1130rpx;
height: 170rpx;
border: 2rpx solid #fff;
border-radius: 30rpx;
background: url("/static/index/blueMountain.png") center/cover, rgba(255, 255, 255, 0.5);
background-blend-mode: screen;
isolation: isolate;
box-shadow: 5rpx 5rpx 10rpx 0rpx #839fcc;
overflow: hidden;
padding: 0 40rpx;
position: relative;
.swiper-card-top {
width: 100%;
height: 270rpx;
.swiper-card-top-card {
width: 100%;
height: 100%;
display: flex;
}
}
}
.card-img-father {
height: 200rpx;
width: 160rpx;
display: flex;
align-items: center;
// background-color: #fff;
.card-img {
margin-top: -15rpx;
// 图片切的有问题
width: 70%;
height: 70%;
}
}
.card-right-title {
width: 100%;
display: flex;
justify-content: space-between;
font-weight: 700;
margin: 30rpx 0;
.title-gray {
color: #596278;
font-size: 30rpx;
}
.title-black {
font-size: 30rpx;
}
}
.card-right-other {
margin-top: 20rpx;
width: 100%;
display: flex;
justify-content: space-between;
font-size: 25rpx;
// background-color: red;
.title-gray {
color: #596278;
}
.title-green {
color: #647900;
}
.title-red {
color: #FF4A27;
}
}
.draw-flex {
display: flex;
}
.card-right {
width: 800rpx;
height: 100%;
}
.contant-mid{
padding: 30rpx 50rpx;
display: flex;
justify-content: space-between;
font-size: 32rpx;
.contant-mid-wight{
font-weight: 700;
}
.contant-mid-wight-target{
font-weight: 700;
border: 2rpx solid;
padding: 5rpx 10rpx;
border-radius: 10rpx;
margin-top: -10rpx;
}
}
.button-card {
margin-top: 30rpx;
display: flex;
justify-content: flex-end;
}
.swiper-button-blue {
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
border: 2rpx solid #fff;
border-radius: 20rpx;
width: 200rpx;
height: 80rpx;
display: flex;
justify-content: center;
align-items: center;
margin: 0 10rpx;
color: #fff;
margin-right: 40rpx;
}
.swiper-button-white {
background: linear-gradient(to bottom, #D5E0F8, #ECF6FF);
border: 2rpx solid #fff;
border-radius: 20rpx;
width: 200rpx;
height: 80rpx;
display: flex;
justify-content: center;
align-items: center;
// margin: 0 10rpx;
margin-right: 20rpx;
}
</style>