683 lines
15 KiB
Vue
683 lines
15 KiB
Vue
|
<!-- 拣货单 -->
|
|||
|
|
<template>
|
|||
|
|
<view class="draw-all">
|
|||
|
|
<view class="draw-contain">
|
|||
|
|
<!-- 解决margin重叠问题 -->
|
|||
|
|
<view class="title-title">
|
|||
|
|
留置针敷贴(医用透明敷料)
|
|||
|
|
</view>
|
|||
|
|
<view class="draw-title" style="margin-top: 35rpx;margin-bottom: 10rpx;">
|
|||
|
|
<view class="draw-flex">
|
|||
|
|
<view class="draw-title-gun"></view>
|
|||
|
|
<view class="draw-title-font">采购单</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-card-once">
|
|||
|
|
<view class="swiper-card-top">
|
|||
|
|
<view class="swiper-card-top-card">
|
|||
|
|
<view class="swiper-card-top-card-noral">
|
|||
|
|
<view class="swiper-all-flex">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
货品名称:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
留置针敷贴(医用透明敷料)
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-all-flex" style="width: 45%;">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
货品编码:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
FLYP001
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-card-top-card-noral" style="margin-top: 15rpx;">
|
|||
|
|
<view class="swiper-all-flex">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
规格型号:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
6cm*7cm
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-all-flex" style="width: 45%;">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
采购单位:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
个
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-card-top-card-noral" style="margin-top: 15rpx;">
|
|||
|
|
<view class="swiper-all-flex" style="width: 30%;">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
采购单价:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
0.1
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-all-flex" style="width: 30%;">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
到货单价:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
0.12
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-all-flex" style="width: 30%;">
|
|||
|
|
<view class="swiper-gray">
|
|||
|
|
采购金额:
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-black">
|
|||
|
|
10.12
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="draw-title" style="margin-top: 35rpx;margin-bottom: 10rpx;">
|
|||
|
|
<view class="draw-flex">
|
|||
|
|
<view class="draw-title-gun"></view>
|
|||
|
|
<view class="draw-title-font">入库信息</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="color-father">
|
|||
|
|
<view class="color-pink" style="margin-left: 40rpx;">
|
|||
|
|
<view class="color-weight">
|
|||
|
|
10
|
|||
|
|
</view>
|
|||
|
|
<view class="color-font">
|
|||
|
|
采购数量
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="color-green">
|
|||
|
|
<view class="color-weight">
|
|||
|
|
0
|
|||
|
|
</view>
|
|||
|
|
<view class="color-font">
|
|||
|
|
入库数量
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="color-blue">
|
|||
|
|
<view class="color-weight">
|
|||
|
|
0
|
|||
|
|
</view>
|
|||
|
|
<view class="color-font">
|
|||
|
|
挂账数量
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
<view class="color-red">
|
|||
|
|
<view class="color-weight">
|
|||
|
|
0
|
|||
|
|
</view>
|
|||
|
|
<view class="color-font">
|
|||
|
|
销账数量
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="draw-title" style="margin-top: 35rpx;margin-bottom: 10rpx;">
|
|||
|
|
<view class="draw-flex">
|
|||
|
|
<view class="draw-title-gun"></view>
|
|||
|
|
<view class="draw-title-font">拣货入库</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-card-once" style="height: 240rpx;">
|
|||
|
|
<view class="swiper-card-top">
|
|||
|
|
<view class="swiper-card-top-card">
|
|||
|
|
<view class="swiper-card-top-card-noral" style="margin-top: 15rpx;flex-direction: column;">
|
|||
|
|
<view v-for="(item, index) in shopArray" :key="index" class="plsbuy-card-heng">
|
|||
|
|
<view class="card-flex">
|
|||
|
|
<!-- <view class="plsbuy-weight">供应商：</view> -->
|
|||
|
|
<view class="plsbuy-font-right">{{ item.name }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="card-flex">
|
|||
|
|
<view class="plsbuy-right-weight">{{index?`销账数量`:`入库数量`}}</view>
|
|||
|
|
<view :class="item.change===1?`plsbuy-jian-target`:`plsbuy-jian`"
|
|||
|
|
@click="subtractNumber(item)">
|
|||
|
|
-</view>
|
|||
|
|
<view class="plsbuy-number" @click="openIndex(index,item.many)">{{ item.many }}</view>
|
|||
|
|
<view :class="item.change===2?`plsbuy-jia-target`:`plsbuy-jia`"
|
|||
|
|
@click="addNumber(item)">+
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="dash-font">
|
|||
|
|
说明:采购改量=入库数量+销账数量+挂账改量，其中挂账致量由平台自动计算得出;平含根据入库致量、"销账致量和挂账致量分别生成对应的入库单销账中、挂账单。
|
|||
|
|
</view> -->
|
|||
|
|
<view class="draw-title" style="margin-top: 35rpx;margin-bottom: 25rpx;">
|
|||
|
|
<view class="draw-flex">
|
|||
|
|
<view class="draw-title-gun"></view>
|
|||
|
|
<view class="draw-title-font">拣货拍照</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="down-note">
|
|||
|
|
<image class="down-note-img" style="margin-left: 40rpx;" src="/static/index/Warehousing/zuo.png" />
|
|||
|
|
<scroll-view scroll-x style="height: 100%;width: 950rpx;" :show-scrollbar="false">
|
|||
|
|
<view style="display: flex;">
|
|||
|
|
<view v-for="(item,index) in photoArray" :key="index">
|
|||
|
|
<image class="down-note-photo" :src="item" @click="openPhoto(index)" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</scroll-view>
|
|||
|
|
<image class="down-note-img" src="/static/index/Warehousing/you.png" />
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view class="button-card">
|
|||
|
|
<view class="swiper-button-white" @click="closeIt">
|
|||
|
|
取消
|
|||
|
|
</view>
|
|||
|
|
<view class="swiper-button-blue" @click="closeIt">
|
|||
|
|
确定
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, defineEmits, watch } from 'vue';
|
|||
|
|
const note = ref("");
|
|||
|
|
const calendarShow = ref(false);
|
|||
|
|
const stateTarget = ref("");
|
|||
|
|
const emit = defineEmits(['opensuixing', "closehexiao","closepickingdrawer","openCal"])
|
|||
|
|
const props = defineProps({
|
|||
|
|
backnumber:{
|
|||
|
|
type:Number
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
watch(
|
|||
|
|
() => props.backnumber,
|
|||
|
|
() => {
|
|||
|
|
shopArray.value[saveIndex.value].many = props.backnumber
|
|||
|
|
})
|
|||
|
|
const postItems = ref(0);
|
|||
|
|
// const stateArray = ['已作废', '未确认', '已确认', '未完结', '待结账', '已结账'];
|
|||
|
|
// 初始化左侧菜单列表
|
|||
|
|
const buttonList = ref([
|
|||
|
|
{ url: '/static/index/Warehousing/sousuo.png', name: '查询' },
|
|||
|
|
{ url: '/static/index/Warehousing/chongzhi.png', name: '重置' },
|
|||
|
|
|
|||
|
|
]);
|
|||
|
|
const photoArray = ref([`https://img-s.msn.cn/tenant/amp/entityid/AA1ECZ6y.img?w=768&h=960&m=6&x=355&y=171&s=47&d=47`, `https://img-s.msn.cn/tenant/amp/entityid/AA1ECtEb.img?w=768&h=436&m=6&x=280&y=134&s=200&d=200`,"/static/index/addphoto.png"])
|
|||
|
|
const shopArray = ref([{
|
|||
|
|
name: "入库数量",
|
|||
|
|
many: 9999,
|
|||
|
|
change: 0
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: "销账数量",
|
|||
|
|
many: 0,
|
|||
|
|
change: 0
|
|||
|
|
},
|
|||
|
|
// {
|
|||
|
|
// name: "挂账数量",
|
|||
|
|
// many: 0,
|
|||
|
|
// change: 0
|
|||
|
|
// },
|
|||
|
|
]);
|
|||
|
|
const saveIndex = ref(0)
|
|||
|
|
const openIndex = (index:number,number:number) =>{
|
|||
|
|
saveIndex.value = index;
|
|||
|
|
emit("openCal",number)
|
|||
|
|
}
|
|||
|
|
const closeIt = () =>{
|
|||
|
|
emit("closepickingdrawer")
|
|||
|
|
}
|
|||
|
|
const chooseImages = () => {
|
|||
|
|
uni.chooseImage({
|
|||
|
|
count: 9, // 最多可选9张
|
|||
|
|
sizeType: ['original', 'compressed'], // 原图或压缩图
|
|||
|
|
sourceType: ['album', 'camera'], // 从相册或相机
|
|||
|
|
success: (res) => {
|
|||
|
|
photoArray.value.pop()
|
|||
|
|
photoArray.value = [...photoArray.value, ...res.tempFilePaths];
|
|||
|
|
photoArray.value.push("/static/index/addphoto.png")
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
const openPhoto = (index : number) => {
|
|||
|
|
if (index == photoArray.value.length - 1) {
|
|||
|
|
chooseImages()
|
|||
|
|
} else {
|
|||
|
|
uni.previewImage({
|
|||
|
|
urls: photoArray.value.slice(0, -1),
|
|||
|
|
current: photoArray.value[index],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
const subtractNumber = (item) => {
|
|||
|
|
item.many && item.many--
|
|||
|
|
item.change = 1
|
|||
|
|
setTimeout(() => {
|
|||
|
|
item.change = 0
|
|||
|
|
}, 300)
|
|||
|
|
}
|
|||
|
|
const addNumber = (item) => {
|
|||
|
|
item.many < 9999 && item.many++
|
|||
|
|
item.change = 2
|
|||
|
|
setTimeout(() => {
|
|||
|
|
item.change = 0
|
|||
|
|
}, 300)
|
|||
|
|
}
|
|||
|
|
const calendarchange = (e : any) => {
|
|||
|
|
stateTarget.value = e.result
|
|||
|
|
}
|
|||
|
|
const opensuixing = () => {
|
|||
|
|
emit('opensuixing')
|
|||
|
|
}
|
|||
|
|
const closehexiao = () => {
|
|||
|
|
emit('closehexiao')
|
|||
|
|
}
|
|||
|
|
// const opendetail = () => {
|
|||
|
|
// emit('opendetail')
|
|||
|
|
// }
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
.draw-all {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-top-left-radius: 80rpx;
|
|||
|
|
border-bottom-left-radius: 80rpx;
|
|||
|
|
overflow: hidden;
|
|||
|
|
|
|||
|
|
.draw-flex {
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.draw-contain {
|
|||
|
|
width: 100%;
|
|||
|
|
height: calc(100vh);
|
|||
|
|
background-image: url("/static/index/fanpink.png");
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-attachment: fixed;
|
|||
|
|
background-size: cover;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper-gray {
|
|||
|
|
color: #596278;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.draw-title {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 60rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
|
|||
|
|
.draw-flex {
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.draw-title-gun {
|
|||
|
|
margin-left: 20rpx;
|
|||
|
|
margin-right: 20rpx;
|
|||
|
|
width: 13rpx;
|
|||
|
|
height: 40rpx;
|
|||
|
|
background: linear-gradient(to bottom, #04BCED, #0160CE);
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.draw-title-font {
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin-top: -3rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.draw-title-blue {
|
|||
|
|
height: 50rpx;
|
|||
|
|
width: 120rpx;
|
|||
|
|
margin-right: 50rpx;
|
|||
|
|
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
|||
|
|
color: #fff;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
border: 1rpx solid #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
.swiper-card-once {
|
|||
|
|
margin: 0rpx 0 30rpx 30rpx;
|
|||
|
|
width: 1100rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
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;
|
|||
|
|
|
|||
|
|
.swiper-card-top {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 220rpx;
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
.swiper-card-top-card {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
|
|||
|
|
.swiper-card-top-card-weight {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin: 25rpx 0;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: 500;
|
|||
|
|
|
|||
|
|
.weight-left {
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
.blue-number {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: 700;
|
|||
|
|
color: #017DE9;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.weight-right {
|
|||
|
|
color: #FF6000;
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
.swiper-card-top-card-noral {
|
|||
|
|
// margin-left: 50rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-top: 17rpx;
|
|||
|
|
font-size: 25rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title-title {
|
|||
|
|
margin-top: 70rpx;
|
|||
|
|
margin-bottom: 40rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
// align-items: center;
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper-all-flex {
|
|||
|
|
display: flex;
|
|||
|
|
margin-top: 5rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.color-father {
|
|||
|
|
display: flex;
|
|||
|
|
margin-left: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.color-weight {
|
|||
|
|
font-size: 40rpx;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin-bottom: 15rpx;
|
|||
|
|
margin-left: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.color-font {
|
|||
|
|
margin-left: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.color-pink {
|
|||
|
|
width: 300rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
border-radius: 25rpx;
|
|||
|
|
box-shadow: 4rpx 8rpx 16rpx 4rpx #839fcc;
|
|||
|
|
background: linear-gradient(to bottom right, #eae7fa, #dadbf9);
|
|||
|
|
margin-left: 50rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
// align-items: center;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.color-green {
|
|||
|
|
width: 300rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
border-radius: 25rpx;
|
|||
|
|
box-shadow: 4rpx 8rpx 16rpx 4rpx #839fcc;
|
|||
|
|
background: linear-gradient(to bottom right, #bcf3f1, #9de9ee);
|
|||
|
|
margin-left: 50rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
// align-items: center;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
.color-red {
|
|||
|
|
width: 300rpx;
|
|||
|
|
height: 180rpx;
|
|||
|
|
border-radius: 25rpx;
|
|||
|
|
box-shadow: 4rpx 8rpx 16rpx 4rpx #839fcc;
|
|||
|
|
background: linear-gradient(to bottom right, #ffcccc, #ffccff);
|
|||
|
|
margin-left: 50rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
// align-items: center;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-card-heng {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
height: 100rpx;
|
|||
|
|
|
|||
|
|
.plsbuy-card-img {
|
|||
|
|
width: 40rpx;
|
|||
|
|
height: 40rpx;
|
|||
|
|
margin: 0 20rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-right-weight {
|
|||
|
|
font-weight: 700;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
// margin-left: 140rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-font-right {
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
line-height: 30rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-jian {
|
|||
|
|
background-color: #D3E7FF;
|
|||
|
|
width: 70rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-left: 30rpx;
|
|||
|
|
border: 1rpx solid #313A4E;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-jian-target {
|
|||
|
|
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
|||
|
|
color: #fff;
|
|||
|
|
width: 70rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
margin-left: 30rpx;
|
|||
|
|
border: 1rpx solid #fff;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-number {
|
|||
|
|
border: 1rpx solid #313A4E;
|
|||
|
|
// padding: 10rpx 20rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin: 0 10rpx;
|
|||
|
|
// margin: 0 20rpx;
|
|||
|
|
width: 90rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-number-target {
|
|||
|
|
color: #0076FF;
|
|||
|
|
border: 1rpx solid #0076FF;
|
|||
|
|
// padding: 10rpx 20rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin: 0 10rpx;
|
|||
|
|
// margin: 0 20rpx;
|
|||
|
|
width: 90rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-jia {
|
|||
|
|
background-color: #D3E7FF;
|
|||
|
|
width: 70rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
border: 1rpx solid #313A4E;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
margin-right: 5rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-jia-target {
|
|||
|
|
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
|||
|
|
color: #fff;
|
|||
|
|
width: 70rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
border: 1rpx solid #fff;
|
|||
|
|
font-size: 35rpx;
|
|||
|
|
margin-right: 5rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.card-flex {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.plsbuy-number {
|
|||
|
|
border: 1rpx solid #313A4E;
|
|||
|
|
// padding: 10rpx 20rpx;
|
|||
|
|
border-radius: 10rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
font-weight: 700;
|
|||
|
|
margin: 0 10rpx;
|
|||
|
|
// margin: 0 20rpx;
|
|||
|
|
width: 90rpx;
|
|||
|
|
height: 70rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.dash-font {
|
|||
|
|
margin: 10rpx 30rpx;
|
|||
|
|
padding: 10rpx;
|
|||
|
|
width: 1100rpx;
|
|||
|
|
// height: 60rpx;
|
|||
|
|
border-style: dashed;
|
|||
|
|
/* 定义虚线 */
|
|||
|
|
border-width: 2px;
|
|||
|
|
/* 线宽 */
|
|||
|
|
border-color: #FF6657;
|
|||
|
|
border-radius: 15rpx;
|
|||
|
|
color: #FF6657;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.down-note {
|
|||
|
|
width: 100%;
|
|||
|
|
overflow: hidden;
|
|||
|
|
height: 170rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
position: relative;
|
|||
|
|
margin-top: -10rpx;
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
.down-note-img {
|
|||
|
|
width: 60rpx;
|
|||
|
|
height: 60rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.down-note-photo {
|
|||
|
|
height: 150rpx;
|
|||
|
|
width: 200rpx;
|
|||
|
|
margin: 0 10rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.button-card {
|
|||
|
|
margin-top: 30rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.swiper-button-blue {
|
|||
|
|
background: linear-gradient(to 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: 35rpx;
|
|||
|
|
}
|
|||
|
|
.swiper-button-white {
|
|||
|
|
background: #fff;
|
|||
|
|
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: 35rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|