2350 lines
46 KiB
Vue
2350 lines
46 KiB
Vue
<template>
|
||
<view>
|
||
<!-- 采购 -->
|
||
<view class="box">
|
||
<view class="rel-left">
|
||
<scroll-view scroll-y="true" scroll-with-animation :scroll-top="leftscrolltop" class="scroll-Y"
|
||
@scrolltolower="plsbuytolower" :lower-threshold="400">
|
||
<view class="margin-height"></view>
|
||
<view class="boxitem" v-for="(v,i) in plsbuy" :key='i'
|
||
:class="{'yujing':v?.cgdType=='9','active':leftitem==i}"
|
||
@click="getmiddle(v,i);saveleftgo = i;">
|
||
|
||
<view>{{ v.cgdNo }}</view>
|
||
<view>供应商:{{ v.gysId_dictText }}</view>
|
||
<view>采购人: {{ v.createBy_dictText }}</view>
|
||
<view>{{ v.qgDate }}</view>
|
||
<view>
|
||
<view>
|
||
采购金额
|
||
</view>
|
||
<view>
|
||
￥ <text class="dollar">{{v.totalPrice}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="v?.cgdType=='9'" class="zuofei">
|
||
已作废
|
||
</view>
|
||
|
||
|
||
|
||
|
||
</view>
|
||
</scroll-view>
|
||
<view class="fxj">
|
||
<arrowkeys @movecard="movecard" :getblue="getblue" :moveleft="45" />
|
||
<text>长春市朝阳区久泰开运养老服务有限公司</text>
|
||
</view>
|
||
</view>
|
||
<view class="lefts">
|
||
<view class="caigoudan guodu">
|
||
<view class="title">
|
||
<view></view>采购单
|
||
</view>
|
||
<view class="cgdh brtop">
|
||
<view>采购单号：<text>{{plsbuy[leftitem].cgdNo}}</text></view>
|
||
<view>采购金额：<text>{{plsbuy[leftitem].totalPrice}}</text></view>
|
||
</view>
|
||
<view class="cgdh">
|
||
<view>采购人：{{plsbuy[leftitem].createBy_dictText}} </view>
|
||
<view>采购日期：{{plsbuy[leftitem].qgDate}}</view>
|
||
<view>供应商：{{plsbuy[leftitem].gysId_dictText}}</view>
|
||
</view>
|
||
<scroll-view scroll-y="true" class="cgdscroll" scroll-with-animation>
|
||
<view class="fler">
|
||
<view class="boxitem" v-for="(f,l) in InvoicingList" :key='l' @scrolltolower="scrolltolower"
|
||
:lower-threshold="200">
|
||
<view>{{f.wlName}}</view>
|
||
<view style="white-space: nowrap;">规格型号：{{f.wlSpecificationModel}}</view>
|
||
<view>采购金额：{{f.procurementPrice}}</view>
|
||
<view>采购数量：{{f.purchaseQuantity}}</view>
|
||
</view>
|
||
</view>
|
||
<view style="height:3vw;width: 100%;display: flex;align-items: center;justify-content: center;">
|
||
<u-loadmore :status="status" :loadText="{nomore:'暂无更多数据'}" v-if="InvoicingList.length>6"/>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="rights">
|
||
<view class="shitem">
|
||
<view class="shypk">
|
||
<view>生活用品库</view>
|
||
|
||
</view>
|
||
<view class="jqry">
|
||
<view class="left tp">
|
||
<image
|
||
:src="cellobj?.fzrHeadPath?serverUrl + cellobj?.fzrHeadPath:'/static/index/warehouse/procurement/jqr.png'"
|
||
mode="aspectFill"></image>
|
||
</view>
|
||
<view class="rigname">
|
||
<view>{{cellobj?.fzr}}</view>
|
||
<view>
|
||
<text>{{cellobj?.fzrTel?cellobj?.fzrTel:'-'}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="typeitem">
|
||
<view class="toptype">
|
||
<!-- <view v-for="v in ['三','二','一']">{{v+'级分类'}}</view> -->
|
||
<view :class="scroll.act3==-1?'act':''" @click="typescroll(3,-1,{})">全部</view>
|
||
<view :class="scroll.act2==-1?'act':''" @click="typescroll(2,-1,{})">全部</view>
|
||
<view :class="scroll.act1==-1?'act':''" @click="typescroll(1,-1,{})">全部</view>
|
||
</view>
|
||
<view class="scroltype">
|
||
<scroll-view scroll-y="true" scroll-with-animation :scroll-top="scroll.scrolltop3"
|
||
class="scroll-Y">
|
||
<view :class="scroll.act3==i?'act':''"
|
||
v-for="(v,i) in TreeData[scroll.act1]?.children[scroll.act2]?.children"
|
||
@click="typescroll(3,i,v)">
|
||
{{v.title}}
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<scroll-view scroll-y="true" scroll-with-animation :scroll-top="scroll.scrolltop2"
|
||
class="scroll-Y">
|
||
<view :class="scroll.act2==i?'act':''" v-for="(v,i) in TreeData[scroll.act1]?.children"
|
||
@click="typescroll(2,i,v)">
|
||
{{v.title}}
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<scroll-view scroll-y="true" scroll-with-animation :scroll-top="scroll.scrolltop1"
|
||
class="scroll-Y scrl1">
|
||
<view :class="scroll.act1==i?'act':''" v-for="(v,i) in TreeData" @click="typescroll(1,i,v)">
|
||
<image :src="serverUrl + v.appCheckIconPath" mode="aspectFill" v-if="scroll.act1==i">
|
||
</image>
|
||
<image :src="serverUrl + v.appIconPath" mode="aspectFill" v-else></image>
|
||
<text>
|
||
{{v.title}}
|
||
</text>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
<view class="anmikc">
|
||
<view v-for="(v,i) in animArray" :key="i" @click="admiclick(i)" class="mar-left">
|
||
<view>
|
||
<donghua width="2vw" height="2vw" :links="v.url" :playing="i === anmidex"
|
||
class="donghua" />
|
||
</view>
|
||
<text :style="plsbuy[leftitem]?.cgdType == '9'?{color:`#c8c8c8`}:{}">
|
||
{{v.name}}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view class="serchs">
|
||
<view class="ipt">
|
||
<input type="text" placeholder="物料名称/物料编码/物料简拼" v-model="form.wlParamInfo" />
|
||
<image src="/static/index/warehouse/procurement/x.png" mode="aspectFill"
|
||
v-if="form.wlParamInfo" @click="search(0)"></image>
|
||
</view>
|
||
<view @click="search" class="scr">
|
||
检索
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mengban" v-if="crk" @click="qingkong"></view>
|
||
<view class="crkcard guodu" :class="crk?'':'uncrkcard'">
|
||
<view class="crkcard-title">
|
||
{{ savedetail.materialName }}
|
||
</view>
|
||
<view class="crkcard-img-father">
|
||
|
||
<image class="crkcard-img"
|
||
:src="savedetail.materialImg?serverUrl + savedetail.materialImg : '/static/index/warehouse/procurement/k.png'"
|
||
mode="aspectFill"></image>
|
||
<view class="tagname">
|
||
<view class="tagname-one" v-if="savedetail.categoryName">
|
||
生活用品
|
||
</view>
|
||
<view class="tagname-one" v-if="savedetail.typeName">
|
||
照护用品
|
||
</view>
|
||
<view class="tagname-one" v-if="savedetail.medicationName">
|
||
医疗用品
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="crkcard-text" style="margin-top: 80rpx;">
|
||
物料编码: {{ savedetail.materialNo }}
|
||
</view>
|
||
<view class="crkcard-text">
|
||
规格型号: {{ savedetail.specificationModel }}
|
||
</view>
|
||
<view class="crkcard-text">
|
||
物料标签: {{ savedetail.tagName }}
|
||
</view>
|
||
<view class="crkcard-text">
|
||
物料单位: {{ savedetail.materialUnits }}
|
||
</view>
|
||
<view class="crkcard-text">
|
||
医保报销: {{ savedetail.izYbbxName }}
|
||
</view>
|
||
<view class="crkcard-text">
|
||
机构优惠: {{ savedetail.izJgyhName }}
|
||
</view>
|
||
<view class="bottom-card-father">
|
||
<view class="bottom-card">
|
||
<view class="bottom-card-font">
|
||
{{ savedetail.kcsl }}
|
||
</view>
|
||
<view class="bottom-card-gray">
|
||
库存数量
|
||
</view>
|
||
<view class="bottom-card-bian"></view>
|
||
</view>
|
||
<view class="bottom-card">
|
||
<view class="bottom-card-font">
|
||
{{ savedetail.upperLimit }}
|
||
</view>
|
||
<view class="bottom-card-gray">
|
||
物料上限
|
||
<text style="color: #0E8AFA;">
|
||
↑
|
||
</text>
|
||
</view>
|
||
<view class="bottom-card-bian"></view>
|
||
</view>
|
||
|
||
<view class="bottom-card">
|
||
<view class="bottom-card-font">
|
||
{{ savedetail.lowerLimit }}
|
||
</view>
|
||
<view class="bottom-card-gray">
|
||
物料下限
|
||
<text style="color: #FAB6BA;">
|
||
↓
|
||
</text>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 分享的弹出层 -->
|
||
<view v-show="shareShow" class="popup-share" @click="shareShow=false">
|
||
<view class="popup-share-content" :style="{ opacity: deletedownisopacity ? 1 : 0 }" @click.stop>
|
||
<view class="share-other">
|
||
<view class="share-main">
|
||
<view class="">
|
||
<view class="share-weight">
|
||
{{ plsbuy[leftitem]?.cgdNo }}
|
||
</view>
|
||
<view class="share-font">
|
||
供应商：{{ plsbuy[leftitem]?.gysId_dictText }}
|
||
</view>
|
||
<view class="share-font">
|
||
采购时间：{{ plsbuy[leftitem]?.qgDate }}
|
||
</view>
|
||
</view>
|
||
<view class="right-flex">
|
||
<view style="font-weight: 600;">
|
||
<text style="vertical-align: 4rpx;">
|
||
￥
|
||
</text>
|
||
|
||
<text class="dollar-text">
|
||
{{plsbuy[leftitem]?.totalPrice}}
|
||
</text>
|
||
</view>
|
||
<view class="caigou-font">
|
||
采购金额
|
||
</view>
|
||
|
||
</view>
|
||
|
||
</view>
|
||
<view class="share-bottom">
|
||
<view style="display: flex;align-items: center;">
|
||
<image class="share-bottom-img" src="/static/index/youngman.png"></image>
|
||
<view class="share-name">
|
||
{{ plsbuy[leftitem]?.createBy_dictText }}
|
||
</view>
|
||
<view class="share-font">
|
||
采购人
|
||
</view>
|
||
</view>
|
||
<view class="blue-button" @click="clickshare">
|
||
分享
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view :class="['neuro-wrapper', donghuacs ? 'is-active' : '']" v-show="badshow">
|
||
<view class="neuro-mask" @click="badshow=false;"></view>
|
||
<view class="neuro-box" @click.stop>
|
||
|
||
<view class="button-father">
|
||
<view class="button-white" @click="badshow=false;">取消</view>
|
||
<view class="button" @click="zuofei">确定</view>
|
||
</view>
|
||
|
||
<view class="title">作废</view>
|
||
<view class="card-font">
|
||
确定要作废这个采购单吗
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps } from 'vue';
|
||
import { queryInvoicingList, getCgdMaterialTreeData, queryNuInfoByNuId, updateKfstatus, queryCgdList, queryCgdInfoList, queryWlInfoByWlId, voidedCgdMain } from './api/lunpan.js'
|
||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||
import shadowview from './components/ShadowView.vue';
|
||
import calculator from './components/calculator.vue';
|
||
const navurl = ref('');
|
||
const InvoicingList = ref([]);
|
||
const TreeData = ref([]);
|
||
const cellobj = ref({});
|
||
|
||
const serverUrl = ref('');
|
||
const scrolltop = ref(0)
|
||
const leftscrolltop = ref(0)
|
||
const shopitem = ref(-1);
|
||
const leftitem = ref(0)
|
||
const getblue = ref(false);
|
||
const shyp = ref(false);
|
||
const opacity = ref(false);
|
||
const gysnum = ref(false);
|
||
const gys = ref(false);
|
||
const crk = ref(false);
|
||
const shareShow = ref(false);
|
||
const deletedownisopacity = ref(false);
|
||
|
||
|
||
const scrollnum = ref(0);
|
||
|
||
|
||
const scroll = reactive({ scrolltop1: 0, scrolltop2: 0, scrolltop3: 0, act1: -1, act2: -1, act3: -1 });
|
||
const form = reactive({
|
||
nuId: '',
|
||
pageNo: 1,
|
||
pageSize: 9,
|
||
categoryId: '',
|
||
typeId: '',
|
||
medicationId: '',
|
||
wlParamInfo: '',
|
||
cgdId: "",
|
||
isWaring: 0
|
||
})
|
||
const mobanform = {
|
||
nuId: '',
|
||
pageNo: 1,
|
||
pageSize: 9,
|
||
categoryId: '',
|
||
typeId: '',
|
||
medicationId: '',
|
||
wlParamInfo: '',
|
||
cgdId: "",
|
||
isWaring: 0
|
||
}
|
||
const getmiddle = (item : any, i : number) => {
|
||
let num = Math.ceil((i + 1))
|
||
leftscrolltop.value = (num - 2) * 185;
|
||
leftitem.value = i;
|
||
shopitem.value = -1
|
||
|
||
InvoicingList.value = [];
|
||
Object.assign(form, mobanform)
|
||
|
||
form.cgdId = item.id
|
||
queryInvo();
|
||
getMaterial();
|
||
// console.log("入参", form)
|
||
}
|
||
const switchshyp = () => {
|
||
let obj = {
|
||
id: cellobj.value.id,
|
||
status: shyp.value ? '5' : '2'
|
||
}
|
||
updateKfstatus(obj).then(res => {
|
||
// console.log(res)
|
||
if (res.success) {
|
||
shyp.value = shyp.value ? false : true;
|
||
cell();
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'error',
|
||
title: res.message
|
||
})
|
||
}
|
||
})
|
||
}
|
||
const detailform = reactive({
|
||
wlId: "",
|
||
nuId: uni.getStorageSync('nuId')
|
||
})
|
||
const savedetail = ref({
|
||
categoryName: '',
|
||
typeName: '',
|
||
medicationName: '',
|
||
materialNo: '',
|
||
specificationModel: '',
|
||
tagName: '',
|
||
materialUnits: '',
|
||
izYbbxName: '',
|
||
izJgyhName: '',
|
||
kcsl: '',
|
||
upperLimit: '',
|
||
lowerLimit: '',
|
||
materialName: '',
|
||
materialImg: ''
|
||
})
|
||
const getdetail = () => {
|
||
// console.log("????", detailform)
|
||
queryWlInfoByWlId(detailform).then((res : any) => {
|
||
// console.log("res", res.result)
|
||
if (res.result) {
|
||
savedetail.value = res.result;
|
||
crk.value = true;
|
||
leftitem.value = -1
|
||
}
|
||
|
||
})
|
||
|
||
}
|
||
const shopclick = (i : number) => {
|
||
let num = Math.ceil((i + 1) / 2)
|
||
scrolltop.value = (num - 2) * 167;
|
||
shopitem.value = i;
|
||
// console.log(InvoicingList.value[i].wlId, uni.getStorageSync('nuId'))
|
||
detailform.wlId = InvoicingList.value[i]?.wlId
|
||
// getdetail()
|
||
|
||
}
|
||
|
||
|
||
|
||
const typescroll = (e : number, i : number, v : object) => {
|
||
if (e == 1) {
|
||
scroll.act2 = -1;
|
||
scroll.act3 = -1;
|
||
scroll.scrolltop2 = 0;
|
||
scroll.scrolltop3 = 0;
|
||
form.categoryId = v?.categoryId;
|
||
form.typeId = '';
|
||
form.medicationId = '';
|
||
if (scroll.act1 == i) {
|
||
scroll.act1 = -1;
|
||
form.categoryId = '';
|
||
form.pageNo = 1;
|
||
InvoicingList.value = [];
|
||
queryInvo();
|
||
return
|
||
}
|
||
}
|
||
if (e == 2) {
|
||
scroll.act3 = -1;
|
||
scroll.scrolltop3 = 0;
|
||
form.categoryId = v?.categoryId;
|
||
form.typeId = v?.typeId;
|
||
form.medicationId = '';
|
||
}
|
||
if (e == 3) {
|
||
form.categoryId = v?.categoryId;
|
||
form.typeId = v?.typeId;
|
||
form.medicationId = v?.key;
|
||
}
|
||
scroll['act' + e] = i;
|
||
scroll['scrolltop' + e] = (i - 2) * 50;
|
||
form.pageNo = 1;
|
||
InvoicingList.value = [];
|
||
shopitem.value = 0;
|
||
queryInvo();
|
||
}
|
||
const search = (x : number) => {
|
||
|
||
if (x === 0) { form.wlParamInfo = '' }
|
||
form.pageNo = 1;
|
||
InvoicingList.value = [];
|
||
leftitem.value = saveleftgo.value;
|
||
shopitem.value = -1;
|
||
form.cgdId = plsbuy.value[leftitem.value].id
|
||
queryInvo();
|
||
}
|
||
onLoad(() => {
|
||
form.nuId = uni.getStorageSync('nuId');
|
||
serverUrl.value = uni.getStorageSync('serverUrl') + '/sys/common/static/';
|
||
firstgetqueryCgdList();
|
||
cell()
|
||
})
|
||
|
||
const init = () => {
|
||
InvoicingList.value = [];
|
||
plsbuy.value = []
|
||
Object.assign(form, mobanform)
|
||
Object.assign(plzinfo, mobanplzinfo)
|
||
|
||
serverUrl.value = uni.getStorageSync('serverUrl') + '/sys/common/static/';
|
||
firstgetqueryCgdList();
|
||
}
|
||
|
||
const plzinfo = reactive({
|
||
pageNo: 1,
|
||
pageSize: 10,
|
||
canpull: true
|
||
})
|
||
|
||
const mobanplzinfo = {
|
||
pageNo: 1,
|
||
pageSize: 10,
|
||
canpull: true
|
||
}
|
||
const plsbuy = ref([])
|
||
const firstgetqueryCgdList = () => {
|
||
queryCgdList(plzinfo).then((res : any) => {
|
||
// console.log("请购单", res.result.records)
|
||
plsbuy.value.push(...res.result.records)
|
||
|
||
form.cgdId = plsbuy.value[0].id
|
||
queryInvo();
|
||
getMaterial();
|
||
if (res.result.records.length < plzinfo.pageSize) {
|
||
plzinfo.canpull = false;
|
||
}
|
||
})
|
||
}
|
||
//获得采购单列表
|
||
const getqueryCgdList = () => {
|
||
if (!plzinfo.canpull) return
|
||
queryCgdList(plzinfo).then((res : any) => {
|
||
console.log("请购单", res.result.records)
|
||
plsbuy.value.push(...res.result.records)
|
||
if (res.result.records.length < plzinfo.pageSize) {
|
||
plzinfo.canpull = false;
|
||
}
|
||
})
|
||
}
|
||
const plsbuytolower = () => {
|
||
if (!setout) { return }
|
||
// status.value = 'loading'
|
||
// setout.value = false;
|
||
plzinfo.pageNo++;
|
||
getqueryCgdList()
|
||
times = setTimeout(() => {
|
||
setout.value = true
|
||
}, 1000)
|
||
}
|
||
const qingkong = () => {
|
||
gys.value = false;
|
||
anmidex.value = -1;
|
||
crk.value = false;
|
||
}
|
||
const colse = () => {
|
||
gysnum.value = !gysnum.value
|
||
}
|
||
const cell = () => {
|
||
queryNuInfoByNuId(form).then(res => {
|
||
console.log("ceshi", form, cellobj.value)
|
||
cellobj.value = res.result;
|
||
shyp.value = res.result.status == 5 ? false : true
|
||
})
|
||
}
|
||
const getMaterial = () => {
|
||
getCgdMaterialTreeData(form).then(res => {
|
||
// console.log(form)
|
||
// console.log(res)
|
||
TreeData.value = res.result;
|
||
console.log("TreeData.value", TreeData.value)
|
||
})
|
||
}
|
||
const setout = ref(true)
|
||
let times = null;
|
||
const status = ref('loadmore')
|
||
onPageScroll((e) => {
|
||
console.log(e)
|
||
})
|
||
const scrolltolower = () => {
|
||
if (!setout) { return }
|
||
status.value = 'loading'
|
||
setout.value = false;
|
||
form.pageNo++;
|
||
queryInvo()
|
||
times = setTimeout(() => {
|
||
setout.value = true
|
||
}, 1000)
|
||
}
|
||
|
||
const scrollview = (e : number) => {
|
||
if (e.detail.scrollTop > scrollnum.value) {
|
||
opacity.value = true;
|
||
setTimeout(() => {
|
||
opacity.value = false;
|
||
}, 900)
|
||
} else {
|
||
opacity.value = false;
|
||
}
|
||
scrollnum.value = e.detail.scrollTop;
|
||
}
|
||
const queryInvo = () => {
|
||
// console.log("form", form)
|
||
queryCgdInfoList(form).then(res => {
|
||
InvoicingList.value.push(...res.result.records);
|
||
detailform.wlId = InvoicingList.value[0].wlId
|
||
|
||
|
||
status.value = res.result.total == InvoicingList.value.length ? 'nomore' : 'loadmore';
|
||
|
||
})
|
||
}
|
||
const saveleftgo = ref(0);
|
||
|
||
const movecard = (type : number) => {
|
||
|
||
|
||
if (leftitem.value != -1) {
|
||
switch (type) {
|
||
case 0:
|
||
// 上
|
||
if (leftitem.value) {
|
||
leftitem.value--
|
||
getmiddle(plsbuy.value[leftitem.value], leftitem.value);
|
||
}
|
||
break;
|
||
case 1:
|
||
// →
|
||
saveleftgo.value = leftitem.value;
|
||
leftitem.value = -1;
|
||
shopitem.value = 0;
|
||
|
||
break;
|
||
case 2:
|
||
// 下
|
||
if (leftitem.value < plsbuy.value.length - 1) {
|
||
leftitem.value++
|
||
getmiddle(plsbuy.value[leftitem.value], leftitem.value)
|
||
|
||
}
|
||
|
||
break;
|
||
case 3:
|
||
|
||
// ←
|
||
break;
|
||
case 4:
|
||
// 扫描
|
||
saveleftgo.value = leftitem.value;
|
||
leftitem.value = -1;
|
||
shopitem.value = 0;
|
||
break;
|
||
case 5:
|
||
// 返回
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
break;
|
||
|
||
default:
|
||
break;
|
||
}
|
||
}
|
||
else if (shopitem.value != -1) {
|
||
switch (type) {
|
||
case 0:
|
||
// 上
|
||
shopitem.value = shopitem.value < 1 ? shopitem.value = 0 : shopitem.value - 2
|
||
break;
|
||
case 1:
|
||
// →
|
||
shopitem.value = shopitem.value >= InvoicingList.value.length - 1 ? InvoicingList.value.length - 1 : shopitem.value + 1
|
||
break;
|
||
case 2:
|
||
// 下
|
||
shopitem.value = shopitem.value >= InvoicingList.value.length - 2 ? shopitem.value = 0 : shopitem.value + 2
|
||
break;
|
||
case 3:
|
||
shopitem.value = shopitem.value == 0 ? shopitem.value = InvoicingList.value.length - 1 : shopitem.value - 1
|
||
// ←
|
||
break;
|
||
case 4:
|
||
// 扫描
|
||
getdetail()
|
||
break;
|
||
case 5:
|
||
// 返回
|
||
leftitem.value = saveleftgo.value;
|
||
getmiddle(plsbuy.value[leftitem.value], leftitem.value)
|
||
shopitem.value = -1;
|
||
break;
|
||
|
||
default:
|
||
break;
|
||
}
|
||
shopclick(shopitem.value)
|
||
}
|
||
|
||
// shopclick(shopitem.value)
|
||
|
||
|
||
}
|
||
// 通用的生成函数
|
||
function genPaths(base, prefix, count, ext = 'png', startIndex = 0, pad = false) {
|
||
return Array.from({ length: count }, (_, i) => {
|
||
const idx = pad
|
||
? String(i + startIndex).padStart(2, '0')
|
||
: i + startIndex
|
||
return `${base}/${prefix}${idx}.${ext}`
|
||
})
|
||
}
|
||
const anmidex = ref(-1)
|
||
const admiclick = (i : number) => {
|
||
anmidex.value = i;
|
||
if (plsbuy.value[leftitem.value]?.cgdType == '9') {
|
||
uni.showToast({
|
||
title: '该表单已经作废',
|
||
icon: 'none', // 'none' 表示不带图标
|
||
duration: 2000
|
||
})
|
||
return
|
||
}
|
||
switch (i) {
|
||
case 0:
|
||
bebad();
|
||
break;
|
||
case 1:
|
||
// gys.value = true
|
||
shareToWeixin()
|
||
break;
|
||
case 2:
|
||
break;
|
||
case 3:
|
||
break;
|
||
case 4:
|
||
// crk.value = true
|
||
break;
|
||
case 5:
|
||
break;
|
||
|
||
default:
|
||
break;
|
||
}
|
||
|
||
}
|
||
const badshow = ref(false);
|
||
const donghuacs = ref(false);
|
||
const bebad = () => {
|
||
if (leftitem.value == -1) {
|
||
uni.showToast({
|
||
title: '请选择想要作废的采购单',
|
||
icon: 'none', // 'none' 表示不带图标
|
||
duration: 2000
|
||
})
|
||
return
|
||
} else {
|
||
badshow.value = true;
|
||
donghuacs.value = false;
|
||
setTimeout(() => donghuacs.value = true, 50)
|
||
}
|
||
}
|
||
const zuofei = () => {
|
||
voidedCgdMain({ id: plsbuy.value[leftitem.value].id }).then((res : any) => {
|
||
console.log("res", res)
|
||
if (res.success) {
|
||
uni.showToast({
|
||
title: res.message,
|
||
icon: 'success', // 'none' 表示不带图标
|
||
duration: 2000
|
||
})
|
||
badshow.value = false;
|
||
init()
|
||
}
|
||
})
|
||
}
|
||
const shareToWeixin = () => {
|
||
if (leftitem.value == -1) {
|
||
uni.showToast({
|
||
title: '请选择想要分享的采购单',
|
||
icon: 'none', // 'none' 表示不带图标
|
||
duration: 2000
|
||
})
|
||
return
|
||
} else {
|
||
shareShow.value = true;
|
||
deletedownisopacity.value = false;
|
||
setTimeout(() => {
|
||
deletedownisopacity.value = true
|
||
}, 100)
|
||
}
|
||
|
||
|
||
}
|
||
const clickshare = () => {
|
||
uni.share({
|
||
provider: "weixin",
|
||
scene: "WXSceneSession",
|
||
type: 0,
|
||
href: "https://www.baidu.com/",
|
||
title: "护理日程分享",
|
||
summary: "九泰护理日程测试",
|
||
imageUrl: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png",
|
||
success: function (res) {
|
||
console.log("success:");
|
||
},
|
||
fail: function (err) {
|
||
console.log("fail:");
|
||
}
|
||
});
|
||
}
|
||
const animArray = ref([
|
||
{
|
||
url: genPaths(
|
||
'/static/index/warehouse/procurement/cancel',
|
||
'cancel',
|
||
9, // 张数
|
||
'png',
|
||
1, // 起始索引为 1
|
||
false // 不补零
|
||
),
|
||
name: '作废',
|
||
},
|
||
{
|
||
url: genPaths(
|
||
'/static/index/warehouse/procurement/share',
|
||
'share',
|
||
6, // 张数
|
||
'png',
|
||
1, // 起始索引为 1
|
||
false // 不补零
|
||
),
|
||
name: '分享',
|
||
},
|
||
|
||
|
||
])
|
||
</script>
|
||
|
||
<style lang="less">
|
||
// 出入库
|
||
.uncrkcard {
|
||
bottom: -100vw !important;
|
||
}
|
||
|
||
.crkcard {
|
||
width: 27vw;
|
||
height: 50vw;
|
||
background: rgba(255, 255, 255, 1);
|
||
box-shadow: 0rpx 0rpx 1vw 0rpx rgba(171, 171, 172, 0.29);
|
||
border-radius: 1.6vw;
|
||
position: fixed;
|
||
right: 1.2vw;
|
||
bottom: 11.5vw;
|
||
z-index: 102;
|
||
padding: 0 50rpx;
|
||
padding-top: 100rpx;
|
||
|
||
.crkscroll {
|
||
width: 100%;
|
||
height: 29vw;
|
||
|
||
.cgrk {
|
||
width: 35vw;
|
||
height: 8.5vw;
|
||
background: rgba(236, 237, 239, 0.4);
|
||
border-radius: 1.6vw;
|
||
margin: 0.8vw auto 0;
|
||
padding: 1.8vw 2vw;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
>view {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
&:nth-child(1) {
|
||
text {
|
||
|
||
&:nth-child(2),
|
||
&:nth-child(3) {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #888888;
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.2vw;
|
||
color: #333333;
|
||
}
|
||
}
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
.c {
|
||
color: #FF6600 !important;
|
||
}
|
||
|
||
.l {
|
||
color: #0076D6 !important;
|
||
}
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #888888;
|
||
text-align: right;
|
||
|
||
&:nth-child(2) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #333333;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.select {
|
||
width: 100%;
|
||
height: 7vw;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
padding: 1vw 1.5vw;
|
||
|
||
>view {
|
||
display: flex;
|
||
|
||
&:nth-child(2) {
|
||
justify-content: space-between;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
}
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
justify-content: flex-end;
|
||
|
||
view {
|
||
min-width: 5vw;
|
||
height: 2.6vw;
|
||
border-radius: 1.3vw;
|
||
border: 1px solid #DCDCDC;
|
||
padding: 0 1.4vw;
|
||
align-items: center;
|
||
display: flex;
|
||
align-items: center;
|
||
margin: 0 0.5vw;
|
||
|
||
image {
|
||
width: 0.7vw;
|
||
height: 0.5vw;
|
||
margin-left: 0.4vw;
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.shopcont {
|
||
width: 100%;
|
||
height: 10vw;
|
||
background: rgba(236, 237, 239, 0.3);
|
||
border-bottom: 1px solid #DCDCDC;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.cont {
|
||
width: 26vw;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
position: relative;
|
||
padding: 2vw 0;
|
||
|
||
view {
|
||
&:nth-child(4) {
|
||
width: 5vw;
|
||
height: 5vw;
|
||
background: rgba(236, 237, 239, 1);
|
||
border-radius: 1.4vw;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
position: absolute;
|
||
color: #888888;
|
||
top: 2.5vw;
|
||
right: 1.8vw;
|
||
padding: 0.5vw 0;
|
||
|
||
text {
|
||
font-weight: bold;
|
||
font-size: 1.8vw;
|
||
color: #555555;
|
||
}
|
||
}
|
||
|
||
&:nth-child(2),
|
||
&:nth-child(3) {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #888888;
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #212327;
|
||
}
|
||
}
|
||
}
|
||
|
||
.img {
|
||
width: 10vw;
|
||
height: 9vw;
|
||
}
|
||
}
|
||
}
|
||
|
||
//
|
||
.shuru {
|
||
width: 20.6vw;
|
||
height: 34.5vw;
|
||
position: fixed;
|
||
bottom: 1.5vw;
|
||
right: 1.6vw;
|
||
z-index: 103;
|
||
}
|
||
|
||
// 采购
|
||
.unrigbot {
|
||
right: -25vw !important;
|
||
}
|
||
|
||
.rigbot {
|
||
width: 24.5vw;
|
||
height: 13vw;
|
||
background: #FFFFFF;
|
||
border-radius: 1.6vw;
|
||
position: fixed;
|
||
bottom: 1.5vw;
|
||
right: 1.6vw;
|
||
z-index: 102;
|
||
padding: 1.1vw;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
view {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
&:nth-child(3) {
|
||
align-items: center;
|
||
white-space: nowrap;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
white-space: nowrap;
|
||
margin-right: 1.2vw;
|
||
}
|
||
|
||
.jj {
|
||
width: 3.5vw;
|
||
height: 3.5vw;
|
||
background: rgba(85, 85, 85, .1);
|
||
border-radius: 1.0vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 0 0 0 1vw;
|
||
position: relative;
|
||
padding: 0 !important;
|
||
|
||
&:active {
|
||
content: '';
|
||
width: 3.5vw;
|
||
height: 3.5vw;
|
||
background: linear-gradient(-61deg, #EAF5FF, #CBE7FF) !important;
|
||
}
|
||
}
|
||
|
||
.num {
|
||
width: 6.5vw;
|
||
height: 3.5vw;
|
||
border-radius: 1.0vw;
|
||
background: rgba(85, 85, 85, .1);
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 0 0 0 1vw;
|
||
}
|
||
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
width: 21.6vw;
|
||
height: 3.0vw;
|
||
background: rgba(85, 85, 85, 0.1);
|
||
border-radius: 1.0vw;
|
||
padding-left: 1.5vw;
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
justify-content: space-between;
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
|
||
text {
|
||
width: 5.2vw;
|
||
height: 2.2vw;
|
||
display: inline-block;
|
||
text-align: center;
|
||
line-height: 2.2vw;
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
color: #5C7992;
|
||
background: linear-gradient(-61deg, #EAF5FF, #CBE7FF) !important;
|
||
border-radius: 1.1vw;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.uncg {
|
||
left: -47vw !important;
|
||
}
|
||
|
||
.cgou {
|
||
width: 47vw;
|
||
height: 26vw;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 0rpx .5vw 0rpx #E8E9ED;
|
||
border-radius: 1.6vw;
|
||
position: fixed;
|
||
left: 2vw;
|
||
top: 16vw;
|
||
z-index: 101;
|
||
padding: 2vw 0 0;
|
||
|
||
.tj {
|
||
width: 100%;
|
||
height: 3.5vw;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
align-items: center;
|
||
padding-right: 2vw;
|
||
}
|
||
|
||
.gyscont {
|
||
width: 100%;
|
||
height: 5.7vw;
|
||
background: #EFF0F4;
|
||
padding: 2vw;
|
||
display: flex;
|
||
border-top: 1px solid #E8E9ED;
|
||
border-bottom: 1px solid #E8E9ED;
|
||
|
||
view {
|
||
width: 50%;
|
||
|
||
&:nth-child(2) {
|
||
display: flex;
|
||
align-items: center;
|
||
white-space: nowrap;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.jj {
|
||
width: 3.5vw;
|
||
height: 3.5vw;
|
||
background: rgba(85, 85, 85, .1);
|
||
border-radius: 1.0vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin: 0 1vw;
|
||
position: relative;
|
||
|
||
&:active {
|
||
content: '';
|
||
width: 3.5vw;
|
||
height: 3.5vw;
|
||
background: linear-gradient(-61deg, #EAF5FF, #CBE7FF) !important;
|
||
}
|
||
}
|
||
|
||
.num {
|
||
width: 6.5vw;
|
||
height: 3.5vw;
|
||
border-radius: 1.0vw;
|
||
background: rgba(85, 85, 85, .1);
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
margin-left: 1vw;
|
||
|
||
&:nth-child(1) {
|
||
color: rgba(85, 85, 85, 1);
|
||
margin-top: -0.4vw;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
margin-top: 0.4vw;
|
||
color: #555555;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.topcont {
|
||
width: 100%;
|
||
height: 14.6vw;
|
||
padding: 0 2vw;
|
||
|
||
.life {
|
||
width: 100%;
|
||
height: 4.4vw;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
|
||
>view {
|
||
width: 50%;
|
||
height: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
&:nth-child(2) {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
|
||
view {
|
||
min-width: 4vw;
|
||
height: 80%;
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #8F92A1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-left: 2.1vw;
|
||
margin-top: -0.2vw;
|
||
padding-right: 2.1vw;
|
||
|
||
.l {
|
||
color: rgba(3, 133, 250, 1);
|
||
}
|
||
|
||
.f {
|
||
color: rgba(250, 178, 182, 1);
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
border-right: 1px solid rgba(239, 240, 244, 1);
|
||
}
|
||
|
||
>text {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #555555;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #8F92A1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
&:nth-child(1) {
|
||
display: flex;
|
||
justify-content: flex-start;
|
||
|
||
view {
|
||
|
||
&:nth-child(1),
|
||
&:nth-child(2) {
|
||
width: 5.3vw;
|
||
height: 1.8vw;
|
||
border-radius: .9vw;
|
||
border: 1px solid #D2D2D2;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #555555;
|
||
margin-left: .6vw;
|
||
}
|
||
|
||
&:nth-child(3) {
|
||
width: 4vw;
|
||
height: 80%;
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #8F92A1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-left: 2.1vw;
|
||
margin-top: -0.2vw;
|
||
|
||
>text {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #555555;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #8F92A1;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.top {
|
||
width: 100%;
|
||
height: 10.2vw;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.leftimg {
|
||
width: 7vw;
|
||
height: 6vw;
|
||
}
|
||
|
||
.rightcont {
|
||
width: 29vw;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
>view {
|
||
width: 100%;
|
||
|
||
&:nth-child(1) {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: .5vw;
|
||
|
||
text {
|
||
width: 25vw;
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #212327;
|
||
display: inline-block;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
&:nth-child(2),
|
||
&:nth-child(3),
|
||
&:nth-child(4) {
|
||
display: flex;
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
color: #777777;
|
||
align-items: center;
|
||
white-space: nowrap;
|
||
|
||
>view {
|
||
width: 16vw;
|
||
margin-top: .8vw;
|
||
}
|
||
|
||
text {
|
||
display: inline-block;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.mengban {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 100;
|
||
background: RGBA(239, 240, 244, 0.55);
|
||
}
|
||
|
||
.tp {
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
.box {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 0vw 1vw 0;
|
||
overflow: hidden;
|
||
|
||
.rights {
|
||
width: 24.5vw;
|
||
height: calc(100% - 4vw);
|
||
margin-top: 4vw;
|
||
|
||
.serchs {
|
||
width: 24.5vw;
|
||
height: 3.2vw;
|
||
background: rgba(255, 255, 255, .5);
|
||
border-radius: 1.6vw;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 0.5vw;
|
||
align-items: center;
|
||
margin-top: 1.1vw;
|
||
|
||
.ipt {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
image {
|
||
width: 2.2vw;
|
||
height: 2.2vw;
|
||
margin-left: 0.5vw;
|
||
}
|
||
|
||
input {
|
||
width: 18vw;
|
||
height: 2.4vw;
|
||
font-size: 1.1vw;
|
||
padding-left: 1.6vw;
|
||
}
|
||
}
|
||
|
||
.scr {
|
||
width: 4.2vw;
|
||
height: 2.4vw;
|
||
background: url('/static/index/warehouse/procurement/sh.png')no-repeat;
|
||
background-size: 100% 100%;
|
||
border-radius: 1.2vw;
|
||
border: 1px solid rgba(0, 155, 252, 1);
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
color: #1083F8;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
}
|
||
|
||
.anmikc {
|
||
width: 100%;
|
||
height: 5vw;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
// flex-wrap: wrap;
|
||
|
||
>view {
|
||
width: 49%;
|
||
height: 3.7vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-weight: 400;
|
||
font-size: 1.3vw;
|
||
color: #212327;
|
||
background: #FFFFFF;
|
||
margin: 0.25vw 0;
|
||
// margin-right: 1vw;
|
||
border-radius: 1.6vw;
|
||
|
||
view {
|
||
margin-right: .4vw;
|
||
|
||
image {
|
||
width: 2vw;
|
||
height: 2vw;
|
||
}
|
||
|
||
.donghua {
|
||
margin: 0;
|
||
}
|
||
}
|
||
|
||
text {
|
||
white-space: nowrap;
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.typeitem {
|
||
width: 100%;
|
||
height: 54vh;
|
||
|
||
.scroltype {
|
||
width: 100%;
|
||
height: calc(58vh);
|
||
display: flex;
|
||
justify-content: space-around;
|
||
|
||
.scroll-Y {
|
||
width: 8.5vw;
|
||
height: calc(58vh);
|
||
|
||
view {
|
||
width: 100%;
|
||
height: 3.8vw;
|
||
background: rgba(255, 255, 255, .5);
|
||
border-radius: 1.9vw;
|
||
font-weight: 400;
|
||
font-size: 1.3vw;
|
||
color: #212327;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 0 0.4vw;
|
||
margin-bottom: .8vw;
|
||
text-align: center;
|
||
|
||
text {
|
||
white-space: nowrap;
|
||
}
|
||
|
||
>image {
|
||
width: 2vw;
|
||
height: 2vw;
|
||
}
|
||
}
|
||
|
||
.act {
|
||
background: rgba(255, 255, 255, 1) !important;
|
||
font-weight: 600;
|
||
color: #0385FA !important;
|
||
}
|
||
}
|
||
}
|
||
|
||
>.toptype {
|
||
width: 100%;
|
||
height: 2vw;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
margin: .4vw 0 .4vw 0;
|
||
|
||
.act {
|
||
background: rgba(255, 255, 255, 1) !important;
|
||
font-weight: 600;
|
||
color: #0385FA !important;
|
||
}
|
||
|
||
>view {
|
||
width: 7vw;
|
||
height: 1.9vw;
|
||
border-radius: 1vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
background: rgba(255, 255, 255, .5);
|
||
border: 1px solid rgba(255, 255, 255, .5);
|
||
font-weight: 400;
|
||
font-size: 1.2vw;
|
||
color: #333333;
|
||
padding: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
.shitem {
|
||
width: 24.5vw;
|
||
height: 10.3vw;
|
||
background: #E8E9ED;
|
||
border-radius: 1.6vw;
|
||
padding: 1.2vw 1.8vw;
|
||
|
||
.jqry {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.left {
|
||
width: 5vw;
|
||
height: 5vw;
|
||
margin-right: .8vw;
|
||
border-radius: .3vw;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.rigname {
|
||
height: 4vw;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-around;
|
||
|
||
view {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #212327;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
width: 11vw;
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
color: #212327;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.shypk {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 10rpx;
|
||
|
||
view {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 30rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
|
||
text {
|
||
font-weight: 400;
|
||
font-size: 1vw;
|
||
color: #666666;
|
||
}
|
||
|
||
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.lefts {
|
||
width: 46vw;
|
||
height: calc(100vh - 8vh);
|
||
position: relative;
|
||
background: #FFFFFF;
|
||
box-shadow: 0rpx 2px 3px 0rpx rgba(182, 186, 196, 0.24);
|
||
border-radius: 1.6vw;
|
||
margin-top: 6vh;
|
||
|
||
.caigoudan {
|
||
width: 46vw;
|
||
height: 92vh;
|
||
background: #FFFFFF;
|
||
border-radius: 1.6vw;
|
||
padding: 0.5vw 1.5vw 0;
|
||
|
||
.cgdscroll {
|
||
width: 100%;
|
||
height: calc(92vh - 10vw);
|
||
}
|
||
|
||
.fler {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
}
|
||
|
||
.boxitem {
|
||
width: 22vw;
|
||
height: 10vw;
|
||
background: rgba(192, 192, 192, 0.14);
|
||
border-radius: 1.6vw;
|
||
margin: 0 1vw 1.2vw 0;
|
||
border: 2px dashed #fff;
|
||
display: inline-block;
|
||
padding: 1vw 1.6vw 0;
|
||
position: relative;
|
||
|
||
>view {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.4vw;
|
||
color: #333;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
width: 100%;
|
||
text-overflow: ellipsis;
|
||
max-width: 15vw;
|
||
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #555555;
|
||
margin-top: .6vw;
|
||
}
|
||
|
||
&:nth-child(3),
|
||
&:nth-child(4) {
|
||
font-weight: 400;
|
||
font-size: 1.1vw;
|
||
color: #666666;
|
||
margin-top: .2vw;
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
.cgdh {
|
||
width: 100%;
|
||
height: 2.5vw;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
color: #333333;
|
||
|
||
view {
|
||
font-size: 1.1vw;
|
||
}
|
||
|
||
text {
|
||
font-size: 1.2vw;
|
||
font-weight: bold;
|
||
}
|
||
}
|
||
|
||
|
||
.title {
|
||
height: 4vw;
|
||
font-weight: 400;
|
||
font-size: 1.4vw;
|
||
color: #333333;
|
||
border-bottom: 1px solid #DCDCDC;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
view {
|
||
width: 0.5vw;
|
||
height: 1.4vw;
|
||
background: linear-gradient(-69deg, #006DC9, #0385FA);
|
||
border-radius: 0.25vw;
|
||
margin-right: 0.7vw;
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
|
||
}
|
||
|
||
}
|
||
|
||
|
||
.active {
|
||
border: 2px dashed #017DE9 !important;
|
||
}
|
||
|
||
.act {
|
||
background: linear-gradient(-69deg, #E1EFFC, #CAE0F9, #D2E9FF) !important;
|
||
border: 1px solid rgba(0, 130, 251, 0.34) !important;
|
||
padding-left: 1.3vw;
|
||
|
||
view {
|
||
background: #0385FA;
|
||
position: absolute;
|
||
}
|
||
}
|
||
|
||
.guodu {
|
||
transition: .4s;
|
||
-webkit-transform-style: preserve-3d;
|
||
-webkit-overflow-scrolling: touch;
|
||
}
|
||
|
||
|
||
.rel-left {
|
||
width: 26vw;
|
||
height: 100%;
|
||
position: relative;
|
||
margin-top: 6vh;
|
||
margin-right: -1.2vw;
|
||
|
||
.zuofei {
|
||
background-color: #FFE2E2;
|
||
color: #FF5757;
|
||
border: 1rpx solid #FF5757;
|
||
position: absolute;
|
||
top: 30rpx;
|
||
right: 30rpx;
|
||
width: 120rpx;
|
||
height: 50rpx;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
|
||
// margin-left: 1vw;
|
||
.fxj {
|
||
width: 23vw;
|
||
height: 22vw;
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 2vw;
|
||
z-index: 11;
|
||
border-radius: 1.6vw;
|
||
|
||
text {
|
||
width: 100%;
|
||
font-weight: 400;
|
||
font-size: .9vw;
|
||
color: #999999;
|
||
display: flex;
|
||
justify-content: center;
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 0vw;
|
||
}
|
||
}
|
||
|
||
.mblbg {
|
||
width: 24.5vw;
|
||
height: 25vh;
|
||
position: absolute;
|
||
left: -1vw;
|
||
bottom: 0.5vw;
|
||
border-radius: 1.6vw;
|
||
filter: blur(15rpx);
|
||
background: RGBA(239, 240, 244, 1);
|
||
z-index: 10;
|
||
}
|
||
|
||
.scroll-Y {
|
||
width: 100%;
|
||
height: 75vh;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.yujing {
|
||
color: black;
|
||
box-shadow: 0 0 8px rgba(255, 102, 107, 0.51);
|
||
}
|
||
|
||
.boxitem {
|
||
width: 24vw;
|
||
height: 14.7vw;
|
||
background: rgba(255, 255, 255, .7);
|
||
border-radius: 1.6vw;
|
||
margin: 0 0vw 1.2vw 0.6vw;
|
||
border: 2px dashed #fff;
|
||
display: inline-block;
|
||
padding: 1.5vw;
|
||
position: relative;
|
||
|
||
>view {
|
||
&:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 1.5vw;
|
||
color: #333;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
width: 100%;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
&:nth-child(2) {
|
||
font-weight: 400;
|
||
font-size: 1.2vw;
|
||
color: #555555;
|
||
margin-top: .6vw;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
width: 100%;
|
||
height: 1.5vw;
|
||
}
|
||
|
||
&:nth-child(3) {
|
||
font-weight: 400;
|
||
font-size: 1.2vw;
|
||
color: #666666;
|
||
margin-top: .6vw;
|
||
}
|
||
|
||
&:nth-child(4) {
|
||
font-weight: 400;
|
||
font-size: 1.2vw;
|
||
color: #666666;
|
||
margin-top: .6vw;
|
||
}
|
||
|
||
&:nth-child(5) {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-top: 1.5vw;
|
||
|
||
view {
|
||
color: #888888;
|
||
}
|
||
|
||
text {
|
||
font-weight: bold;
|
||
font-size: 1.8vw;
|
||
color: #555;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
.mar-left {
|
||
margin-left: 100vw;
|
||
}
|
||
|
||
.crkcard-title {
|
||
font-weight: bold;
|
||
font-size: 35rpx;
|
||
width: 100%;
|
||
text-align: center;
|
||
}
|
||
|
||
.crkcard-img-father {
|
||
width: 100%;
|
||
display: flex;
|
||
// justify-content: center;
|
||
align-items: center;
|
||
flex-direction: column;
|
||
margin-top: 20rpx;
|
||
|
||
.crkcard-img {
|
||
width: 300rpx;
|
||
height: 300rpx;
|
||
}
|
||
|
||
.tagname {
|
||
display: flex;
|
||
|
||
.tagname-one {
|
||
width: 150rpx;
|
||
height: 50rpx;
|
||
margin: 0 20rpx;
|
||
border: 1rpx solid #D2D2D2;
|
||
border-radius: 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #555555;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.crkcard-text {
|
||
color: #777777;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.bottom-card-father {
|
||
position: absolute;
|
||
width: 100%;
|
||
height: 200rpx;
|
||
bottom: 0;
|
||
left: 0;
|
||
display: flex;
|
||
|
||
.bottom-card {
|
||
width: 33.3%;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: relative;
|
||
|
||
.bottom-card-bian {
|
||
position: absolute;
|
||
height: 100rpx;
|
||
width: 1rpx;
|
||
background-color: #EFF0F4;
|
||
bottom: 50rpx;
|
||
right: 0;
|
||
}
|
||
|
||
.bottom-card-font {
|
||
font-weight: bold;
|
||
font-size: 35rpx;
|
||
}
|
||
|
||
.bottom-card-gray {
|
||
margin-top: 5rpx;
|
||
color: #8F92A1;
|
||
}
|
||
}
|
||
}
|
||
|
||
.blue-tags {
|
||
display: flex;
|
||
height: 3%;
|
||
margin-top: 12%;
|
||
margin-bottom: 5%;
|
||
align-items: center;
|
||
// padding: 0 0 20rpx 15rpx;
|
||
|
||
.blue-shu {
|
||
background: linear-gradient(to top, #007BFD, #019AF0);
|
||
width: 15rpx;
|
||
height: 40rpx;
|
||
border-radius: 15rpx;
|
||
margin: 0 15rpx 0 20rpx;
|
||
}
|
||
}
|
||
|
||
.blue-tags-middle {
|
||
display: flex;
|
||
height: 3%;
|
||
margin-top: 6%;
|
||
margin-bottom: 2.5%;
|
||
align-items: center;
|
||
// padding: 0 0 20rpx 15rpx;
|
||
|
||
.blue-shu {
|
||
background: linear-gradient(to top, #007BFD, #019AF0);
|
||
width: 15rpx;
|
||
height: 40rpx;
|
||
border-radius: 15rpx;
|
||
margin: 0 15rpx 0 20rpx;
|
||
}
|
||
}
|
||
|
||
.special-view {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.popup-share {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
backdrop-filter: blur(1rpx);
|
||
background-color: rgba(236, 237, 241, 0.4);
|
||
/* 添加毛玻璃效果 */
|
||
z-index: 999;
|
||
|
||
|
||
.share-other {
|
||
z-index: 1;
|
||
width: 100%;
|
||
height: 100%;
|
||
padding: 50rpx;
|
||
position: relative;
|
||
|
||
.share-main {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.share-weight {
|
||
font-weight: 600;
|
||
font-size: 30rpx;
|
||
}
|
||
|
||
.share-font {
|
||
color: #666666;
|
||
font-size: 30rpx;
|
||
margin-top: 20rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.popup-share-content {
|
||
position: absolute;
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 1000rpx;
|
||
height: 500rpx;
|
||
background-color: #fff;
|
||
border-radius: 30rpx;
|
||
transition: opacity 0.4s ease;
|
||
|
||
.popup-share-title {
|
||
margin: 30rpx 30rpx;
|
||
font-size: 40rpx;
|
||
position: relative;
|
||
|
||
.popup-share-img {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
}
|
||
}
|
||
|
||
.popup-share-upcontent {
|
||
margin: 0 30rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.popup-share-font {
|
||
font-size: 35rpx;
|
||
color: gray;
|
||
}
|
||
|
||
}
|
||
|
||
.popup-share-gray {
|
||
background-color: #D3D3D3;
|
||
width: calc(100% - 60rpx);
|
||
height: 2rpx;
|
||
margin: 110rpx 30rpx 0 30rpx;
|
||
}
|
||
|
||
.popup-share-downcontent {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
height: 100%;
|
||
margin: 0 30rpx;
|
||
|
||
.popup-downcontent-img {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
}
|
||
|
||
.popup-downcontent-font {
|
||
font-size: 27rpx;
|
||
margin-left: 20rpx;
|
||
}
|
||
|
||
.popup-share-downcontent-left {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.popup-share-downcontent-button {
|
||
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
|
||
color: #fff;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 15rpx 30rpx;
|
||
border-radius: 20rpx;
|
||
font-size: 32rpx;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
}
|
||
|
||
.blue-button {
|
||
margin-top: 60rpx;
|
||
width: 150rpx;
|
||
height: 70rpx;
|
||
border-radius: 40rpx;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: #007CFF;
|
||
font-size: 30rpx;
|
||
background: linear-gradient(to bottom, #e7f4ff, #c5e5ff);
|
||
border: 2rpx solid #9AD1FF;
|
||
}
|
||
|
||
/* 容器默认隐藏，透明度为 0，不接受点击 */
|
||
.neuro-wrapper {
|
||
position: fixed;
|
||
inset: 0;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
z-index: 999;
|
||
opacity: 0;
|
||
pointer-events: none;
|
||
transition: opacity 0.3s ease;
|
||
}
|
||
|
||
/* 显示时透明度过渡到 1，可接受点击 */
|
||
.neuro-wrapper.is-active {
|
||
opacity: 1;
|
||
pointer-events: auto;
|
||
}
|
||
|
||
/* 遮罩层，半透明黑色 */
|
||
.neuro-mask {
|
||
position: absolute;
|
||
inset: 0;
|
||
background-color: rgba(0, 0, 0, 0.3);
|
||
}
|
||
|
||
/* 拟态框 固定尺寸 + 阴影样式 + 相对定位于 wrapper */
|
||
.neuro-box {
|
||
position: relative;
|
||
width: 600rpx;
|
||
height: 450rpx;
|
||
border-radius: 30rpx;
|
||
background-color: #fff;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
z-index: 1;
|
||
padding: 0 10%;
|
||
}
|
||
|
||
.button {
|
||
width: 47%;
|
||
background-color: #ddf0ff;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
// color: #fff;
|
||
color: #007CFF;
|
||
border: 1rpx solid #007CFF;
|
||
font-size: 25rpx;
|
||
border-radius: 30rpx;
|
||
}
|
||
|
||
|
||
.card-font {
|
||
margin-top: 70rpx;
|
||
width: 600rpx;
|
||
justify-content: center;
|
||
display: flex;
|
||
}
|
||
|
||
.button-white {
|
||
width: 47%;
|
||
border: 2rpx solid #c3cacd;
|
||
background: linear-gradient(to bottom, #f3f3f5, #dee4e9);
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 25rpx;
|
||
border-radius: 30rpx;
|
||
}
|
||
|
||
.button-father {
|
||
position: absolute;
|
||
bottom: 60rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
width: 100%;
|
||
height: 70rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 0 50rpx;
|
||
}
|
||
|
||
.margin-height {
|
||
height: 10rpx;
|
||
}
|
||
|
||
|
||
.right-flex {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
|
||
.dollar-text {
|
||
font-size: 2.2vw;
|
||
}
|
||
|
||
.caigou-font {
|
||
color: #999999;
|
||
margin-top: -5rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
|
||
}
|
||
|
||
.share-bottom {
|
||
position: absolute;
|
||
width: 100%;
|
||
padding: 0 50rpx;
|
||
height: 120rpx;
|
||
bottom: 70rpx;
|
||
left: 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.share-bottom-img {
|
||
width: 150rpx;
|
||
height: 140rpx;
|
||
}
|
||
|
||
.share-name {
|
||
margin: 0 20rpx;
|
||
font-size: 35rpx;
|
||
color: #555555;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.share-font {
|
||
color: #555555;
|
||
margin-top: 10rpx;
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
</style>
|
||
<style>
|
||
page {
|
||
background: RGBA(239, 240, 244, 1);
|
||
}
|
||
</style> |