287 lines
5.7 KiB
Vue
287 lines
5.7 KiB
Vue
|
<!-- 入库单 -->
|
|||
|
<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>
|