998 lines
24 KiB
Vue
998 lines
24 KiB
Vue
<template>
|
||
<view class="buttons-father" :style="transition?{opacity: `1`}:{opacity: `0`}" v-show="isShow">
|
||
<view class="ipt">
|
||
<input type="text" v-model="plzinfo.searchContent" placeholder="请领单号" @confirm="clickconfirm" />
|
||
</view>
|
||
<view class="scr" @click="clickconfirm">
|
||
检索
|
||
</view>
|
||
<view class="shx" @click="chongzhi">
|
||
<image src="/static/index/requestform/chongzhi.png" mode="aspectFill"></image>
|
||
<view class="shx-font">
|
||
重置
|
||
</view>
|
||
</view>
|
||
<view class="right-button" @click="badshow=true" v-show="plsbuy[lefttarget]?.status==`1`">
|
||
<image src="/static/index/warehouse/procurement/picking/bebad.png" />
|
||
<view>
|
||
作废
|
||
</view>
|
||
</view>
|
||
<view class="right-button" @click="shouhuoshow=true" v-show="plsbuy[lefttarget]?.status==`4`">
|
||
<image src="/static/index/warehouse/procurement/picking/shouhuo.png" />
|
||
<view>
|
||
收货
|
||
</view>
|
||
</view>
|
||
<nomessage cont="暂无数据" :show="nomessageshow" />
|
||
|
||
</view>
|
||
<tanchuang :show="badshow" font="确定要作废这个请领单吗" @back="badshow=false;" @right="zuofei"> </tanchuang>
|
||
<tanchuang :show="shouhuoshow" font="这个请领单确定要收货吗" @back="shouhuoshow=false;" @right="shouhuo"> </tanchuang>
|
||
|
||
<view class="other-contain" :style="transition?{opacity: `1`}:{opacity: `0`}" v-show="isShow && !nomessageshow">
|
||
<view class="other-contain-left">
|
||
<view class="left-selecttype">
|
||
<view :class="selectType===index?`selecttype-target`: `selecttype`" v-for="(item,index) in tagsarray"
|
||
@click="changetype(index)">
|
||
{{ item }}
|
||
</view>
|
||
<view class="heng-blue" :style="{ left: `${selectType === 0 ? 11.5 : 12 + selectType * 18.5}%` }">
|
||
</view>
|
||
</view>
|
||
<scroll-view scroll-y="true" scroll-with-animation class="left-menu-scroll" :scroll-top="leftscrolltop"
|
||
@scrolltolower="plsbuytolower" :lower-threshold="200">
|
||
<view style="height: 1%;"></view>
|
||
<view class="pls-card" v-for="(v,i) in plsbuy" :key='i' @click="clickLeftMenu(i,v)" :style="{
|
||
borderColor: i === lefttarget ? '' : 'transparent',
|
||
background: i === lefttarget ? '#fff' : 'rgba(255,255,255,0.6)'
|
||
}">
|
||
<view
|
||
style="background: #ff5757;position: absolute;width: 1.3vw;height: 1.3vw;border-radius: 50%;right: -0.5vw;top: -0.2vw;"
|
||
v-if="v.izYgRead=='N'">
|
||
</view>
|
||
<view class="pls-card-title">
|
||
<view class="middle-title-spec">
|
||
请领单号
|
||
</view>
|
||
<view class="title-left">
|
||
{{ v.qldNo }}
|
||
</view>
|
||
</view>
|
||
<view class="pls-card-middle">
|
||
<view class="middle-heng"></view>
|
||
<view class="pls-card-middle-one">
|
||
<view class="middle-title">
|
||
{{ v.tjTime.replace(/-/g, '.') }}
|
||
</view>
|
||
<view class="middle-heng-father">
|
||
<image class="middle-ball-img" src="/static/index/requestform/isok.png" />
|
||
</view>
|
||
<view class="end-font">
|
||
|
||
<view>
|
||
待出库
|
||
</view>
|
||
<view style="font-size: 25rpx;">
|
||
{{ "[ " + v.tjByName + " ]" }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pls-card-middle-one">
|
||
<view class="middle-title"
|
||
:style=" v?.status === '2' || v?.status === '3' ?{color:`#FF5757`}:{}">
|
||
{{
|
||
Number(v.status)>1?
|
||
v?.status === '2'
|
||
? v.zfTime?.slice(0,10).replace(/-/g, '.')
|
||
: v?.status === '3'
|
||
? v.htTime?.slice(0,10).replace(/-/g, '.')
|
||
: v.ckTime?.slice(0,10).replace(/-/g, '.')
|
||
: ""
|
||
}}
|
||
|
||
</view>
|
||
<view class="middle-heng-father">
|
||
<image class="middle-ball-img" style="width: 32rpx;height: 32rpx;" v-if="v?.status === '2' || v?.status === '3'" src="/static/index/requestform/iserror.png" />
|
||
<view class="middle-ball"
|
||
v-else-if="v?.status === '1'">
|
||
</view>
|
||
<image class="middle-ball-img" v-else src="/static/index/requestform/isok.png" />
|
||
</view>
|
||
<view class="end-font">
|
||
|
||
<view :style="v?.status === '2' || v?.status === '3' ?{color:`#FF5757`}:{}">
|
||
{{
|
||
v?.status === '2'
|
||
? `已作废`
|
||
: v?.status === '3'
|
||
? `已回退`
|
||
: `已出库`
|
||
}}
|
||
|
||
</view>
|
||
<view style="font-size: 25rpx;" v-if="Number(v.status)>1"
|
||
:style=" v?.status === '2' || v?.status === '3' ?{color:`#FF5757`}:{}">
|
||
{{ "[ " + (v?.status === '2'
|
||
? v?.zfByName
|
||
: v?.status === '3'
|
||
? v?.htByName
|
||
: v?.ckByName)+ " ]" }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pls-card-middle-one">
|
||
<view class="middle-title">
|
||
{{ Number(v.status)==5 ? v.shTime?.slice(0,10).replace(/-/g, '.') :""}}
|
||
</view>
|
||
|
||
<view class="middle-heng-father">
|
||
|
||
<!-- <view class="middle-ball" :style="{backgroundColor: `#1083F8`}"></view> -->
|
||
<view class="middle-ball" :style="Number(v.status)==4?{}:{backgroundColor: `#E5E5E5`}"
|
||
v-if="Number(v.status)!=5"></view>
|
||
<image class="middle-ball-img" v-else src="/static/index/requestform/isok.png" />
|
||
</view>
|
||
<view class="end-font">
|
||
<view v-if="v?.cgdType!='9'">
|
||
已收货
|
||
</view>
|
||
<view style="font-size: 25rpx;" v-if="Number(v.status)==5">
|
||
{{ "[ " + v.shByName + " ]" }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="pls-card-end">
|
||
<view class="end-left">
|
||
<image class="end-left-img" src="/static/index/requestform/gongyingshang.png" />
|
||
<view class="end-left-font">
|
||
{{ v.nuName }}
|
||
</view>
|
||
</view>
|
||
<view :class="v?.status === '2' || v?.status === '3' ?`tag-fail`:`tag-success`">
|
||
{{ v.statusText }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
<view class="other-contain-right">
|
||
<scroll-view scroll-y="true" scroll-with-animation class="right-contain">
|
||
<view class="right-ones">
|
||
<view class="right-one" v-for="(item,index) in rightarray" :key="index">
|
||
<view class="right-one-left">
|
||
<image class="left-image"
|
||
:src="item.materialInfo.materialImg?serverUrl+item.materialInfo.materialImg:'/static/index/procurement/k.png'"
|
||
mode="aspectFill"></image>
|
||
<view class="left-tages" style="margin-top: -15rpx;">
|
||
{{ item.materialInfo.categoryName}}
|
||
</view>
|
||
<view class="left-tages">
|
||
{{ item.materialInfo.typeName}}
|
||
</view>
|
||
</view>
|
||
<view class="right-one-right">
|
||
<view class="right-title">
|
||
{{ item.materialInfo.materialName }}
|
||
</view>
|
||
<view class="right-setting">
|
||
规格型号
|
||
</view>
|
||
<view class="right-mm">
|
||
{{ item.materialInfo.materialNo }}
|
||
</view>
|
||
<view class="right-down">
|
||
<view class="">
|
||
<view class="right-first-num">
|
||
{{ item.qlNum }}
|
||
</view>
|
||
<view class="right-first-type">
|
||
请领数量
|
||
</view>
|
||
</view>
|
||
<view class="right-shu"></view>
|
||
<view class="">
|
||
<view class="right-first-num" style="font-weight: 500;">
|
||
{{ item.materialInfo.materialUnits }}
|
||
</view>
|
||
<view class="right-first-type">
|
||
请领单位
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<defaultr cont="暂无数据" v-if="rightarray.length==0 && rightdonghua"
|
||
style="width: 30%;height: 30%;position: absolute;">
|
||
</defaultr>
|
||
</scroll-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"
|
||
import { queryQld, queryQldWlInfo, transRead, cancellation,confirmReceipt } from '../api/api.js'
|
||
import nomessage from '../common/nomessage.vue'
|
||
import defaultr from '../common/default.vue'
|
||
const props = defineProps({
|
||
isShow: {
|
||
type: Boolean,
|
||
required: true,
|
||
},
|
||
});
|
||
const tagsarray = ref(["全部", "待出库", "已出库", "已收货 ", "已作废"])
|
||
// const nottrue = Array(10).fill(null)
|
||
// 使用watch监听isShow变化
|
||
const transition = ref(false);
|
||
watch(
|
||
() => props.isShow,
|
||
(newVal, oldVal) => {
|
||
console.log("??????",newVal, oldVal)
|
||
// 当旧值为false，新值为true时延迟0.2秒调用方法
|
||
if (!oldVal && newVal) {
|
||
transition.value = false;
|
||
chongzhi()
|
||
// firstgetqueryCgdList();
|
||
setTimeout(() => {
|
||
transition.value = true;
|
||
}, 50)
|
||
} else {
|
||
transition.value = false;
|
||
}
|
||
|
||
}
|
||
)
|
||
onMounted(() => {
|
||
|
||
})
|
||
const lanjie = ref(false);
|
||
|
||
const selectType = ref(0)
|
||
const changetype = (index : number) => {
|
||
if ((selectType.value == index) && index) {
|
||
return
|
||
}
|
||
leftscrolltop.value = 1
|
||
setTimeout(() => {
|
||
leftscrolltop.value = 0
|
||
}, 50)
|
||
lefttarget.value = 0
|
||
selectType.value = index
|
||
plzinfo.pageNo = 1;
|
||
plzinfo.canpull = true;
|
||
|
||
switch (index) {
|
||
case 0:
|
||
plzinfo.status = `1,2,4,5`
|
||
break
|
||
case 1:
|
||
plzinfo.status = `1`
|
||
break
|
||
case 2:
|
||
plzinfo.status = `4`
|
||
break
|
||
case 3:
|
||
plzinfo.status = `5`
|
||
break
|
||
case 4:
|
||
plzinfo.status = `2`
|
||
break
|
||
}
|
||
firstgetqueryCgdList()
|
||
}
|
||
const clickconfirm = () => {
|
||
if (chongzhiLock) return
|
||
chongzhiLock = true
|
||
plzinfo.pageNo = 1;
|
||
plzinfo.canpull = true;
|
||
lefttarget.value = 0
|
||
firstgetqueryCgdList()
|
||
leftscrolltop.value = 1
|
||
setTimeout(() => {
|
||
leftscrolltop.value = 0
|
||
}, 10)
|
||
setTimeout(() => chongzhiLock = false, 500)
|
||
}
|
||
let chongzhiLock = false
|
||
|
||
const chongzhi = () => {
|
||
if (chongzhiLock) return
|
||
chongzhiLock = true
|
||
|
||
plzinfo.searchContent = ""
|
||
changetype(0)
|
||
// firstgetqueryCgdList()
|
||
|
||
setTimeout(() => chongzhiLock = false, 500)
|
||
}
|
||
const plsbuy = ref([])
|
||
const alltotal = ref(0);
|
||
const lefttarget = ref(0)
|
||
const plzinfo = reactive({
|
||
pageNo: 1,
|
||
pageSize: 5,
|
||
canpull: true,
|
||
searchContent: "",
|
||
status: "1,2,4,5",
|
||
elderId: uni.getStorageSync('NUall').elderId,
|
||
nuId: uni.getStorageSync('nuId')
|
||
})
|
||
|
||
const nomessageshow = ref(false);
|
||
const leftscrolltop = ref(0)
|
||
|
||
const rightarray = ref([]);
|
||
// 检测锁
|
||
const cannomessage = ref(true)
|
||
const rightdonghua = ref(true);
|
||
const firstgetqueryCgdList = () => {
|
||
queryQld(plzinfo).then((res : any) => {
|
||
transition.value = true;
|
||
// console.log("kankan",plzinfo,res)
|
||
if (((res.message === "缺少参数") || (!res.result?.total)) && cannomessage.value) {
|
||
nomessageshow.value = true;
|
||
return
|
||
}
|
||
|
||
cannomessage.value = false
|
||
plsbuy.value = []
|
||
plsbuy.value.push(...res.result.records)
|
||
// console.log("入参", plzinfo)
|
||
// console.log("查看数组", res.result.records)
|
||
alltotal.value = res.result.total
|
||
|
||
// console.log("请购单数据呢???", res)
|
||
if (res.result.records.length) {
|
||
rightdonghua.value = false;
|
||
|
||
queryQldWlInfo({ qldNo: res.result.records[0].qldNo }).then((element : any) => {
|
||
rightarray.value = []
|
||
// console.log("////",element.result)
|
||
rightarray.value.push(...element.result)
|
||
rightdonghua.value = true;
|
||
})
|
||
}
|
||
|
||
if (res.result.records.length < plzinfo.pageSize) {
|
||
plzinfo.canpull = false;
|
||
}
|
||
|
||
})
|
||
}
|
||
const setout = ref(true)
|
||
let times = null
|
||
const plsbuytolower = () => {
|
||
if (!setout.value) { return }
|
||
plzinfo.pageNo++;
|
||
getqueryCgdList()
|
||
setout.value = false
|
||
times = setTimeout(() => {
|
||
setout.value = true
|
||
}, 500)
|
||
}
|
||
//获得采购单列表
|
||
const getqueryCgdList = () => {
|
||
if (!plzinfo.canpull) return
|
||
queryQld(plzinfo).then((res : any) => {
|
||
console.log("???加载", res.result.records)
|
||
plsbuy.value.push(...res.result.records)
|
||
alltotal.value = res.result.total
|
||
if (res.result.records.length < plzinfo.pageSize) {
|
||
plzinfo.canpull = false;
|
||
}
|
||
})
|
||
}
|
||
const clickLeftMenu = (index : any, item : any) => {
|
||
let num = Math.ceil((index + 1))
|
||
leftscrolltop.value = (num - 2) * 175.4;
|
||
lefttarget.value = index;
|
||
|
||
rightdonghua.value = false;
|
||
queryQldWlInfo({ qldNo: plsbuy.value[index].qldNo }).then((element : any) => {
|
||
rightarray.value = [];
|
||
rightarray.value.push(...element.result)
|
||
rightdonghua.value = true;
|
||
})
|
||
// form.cgdId = plsbuy.value[index].id
|
||
// form.pageNo = 1
|
||
// form.canpull = true;
|
||
// // console.log("!!!!",form)
|
||
// queryCgdInfoList(form).then(res => {
|
||
// InvoicingList.value = []
|
||
// // console.log("数据呢", res.result.records)
|
||
// InvoicingList.value.push(...res.result.records);
|
||
// if (form.pageNo) {
|
||
// clickmiddle(0);
|
||
// }
|
||
// })
|
||
if (item.izYgRead == 'N') {
|
||
let param = {
|
||
status: `yg`,
|
||
qldNo: plsbuy.value[index].qldNo,
|
||
}
|
||
transRead(param).then((res : any) => {
|
||
if (res.success) {
|
||
item.izYgRead = 'Y'
|
||
}
|
||
})
|
||
}
|
||
|
||
}
|
||
const serverUrl = ref("")
|
||
onLoad(() => {
|
||
// console.log("查看",uni.getStorageSync('NUall'))
|
||
|
||
serverUrl.value = uni.getStorageSync('serverUrl') + '/sys/common/static/';
|
||
// getSelectList();
|
||
})
|
||
const badshow = ref(false)
|
||
const zuofei = () => {
|
||
|
||
cancellation({ qldNo: plsbuy.value[lefttarget.value].qldNo }).then((res : any) => {
|
||
console.log('作废', res)
|
||
badshow.value = false
|
||
if(res.success){
|
||
plsbuy.value[lefttarget.value] = res.result.result
|
||
}else{
|
||
plzinfo.pageNo = 1;
|
||
plzinfo.canpull = true;
|
||
leftscrolltop.value = 1
|
||
setTimeout(() => {
|
||
leftscrolltop.value = 0
|
||
}, 50)
|
||
lefttarget.value = 0
|
||
firstgetqueryCgdList();
|
||
}
|
||
|
||
setTimeout(() => {
|
||
uni.showToast({
|
||
title: res.success?res.result.message:res.message,
|
||
icon: 'none', // 'none' 表示不带图标
|
||
duration: 3000
|
||
})
|
||
}, 300)
|
||
|
||
})
|
||
}
|
||
const shouhuoshow = ref(false)
|
||
const shouhuo = () => {
|
||
let param = {
|
||
qldNo: plsbuy.value[lefttarget.value].qldNo,
|
||
elderId: uni.getStorageSync('NUall').elderId,
|
||
nuId: uni.getStorageSync('nuId')
|
||
}
|
||
confirmReceipt(param).then((res : any) => {
|
||
console.log('收货', param,res)
|
||
shouhuoshow.value = false
|
||
if(res.success){
|
||
plsbuy.value[lefttarget.value] = res.result.result
|
||
}else{
|
||
plzinfo.pageNo = 1;
|
||
leftscrolltop.value = 1
|
||
setTimeout(() => {
|
||
leftscrolltop.value = 0
|
||
}, 50)
|
||
lefttarget.value = 0
|
||
plzinfo.canpull = true;
|
||
firstgetqueryCgdList();
|
||
}
|
||
|
||
setTimeout(() => {
|
||
uni.showToast({
|
||
title: res.success?res.result.message:res.message,
|
||
icon: 'none', // 'none' 表示不带图标
|
||
duration: 3000
|
||
})
|
||
}, 300)
|
||
|
||
})
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
.right-container-tem {
|
||
display: flex;
|
||
|
||
.right-container-tem-text {
|
||
font-size: 30rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
|
||
|
||
.right-container-tem-img {
|
||
width: 38rpx;
|
||
height: 38rpx;
|
||
}
|
||
}
|
||
|
||
.buttons-father {
|
||
width: 100%;
|
||
height: 90rpx;
|
||
transition: opacity 1s ease;
|
||
display: flex;
|
||
position: relative;
|
||
|
||
.ipt {
|
||
display: flex;
|
||
align-items: center;
|
||
width: 16vw;
|
||
background: #E2E4E9;
|
||
border-radius: 1.65vw;
|
||
height: 3.3vw;
|
||
|
||
image {
|
||
width: 2.2vw;
|
||
height: 2.2vw;
|
||
margin: 0 0.5vw;
|
||
}
|
||
|
||
input {
|
||
width: 18vw;
|
||
height: 3.5vw;
|
||
font-size: 1.4vw;
|
||
padding-left: 1.6vw;
|
||
|
||
}
|
||
}
|
||
|
||
.scr {
|
||
border-radius: 1.65vw;
|
||
font-weight: 400;
|
||
font-size: 1.4vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 0 0 0 0.7vw;
|
||
background-color: #fff;
|
||
border: 1px solid #D9DADC;
|
||
color: #555555;
|
||
width: 6.5vw;
|
||
height: 3.3vw;
|
||
}
|
||
|
||
.shx {
|
||
width: 6.5vw;
|
||
height: 3.3vw;
|
||
background-color: #fff;
|
||
border-radius: 1.65vw;
|
||
border: 1px solid #D9DADC;
|
||
font-weight: 400;
|
||
font-size: 1.4vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 0 0 0 0.5vw;
|
||
color: #555555;
|
||
|
||
image {
|
||
width: 1.5vw;
|
||
height: 1.5vw;
|
||
margin: 0 0.2vw 0 0;
|
||
}
|
||
|
||
|
||
}
|
||
|
||
.right-button {
|
||
position: absolute;
|
||
right: 1.8vw;
|
||
top: 0;
|
||
width: 6.5vw;
|
||
height: 3.3vw;
|
||
background-color: #fff;
|
||
border-radius: 1.65vw;
|
||
border: 1px solid #D9DADC;
|
||
font-weight: 400;
|
||
font-size: 1.4vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
// margin: 0 0 0 0.5vw;
|
||
color: #555555;
|
||
|
||
image {
|
||
width: 1.5vw;
|
||
height: 1.5vw;
|
||
margin: 0.1vw 0.2vw 0 0;
|
||
}
|
||
}
|
||
|
||
.right-button:active,
|
||
.scr:active,
|
||
.shx:active {
|
||
color: #1083F8;
|
||
background: linear-gradient(-45deg, rgba(223, 244, 252, 1), rgba(204, 228, 249, 0.43));
|
||
border: 1rpx solid #1083F8;
|
||
transition: .4s;
|
||
-webkit-transform-style: preserve-3d;
|
||
-webkit-overflow-scrolling: touch;
|
||
}
|
||
}
|
||
|
||
.other-contain {
|
||
width: 100%;
|
||
height: 1050rpx;
|
||
display: flex;
|
||
transition: opacity 1s ease;
|
||
|
||
.other-contain-left {
|
||
width: 35%;
|
||
height: 100%;
|
||
|
||
.left-menu-scroll {
|
||
margin-top: 3%;
|
||
height: 91%;
|
||
width: 100%;
|
||
// position: relative;
|
||
// overflow: auto;
|
||
|
||
// background-color: red;
|
||
.pls-card {
|
||
width: 98%;
|
||
height: 25.3vh;
|
||
border: #0f9fff 3rpx solid;
|
||
background-color: #fff;
|
||
border-radius: 40rpx;
|
||
margin-bottom: 1.5vh;
|
||
// margin: 1vh 0;
|
||
padding: 0 30rpx;
|
||
position: relative;
|
||
|
||
.pls-card-title {
|
||
height: 5.5vh;
|
||
width: 105%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-end;
|
||
|
||
padding-left: 10rpx;
|
||
padding-right: 35rpx;
|
||
|
||
.middle-title-spec {
|
||
color: #888888;
|
||
font-size: 29rpx;
|
||
}
|
||
|
||
.title-left {
|
||
font-weight: 600;
|
||
font-size: 34rpx;
|
||
// color: #888888;
|
||
}
|
||
|
||
.title-right {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
font-size: 30rpx;
|
||
position: relative;
|
||
|
||
.title-right-big {
|
||
font-weight: 600;
|
||
font-size: 40rpx;
|
||
margin-right: 35rpx;
|
||
color: #555555;
|
||
}
|
||
|
||
.title-right-img {
|
||
position: absolute;
|
||
right: -10rpx;
|
||
bottom: 6rpx;
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pls-card-middle {
|
||
width: 100%;
|
||
height: 11vh;
|
||
margin-top: 1.5vh;
|
||
display: flex;
|
||
position: relative;
|
||
|
||
.middle-heng {
|
||
position: absolute;
|
||
left: 4%;
|
||
top: 35%;
|
||
transform: translateY(-35%);
|
||
width: 92%;
|
||
height: 2px;
|
||
/* 虚线粗细 */
|
||
background-image: repeating-linear-gradient(to right,
|
||
#E5E5E5 0,
|
||
#E5E5E5 6px,
|
||
transparent 6px,
|
||
transparent 10px);
|
||
}
|
||
|
||
.pls-card-middle-one {
|
||
width: 33.3%;
|
||
height: 100%;
|
||
|
||
// background-color: yellow;
|
||
.middle-title {
|
||
width: 100%;
|
||
height: 2.1vh;
|
||
// background-color: #007CFF;
|
||
color: #888888;
|
||
text-align: center;
|
||
font-size: 25rpx;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.middle-heng-father {
|
||
width: 100%;
|
||
height: 4vh;
|
||
position: relative;
|
||
|
||
.middle-ball-img {
|
||
width: 35rpx;
|
||
height: 35rpx;
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%, -50%);
|
||
}
|
||
|
||
.middle-ball {
|
||
width: 20rpx;
|
||
height: 20rpx;
|
||
background-color: #1083F8;
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%, -50%);
|
||
border-radius: 50%;
|
||
}
|
||
}
|
||
|
||
.end-font {
|
||
width: 100%;
|
||
height: 6vh;
|
||
text-align: center;
|
||
color: #666666;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
font-size: 25rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.pls-card-end {
|
||
width: 100%;
|
||
height: 6vh;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
position: relative;
|
||
padding-left: 15rpx;
|
||
margin-top: 10rpx;
|
||
|
||
.end-left {
|
||
height: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.end-left-img {
|
||
width: 35rpx;
|
||
height: 35rpx;
|
||
}
|
||
|
||
.end-left-font {
|
||
margin-top: 3rpx;
|
||
width: 400rpx;
|
||
// background-color: #007CFF;
|
||
// font-size: 26rpx;
|
||
color: #666666;
|
||
margin-left: 3rpx;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
}
|
||
|
||
.tag-fail {
|
||
width: 120rpx;
|
||
height: 50rpx;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-color: #FDEBEC;
|
||
color: #FF5757;
|
||
border: 1rpx solid #FF5757;
|
||
position: absolute;
|
||
right: 0rpx;
|
||
bottom: 20rpx;
|
||
}
|
||
|
||
.tag-success {
|
||
width: 120rpx;
|
||
height: 50rpx;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-color: #ECF6FF;
|
||
color: #1083F8;
|
||
border: 1rpx solid #1083F8;
|
||
position: absolute;
|
||
right: 0rpx;
|
||
bottom: 20rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.left-selecttype {
|
||
width: 98%;
|
||
height: 80rpx;
|
||
border-radius: 40rpx;
|
||
background-color: #FFFFFF;
|
||
display: flex;
|
||
padding-right: 30rpx;
|
||
padding-left: 15rpx;
|
||
position: relative;
|
||
|
||
|
||
.heng-blue {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 25rpx;
|
||
height: 8rpx;
|
||
border-radius: 10rpx;
|
||
background-color: #1083F8;
|
||
transition: 0.3s all ease;
|
||
|
||
}
|
||
|
||
.selecttype {
|
||
width: 20%;
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #999999;
|
||
font-size: 31rpx;
|
||
position: relative;
|
||
|
||
}
|
||
|
||
.selecttype-target {
|
||
width: 20%;
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #222222;
|
||
font-size: 31rpx;
|
||
font-weight: 600;
|
||
position: relative;
|
||
}
|
||
}
|
||
}
|
||
|
||
.other-contain-right {
|
||
width: 64%;
|
||
margin-left: 1%;
|
||
height: 103.5%;
|
||
|
||
.right-contain {
|
||
width: 100%;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
position: relative;
|
||
|
||
|
||
.right-ones {
|
||
display: flex;
|
||
width: 100%;
|
||
flex-wrap: wrap;
|
||
|
||
|
||
.right-one {
|
||
width: 570rpx;
|
||
height: 261rpx;
|
||
margin-right: 20rpx;
|
||
margin-bottom: 15rpx;
|
||
background-color: #fff;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
|
||
.right-one-left {
|
||
height: 100%;
|
||
width: 40%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
|
||
.left-image {
|
||
width: 150rpx;
|
||
height: 150rpx;
|
||
// margin: 15rpx 0;
|
||
margin-top: 10rpx;
|
||
margin-bottom: 15rpx;
|
||
// margin-top: 5rpx;
|
||
}
|
||
|
||
.left-tages {
|
||
width: 130rpx;
|
||
height: 43rpx;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #555555;
|
||
border: 1rpx solid #D2D2D2;
|
||
margin-top: 5rpx;
|
||
font-size: 23rpx;
|
||
}
|
||
}
|
||
|
||
.right-one-right {
|
||
height: 100%;
|
||
width: 60%;
|
||
|
||
.right-title {
|
||
font-size: 34rpx;
|
||
font-weight: 600;
|
||
margin-top: 25rpx;
|
||
color: #222222;
|
||
width: 300rpx;
|
||
overflow: hidden;
|
||
/* 必须 */
|
||
white-space: nowrap;
|
||
/* 强制单行 */
|
||
text-overflow: ellipsis;
|
||
/* 显示省略号 */
|
||
}
|
||
|
||
.right-setting {
|
||
color: #888888;
|
||
margin-top: 5rpx;
|
||
font-size: 25rpx;
|
||
}
|
||
|
||
.right-mm {
|
||
color: #555555;
|
||
font-size: 28rpx;
|
||
}
|
||
|
||
.right-down {
|
||
display: flex;
|
||
margin-top: 15rpx;
|
||
|
||
.right-first-num {
|
||
font-size: 35rpx;
|
||
color: #555555;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.right-first-type {
|
||
color: #888888;
|
||
font-size: 23rpx;
|
||
}
|
||
|
||
.right-shu {
|
||
width: 2rpx;
|
||
height: 50rpx;
|
||
background-color: #C9C9C9;
|
||
margin: 0 40rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
</style> |