|
@@ -0,0 +1,785 @@
|
|
|
+<template>
|
|
|
+ <view class="content flex flex_column">
|
|
|
+ <view class="searchBar">
|
|
|
+ <view class="p-title flex align_center">
|
|
|
+ <text></text>
|
|
|
+ <view class="shelfName">
|
|
|
+ <view>{{nowData.shelfName}}</view>
|
|
|
+ </view>
|
|
|
+ <view v-if="placeTab.length" class="btns" @click="showTab = true">筛选<u-icon size="20" name="arrow-down"></u-icon></view>
|
|
|
+ </view>
|
|
|
+ <view class="search flex align_center">
|
|
|
+ <view class="input">
|
|
|
+ <u-search
|
|
|
+ v-model="queryWord"
|
|
|
+ @custom="getpartList"
|
|
|
+ @search="getpartList"
|
|
|
+ @clear="clearSearch"
|
|
|
+ @input="$u.debounce(changeSearch, 800)"
|
|
|
+ bg-color="#fff"
|
|
|
+ :show-action="false"
|
|
|
+ placeholder="请输入产品编码或名称搜索"></u-search>
|
|
|
+ </view>
|
|
|
+ <view class="icon" @click="toScan">
|
|
|
+ <u-icon name="scan"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="check-list">
|
|
|
+ <productList ref="productList" noDataText="暂无产品" @allChecked="allCheckedCallback"></productList>
|
|
|
+ </view>
|
|
|
+ <!-- 底部栏 -->
|
|
|
+ <view class="footer-bar flex align_center">
|
|
|
+ <view class="f-left">
|
|
|
+ <u-checkbox size="40" @change="allCheckeChange" v-model="allChecked" shape="circle">{{allChecked?'取消全选':'全选'}}</u-checkbox>
|
|
|
+ </view>
|
|
|
+ <view class="f-mid flex align_center" @click="openCart">
|
|
|
+ <view>
|
|
|
+ 已选<text>{{orderTotal}}</text>款/<text>{{orderTotal}}</text>件
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ 查看明细
|
|
|
+ <u-icon name="arrow-up"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="f-btns">
|
|
|
+ <u-button size="medium" @click="submitOrder" :custom-style="customBtnStyle" shape="circle" type="primary" hover-class="none" >创建补货单</u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 已选配件 购物车 -->
|
|
|
+ <div class="cpb_cart-mask" v-if="showCart">
|
|
|
+ <div class="cpb_cart-box">
|
|
|
+ <div class="cpb_close flex align-center justify_center" @click="showCart=false">
|
|
|
+ <u-icon name="close"></u-icon>
|
|
|
+ </div>
|
|
|
+ <div class="cpb_cart-tit">
|
|
|
+ <view>已选配件</view>
|
|
|
+ <view class="cpb_heji flex align_center justify_between">
|
|
|
+ <text @click="clearDetail">清空列表</text>
|
|
|
+ <view v-if="detail">
|
|
|
+ 盈亏总数量:
|
|
|
+ <text>
|
|
|
+ {{detail.totalProfitLossQty}}
|
|
|
+ </text>
|
|
|
+ 盈亏总金额:
|
|
|
+ <text>
|
|
|
+ ¥{{detail.totalProfitLossCost}}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </div>
|
|
|
+ <div class="cpb_cart-list">
|
|
|
+ <u-swipe-action
|
|
|
+ :show="item.show"
|
|
|
+ :btn-width="120"
|
|
|
+ :index="index"
|
|
|
+ @click="delDetail"
|
|
|
+ v-for="(item, index) in chooseList"
|
|
|
+ :key="item.id"
|
|
|
+ :options="options"
|
|
|
+ >
|
|
|
+ <view class="nav-right-item flex">
|
|
|
+ <view class="uni-col-2">
|
|
|
+ <u-image :src="item.product&&item.product.images?item.product.images:`../../static/${$config('themePath')}/def_img@2x.png`" width="100" height="100" border-radius="30"></u-image>
|
|
|
+ </view>
|
|
|
+ <view class="item-info uni-col-10">
|
|
|
+ <view class="item-name">
|
|
|
+ <text>{{item.shelfPlaceCode}}</text>
|
|
|
+ {{item.product.productName}}
|
|
|
+ </view>
|
|
|
+ <view class="item-detail">
|
|
|
+ <view class="item-detail-info align_center flex justify_between">
|
|
|
+ <view>
|
|
|
+ {{item.productCode}}
|
|
|
+ </view>
|
|
|
+ <view class="flex justify_end">
|
|
|
+ <text class="item-detail-text">
|
|
|
+ 可用:{{item.stockQty?item.stockQty:0}} {{item.product&&item.product.unit}}
|
|
|
+ </text>
|
|
|
+ <text class="item-detail-text">
|
|
|
+ 冻结:{{item.freezeQty?item.freezeQty:0}} {{item.product&&item.product.unit}}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="item-detail">
|
|
|
+ <view class="item-detail-info">
|
|
|
+ <view class="flex justify_between">
|
|
|
+ <view></view>
|
|
|
+ <view class="item-detail-text">
|
|
|
+ 实际可用:
|
|
|
+ <u-number-box
|
|
|
+ v-model="item.checkQty"
|
|
|
+ @minus="cartChangeNums"
|
|
|
+ @plus="cartChangeNums"
|
|
|
+ @blur="cartChangeNums"
|
|
|
+ :index="'cart_'+item.id"
|
|
|
+ :max="999999"></u-number-box>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-swipe-action>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 筛选项 -->
|
|
|
+ <u-popup v-model="showTab" mode="right" width="70%">
|
|
|
+ <view class="tabBox flex flex_column">
|
|
|
+ <view class="tabs">
|
|
|
+ <view>
|
|
|
+ <view :class="'available'==curType?'active':''" @click="curType=curType=='available'?'':'available'">有可用库存的产品</view>
|
|
|
+ <view :class="'blocked'==curType?'active':''" @click="curType=curType=='blocked'?'':'blocked'">有冻结库存的产品</view>
|
|
|
+ </view>
|
|
|
+ <view class="flex">
|
|
|
+ <view :class="item==curTab?'active':''" v-for="item in placeTab" :key="item" @click="curTab=curTab==item?'':item">{{item}}层</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btns">
|
|
|
+ <u-button class="handle-btn" shape="circle" size="medium" hover-class="none" @click="handleClear">重置</u-button>
|
|
|
+ <u-button class="handle-btn" shape="circle" size="medium" hover-class="none" :custom-style="customBtnStyle" @click="clearSearch">查询</u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { getShelfProductList,getProductPlace } from '@/api/shelf'
|
|
|
+ import productList from './productList.vue'
|
|
|
+ import {
|
|
|
+ stockCheckDetailQueryList,
|
|
|
+ stockCheckDetailDelete,
|
|
|
+ stockCheckSave,
|
|
|
+ stockCheckBySn,
|
|
|
+ stockCheckDetailSave,
|
|
|
+ deleteByStockCheckSn
|
|
|
+ } from '@/api/stockCheck'
|
|
|
+ import { clzConfirm } from '@/libs/tools'
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ productList
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ queryWord: '',
|
|
|
+ nowData:null,
|
|
|
+ stockCheckSn: null,
|
|
|
+ detail:null,
|
|
|
+ pageNo:1,
|
|
|
+ pageSize: 20,
|
|
|
+ total: 0, // 列表总数
|
|
|
+ noDataText: '暂无产品',
|
|
|
+ status: 'loading',
|
|
|
+ partList: [],
|
|
|
+ allChecked: false,
|
|
|
+ showTab: false,
|
|
|
+ placeTab: [],
|
|
|
+ curTab: '',
|
|
|
+ curType: '',
|
|
|
+ customBtnStyle: { // 自定义按钮样式
|
|
|
+ borderColor: this.$config('primaryColor'),
|
|
|
+ backgroundColor: this.$config('primaryColor'),
|
|
|
+ color: '#fff'
|
|
|
+ },
|
|
|
+ orderTotal: 0,
|
|
|
+ showCart: false,
|
|
|
+ chooseList: [],
|
|
|
+ tempData: null,
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ text: '删除',
|
|
|
+ style: {
|
|
|
+ backgroundColor: '#dd524d'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onNavigationBarButtonTap(e) {
|
|
|
+ if(e.index == 0){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/stockCheck/checkRecord?shelfSn='+this.nowData.shelfSn
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onBackPress(e) {
|
|
|
+ if(this.showTab||this.showCart) {
|
|
|
+ this.showTab = false;
|
|
|
+ this.showCart = false;
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opts) {
|
|
|
+ this.nowData = JSON.parse(decodeURIComponent(opts.data));
|
|
|
+ this.stockCheckSn = this.nowData.stockCheckSn
|
|
|
+ this.getpartList()
|
|
|
+ this.getShelfPlace()
|
|
|
+
|
|
|
+ if(this.stockCheckSn){
|
|
|
+ // 获取盘点单明细
|
|
|
+ this.getDetail()
|
|
|
+ // 获取盘点明细列表
|
|
|
+ this.getChooseList()
|
|
|
+ }
|
|
|
+
|
|
|
+ // 重置盘点单
|
|
|
+ uni.$on("resetStockCheck",()=>{
|
|
|
+ this.resetStockCheck()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ uni.$off("resetStockCheck")
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 全选
|
|
|
+ allCheckeChange(e){
|
|
|
+ this.$refs.productList.allSelect(e.value)
|
|
|
+ },
|
|
|
+ allCheckedCallback(val){
|
|
|
+ this.allChecked = val
|
|
|
+ },
|
|
|
+ // 重置盘点单
|
|
|
+ resetStockCheck(){
|
|
|
+ this.chooseList = []
|
|
|
+ this.orderTotal = 0
|
|
|
+ this.stockCheckSn = null
|
|
|
+ this.detail = null
|
|
|
+ this.tempData = null
|
|
|
+ this.queryWord = ''
|
|
|
+ this.showCart = false
|
|
|
+ this.handleClear()
|
|
|
+ },
|
|
|
+ // 获取盘点明细列表
|
|
|
+ getChooseList(){
|
|
|
+ stockCheckDetailQueryList({
|
|
|
+ stockCheckSn: this.stockCheckSn
|
|
|
+ }).then(res => {
|
|
|
+ this.chooseList = res.data || []
|
|
|
+ this.orderTotal = this.chooseList.length
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 详细
|
|
|
+ getDetail(){
|
|
|
+ stockCheckBySn({stockCheckSn: this.stockCheckSn}).then(res => {
|
|
|
+ this.detail = res.data || null
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //添加产品
|
|
|
+ toEdit(item){
|
|
|
+
|
|
|
+ },
|
|
|
+ // 创建补货单
|
|
|
+ creatOrder(data){
|
|
|
+ uni.showLoading({
|
|
|
+ title:"正在保存.."
|
|
|
+ })
|
|
|
+ stockCheckSave({
|
|
|
+ shelfSn: this.nowData.shelfSn,
|
|
|
+ totalCategory: this.nowData.totalCategory,
|
|
|
+ totalStockQty: this.nowData.totalStockQty,
|
|
|
+ totalFreezeQty: this.nowData.totalFreezeQty
|
|
|
+ }).then(res => {
|
|
|
+ if(res.status == 200){
|
|
|
+ this.detail = res.data || null
|
|
|
+ this.stockCheckSn = res.data.stockCheckSn
|
|
|
+ }else{
|
|
|
+ uni.hideLoading()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 打开购物车
|
|
|
+ openCart(){
|
|
|
+ if(this.orderTotal){
|
|
|
+ this.showCart = !this.showCart
|
|
|
+ }else{
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请先添加产品'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 清空购物车
|
|
|
+ clearDetail(){
|
|
|
+ const _this = this
|
|
|
+ clzConfirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认要清空列表吗?',
|
|
|
+ success (ret) {
|
|
|
+ if (ret.confirm || ret.index == 0) {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 修改数量
|
|
|
+ cartChangeNums(v){
|
|
|
+ console.log(v,this.showCart)
|
|
|
+ const data = this.chooseList.find(item => item.id == v.index.split('_')[1])
|
|
|
+ },
|
|
|
+ // 删除盘点详细
|
|
|
+ delDetail(a,b){
|
|
|
+ if(b==0){
|
|
|
+ const data = this.chooseList[a]
|
|
|
+ stockCheckDetailDelete({stockCheckDetailSn: data.stockCheckDetailSn}).then(res=>{
|
|
|
+ if(res.status == 200){
|
|
|
+ this.chooseList.splice(a,1)
|
|
|
+ this.orderTotal = this.chooseList.length
|
|
|
+ // 删除最后一个后刷新列表
|
|
|
+ if(this.orderTotal == 0){
|
|
|
+ this.showCart = false
|
|
|
+ this.getChooseList()
|
|
|
+ }
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取货位号
|
|
|
+ getShelfPlace(flag){
|
|
|
+ getProductPlace({ shelfSn: this.nowData.shelfSn }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ for(let a in res.data){
|
|
|
+ this.placeTab.push(a)
|
|
|
+ }
|
|
|
+ // 排序
|
|
|
+ this.placeTab.sort(function(a,b){ return (a+'').localeCompare(b+'');});
|
|
|
+ if(!flag){
|
|
|
+ this.curTab = ''
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.placeTab = []
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleClear(){
|
|
|
+ this.curTab = ''
|
|
|
+ this.curType = ''
|
|
|
+ this.clearSearch()
|
|
|
+ },
|
|
|
+ clearSearch(){
|
|
|
+ this.queryWord = ''
|
|
|
+ this.changeSearch()
|
|
|
+ },
|
|
|
+ changeSearch(){
|
|
|
+ this.pageNo = 1
|
|
|
+ this.partList = []
|
|
|
+ this.getpartList()
|
|
|
+ },
|
|
|
+ // 获取数字货架列表
|
|
|
+ getpartList(){
|
|
|
+ const _this = this
|
|
|
+ let params = {
|
|
|
+ pageNo: this.pageNo,
|
|
|
+ pageSize: this.pageSize,
|
|
|
+ shelfSn: this.nowData.shelfSn,
|
|
|
+ queryWord: this.queryWord,
|
|
|
+ shelfPlaceCodeHead: this.curTab,
|
|
|
+ currQtyFlag: this.curType=='available' ? 1 : '',
|
|
|
+ freezeQtyFlag: this.curType=='blocked' ? 1 : '',
|
|
|
+ }
|
|
|
+ _this.status = 'loading'
|
|
|
+ getShelfProductList(params).then(res => {
|
|
|
+ uni.hideLoading()
|
|
|
+ if(res.status == 200){
|
|
|
+ let list = res.data.list
|
|
|
+ console.log(list)
|
|
|
+ if (list && list.length){
|
|
|
+ // 分页 拼接数据
|
|
|
+ if (_this.pageNo != 1) {
|
|
|
+ _this.partList = _this.partList ? _this.partList.concat(list) : list
|
|
|
+ } else {
|
|
|
+ _this.partList = list
|
|
|
+ }
|
|
|
+ this.total = res.data.count
|
|
|
+ if (_this.partList.length == res.data.count) {
|
|
|
+ _this.status = 'nomore'
|
|
|
+ } else {
|
|
|
+ _this.status = 'loadmore'
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ _this.partList = list || []
|
|
|
+ this.total = 0
|
|
|
+ _this.status = 'nomore'
|
|
|
+ }
|
|
|
+ _this.noDataText = '暂无匹配产品'
|
|
|
+ }else{
|
|
|
+ _this.status = 'loadmore'
|
|
|
+ _this.partList = []
|
|
|
+ _this.total = 0
|
|
|
+ _this.noDataText = res.message ? res.message : '网络似乎出错了,请稍后再试'
|
|
|
+ }
|
|
|
+ this.showTab = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 加载更多
|
|
|
+ onreachBottom () {
|
|
|
+ if(this.partList.length < this.total ){
|
|
|
+ this.pageNo++
|
|
|
+ this.getpartList()
|
|
|
+ }else{
|
|
|
+ this.status = "nomore"
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 提交盘点单
|
|
|
+ submitOrder(){
|
|
|
+ if(this.chooseList.length){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/stockCheck/submitStockCheck?stockCheckSn='+this.stockCheckSn+'&type=submit'
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ uni.showToast({
|
|
|
+ icon: 'none',
|
|
|
+ title: '请先添加产品'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 扫描
|
|
|
+ toScan(){
|
|
|
+ this.mpaasScanModule = uni.requireNativePlugin("wss-scan")
|
|
|
+ this.mpaasScanModule.scan(
|
|
|
+ {
|
|
|
+ "scanMode":"Customized",
|
|
|
+ "scanStyle":{
|
|
|
+ "scanFrameSizePlus":{"width":250,"height":250},
|
|
|
+ "scanFrameSize":200,
|
|
|
+ "scanLight":"visible",
|
|
|
+ "scanText":"对准条形码/二维码进行识别",
|
|
|
+ "scanTitle":"扫码搜索货位产品",
|
|
|
+ }
|
|
|
+ },
|
|
|
+ (result) => {
|
|
|
+ if(result.scanStatus == 1){
|
|
|
+ this.scanResult(result)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 扫描结果
|
|
|
+ scanResult(data){
|
|
|
+ const params = {
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize:1,
|
|
|
+ shelfSn: this.nowData.shelfSn
|
|
|
+ }
|
|
|
+ // 二维码
|
|
|
+ if(data.scanType == 'QRCODE'){
|
|
|
+ const ret = data.scanValue.split("&")
|
|
|
+ params.queryWord = ret[1] // 产品编码
|
|
|
+ }else{
|
|
|
+ params.qrCode = data.scanValue
|
|
|
+ }
|
|
|
+ getShelfProductList(params).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if(res.status == 200){
|
|
|
+ if(res.data&&res.data.list.length){
|
|
|
+ this.toEdit(res.data.list[0])
|
|
|
+ }else{
|
|
|
+ uni.showToast({
|
|
|
+ icon: "none",
|
|
|
+ title: "产品不属于此货架,请重新扫描",
|
|
|
+ duration: 5000
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+.content{
|
|
|
+ height: 100vh;
|
|
|
+ width: 100%;
|
|
|
+ background: #fff;
|
|
|
+ .searchBar{
|
|
|
+ padding: 0 0.8rem 0.3rem;
|
|
|
+ .p-title{
|
|
|
+ padding: 0 15rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #222;
|
|
|
+ font-size: 30rpx;
|
|
|
+ > text{
|
|
|
+ display: block;
|
|
|
+ height: 30rpx;
|
|
|
+ width: 6rpx;
|
|
|
+ background: #0485F6;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ }
|
|
|
+ .shelfName{
|
|
|
+ flex-grow: 1;
|
|
|
+ font-weight: bold;
|
|
|
+ width: 80%;
|
|
|
+ > view{
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btns{
|
|
|
+ width:100rpx;
|
|
|
+ text-align: right;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #0485F6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .search{
|
|
|
+ margin-top: 15upx;
|
|
|
+ padding: 0.1rem;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ border:1rpx solid #eee;
|
|
|
+ .input{
|
|
|
+ flex-grow: 1;
|
|
|
+ padding: 4rpx;
|
|
|
+ }
|
|
|
+ .icon{
|
|
|
+ width: 13%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 46rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .check-list{
|
|
|
+ padding: 0 0.5rem;
|
|
|
+ flex-grow: 1;
|
|
|
+ .scroll-view{
|
|
|
+ height: calc(100vh - 260rpx);
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .partList-list-box{
|
|
|
+ padding: 20rpx 30rpx;
|
|
|
+ border-bottom: 2rpx solid #f5f5f5;
|
|
|
+ &:last-child{
|
|
|
+ border:0;
|
|
|
+ }
|
|
|
+ .product{
|
|
|
+ flex-grow: 1;
|
|
|
+ &:active{
|
|
|
+ opacity: 0.6;
|
|
|
+ background-color: #f8f8f8;
|
|
|
+ }
|
|
|
+ .pimgs{
|
|
|
+ position: relative;
|
|
|
+ border:2rpx solid #eee;
|
|
|
+ border-radius: 15rpx;
|
|
|
+ padding: 5rpx;
|
|
|
+ > text{
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ bottom:0;
|
|
|
+ z-index: 500;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ background: rgba(255, 0, 0, 0.6);
|
|
|
+ color: #fff;
|
|
|
+ font-size: 20upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-detail{
|
|
|
+ margin-top: 10rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #9DA8B5;
|
|
|
+ font-size: 26upx;
|
|
|
+ .item-detail-text{
|
|
|
+ font-size: 26upx;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .pinfo{
|
|
|
+ flex-grow: 1;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ .pname{
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #191919;
|
|
|
+ text{
|
|
|
+ font-weight: normal;
|
|
|
+ margin-right: 6rpx;
|
|
|
+ padding: 0 10rpx;
|
|
|
+ background: rgba(3, 54, 146, 0.15);
|
|
|
+ border-radius: 100rpx;
|
|
|
+ color: #033692;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ptxt{
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-top: 10upx;
|
|
|
+ .pnums{
|
|
|
+ color: #222;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .footer-bar{
|
|
|
+ background-color: #f8f8f8;
|
|
|
+ padding: 20upx;
|
|
|
+ .f-left{
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .active{
|
|
|
+ background-color: #0485F6;
|
|
|
+ }
|
|
|
+ .f-mid{
|
|
|
+ flex-grow: 1;
|
|
|
+ font-size: 0.8rem;
|
|
|
+ color: #666;
|
|
|
+ > view{
|
|
|
+ padding: 0 10upx;
|
|
|
+ &:first-child{
|
|
|
+ text{
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .f-btns{
|
|
|
+ button{
|
|
|
+ width: 200upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 筛选
|
|
|
+ .tabBox{
|
|
|
+ height: 100vh;
|
|
|
+ .tabs{
|
|
|
+ flex-grow: 1;
|
|
|
+ overflow: auto;
|
|
|
+ padding: 20rpx;
|
|
|
+ > view{
|
|
|
+ flex-wrap: wrap;
|
|
|
+ justify-content: space-between;
|
|
|
+ > view{
|
|
|
+ width: 45%;
|
|
|
+ border: 1rpx solid #eee;
|
|
|
+ padding: 15rpx;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 15rpx;
|
|
|
+ }
|
|
|
+ .active{
|
|
|
+ border:0;
|
|
|
+ background-color: #0485F6;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ &:first-child{
|
|
|
+ > view{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btns{
|
|
|
+ display: flex;
|
|
|
+ padding: 20upx;
|
|
|
+ justify-content: space-between;
|
|
|
+ .handle-btn {
|
|
|
+ font-size: 28upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 购物车
|
|
|
+ .cpb_cart-mask{
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ background: rgba(0,0,0,0.5);
|
|
|
+ z-index: 900;
|
|
|
+ bottom: 100rpx;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ .cpb_cart-box{
|
|
|
+ background-color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 1000;
|
|
|
+ bottom: 0;
|
|
|
+ border-radius: 30rpx 30rpx 0 0;
|
|
|
+ max-height: 70vh;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .cpb_close{
|
|
|
+ position: absolute;
|
|
|
+ top: 10rpx;
|
|
|
+ right: 20rpx;
|
|
|
+ width: 70rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ .cpb_cart-tit{
|
|
|
+ text-align: center;
|
|
|
+ padding: 20rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
+ border-bottom: 2rpx solid #eee;
|
|
|
+ .cpb_heji{
|
|
|
+ padding-top: 20rpx;
|
|
|
+ font-size: 26upx;
|
|
|
+ > text{
|
|
|
+ color: #00aaff;
|
|
|
+ }
|
|
|
+ > view{
|
|
|
+ color: #999;
|
|
|
+ > text{
|
|
|
+ color: #333;
|
|
|
+ &:first-child{
|
|
|
+ margin-right: 20upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cpb_cart-list{
|
|
|
+ padding: 20rpx 0;
|
|
|
+ overflow: auto;
|
|
|
+ flex-grow: 1;
|
|
|
+ > view{
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .nav-right-item{
|
|
|
+ padding: 0 30upx;
|
|
|
+ }
|
|
|
+ .item-name{
|
|
|
+ font-size: 30rpx;
|
|
|
+ text{
|
|
|
+ background: rgba(3, 54, 146, 0.15);
|
|
|
+ color: #1c588a;
|
|
|
+ border-radius: 1em;
|
|
|
+ font-size: 0.8em;
|
|
|
+ padding: 0 0.5em;
|
|
|
+ margin-right: 10upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-info{
|
|
|
+ border-bottom:2rpx solid #eee;
|
|
|
+ flex-grow: 1;
|
|
|
+ padding-left: 0.2em;
|
|
|
+ }
|
|
|
+ .item-detail{
|
|
|
+ .item-detail-info{
|
|
|
+ padding: 10upx 0 4upx;
|
|
|
+ font-size: 24upx;
|
|
|
+ > view{
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ align-items: center;
|
|
|
+ .item-detail-text{
|
|
|
+ color: #999;
|
|
|
+ margin-left: 20upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|