|
@@ -21,39 +21,45 @@
|
|
|
</uni-swiper-dot>
|
|
|
</view>
|
|
|
<view class="product-wrap clearfix">
|
|
|
- <view class="wrap-top">
|
|
|
- <view class="p-title tui-skeleton-rect">
|
|
|
+ <view class="wrap-top" :class="goodsData.disabled ? 'none' : ''">
|
|
|
+ <view class="p-title tui-skeleton-fillet">
|
|
|
{{product.name == undefined ? '' : product.name}}
|
|
|
</view>
|
|
|
- <view v-if="!hasLogin" class="p-login tui-skeleton-rect">
|
|
|
- <text @click.stop="navToLogin">登录查看价格<text class="iconfont icon-xiayibu" style="font-size: 22rpx;margin: 0 6rpx;"></text></text>
|
|
|
- </view>
|
|
|
- <view class="wrap-main" v-else>
|
|
|
- <view class="p-main" v-if="ladderPriceFlag == '0'">
|
|
|
- <view class="p-price tui-skeleton-fillet">
|
|
|
- <text class="txt sm">¥</text>
|
|
|
- <text class="txt big">{{retailPrice}}</text>
|
|
|
- <text class="txt big">{{smallMoney== '0'?'.00':smallMoney}}</text>
|
|
|
- </view>
|
|
|
- <view class="p-minBuy">
|
|
|
- 起订量:
|
|
|
- <text class="min-text">{{minBuyNumber}}</text>
|
|
|
- </view>
|
|
|
+ <view class="wrap-top-price" v-if="!goodsData.disabled">
|
|
|
+ <view v-if="!hasLogin" class="p-login grade tui-skeleton-fillet">
|
|
|
+ <text class="p-no">价格:</text>
|
|
|
+ <uni-stars :stars="parseInt(product.price1Grade)" :font-size='36' :width-info="180"></uni-stars>
|
|
|
+ </view>
|
|
|
+ <view v-if="!hasLogin" class="p-login tui-skeleton-fillet">
|
|
|
+ <text @click.stop="navToLogin">登录查看价格<text class="iconfont icon-xiayibu" style="font-size: 22rpx;margin: 0 6rpx;"></text></text>
|
|
|
</view>
|
|
|
- <view class="wrap-ladder" v-else>
|
|
|
- <view class="ladder-text">
|
|
|
- <text class="ladder-h1">说明:</text>
|
|
|
- <text class="ladder-p">本商品有以下优惠购物方案</text>
|
|
|
+ <view class="wrap-main" v-else>
|
|
|
+ <view class="p-main" v-if="ladderPriceFlag == '0'">
|
|
|
+ <view class="p-price tui-skeleton-fillet">
|
|
|
+ <text class="txt sm">¥</text>
|
|
|
+ <text class="txt big">{{retailPrice}}</text>
|
|
|
+ <text class="txt big">{{smallMoney== '0'?'.00':smallMoney}}</text>
|
|
|
+ </view>
|
|
|
+ <view class="p-minBuy">
|
|
|
+ 起订量:
|
|
|
+ <text class="min-text">{{minBuyNumber}}</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="ladder-main tui-skeleton-rect">
|
|
|
- <view class="ladder-left">
|
|
|
- <view class="ladder-b">起订量:</view>
|
|
|
- <view class="ladder-b">价格:</view>
|
|
|
+ <view class="wrap-ladder" v-else>
|
|
|
+ <view class="ladder-text">
|
|
|
+ <text class="ladder-h1">说明:</text>
|
|
|
+ <text class="ladder-p">本商品有以下优惠购物方案</text>
|
|
|
</view>
|
|
|
- <view class="ladder-right">
|
|
|
- <view class="ladder-li" v-for="(ladder,index) in productLadderPrices" :key="index">
|
|
|
- <view class="ladder-a">{{ladder.buyNumRangeShow}}</view>
|
|
|
- <view class="ladder-a">¥{{ladder.buyPrice.toFixed(2)}}</view>
|
|
|
+ <view class="ladder-main tui-skeleton-fillet">
|
|
|
+ <view class="ladder-left">
|
|
|
+ <view class="ladder-b">起订量:</view>
|
|
|
+ <view class="ladder-b">价格:</view>
|
|
|
+ </view>
|
|
|
+ <view class="ladder-right">
|
|
|
+ <view class="ladder-li" v-for="(ladder,index) in ladderPriceList" :key="index">
|
|
|
+ <view class="ladder-a">{{ladder.buyNumRangeShow}}</view>
|
|
|
+ <view class="ladder-a">¥{{ladder.buyPrice.toFixed(2)}}</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -61,19 +67,18 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="wrap-label" v-if="product.tagsList.length>0">
|
|
|
- <view class="label-a tui-skeleton-rect" v-for="(label,index) in product.tagsList" :key="index">{{label}}</view>
|
|
|
+ <view class="label-a tui-skeleton-fillet" v-for="(label,index) in product.tagsList" :key="index">{{label}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="wrap-label" v-if="goodsData.disabled">
|
|
|
+ <view class="isLower">此商品已{{disabledText}},请浏览以下推荐商品~</view>
|
|
|
</view>
|
|
|
<view class="wrap-info">
|
|
|
- <view class="info-viewT">
|
|
|
+ <view class="info-viewT" :class="goodsData.disabled ? 'none' : ''">
|
|
|
<view class="info-viewL tui-skeleton-fillet">品牌:<text>{{product.brandName == null? '其他' : product.brandName}}</text></view>
|
|
|
<view class="info-viewR tui-skeleton-fillet">包装规格:<text>{{product.unit}}</text></view>
|
|
|
</view>
|
|
|
-<!-- <view class="info-viewB">
|
|
|
- <view class="info-f tui-skeleton-fillet">库存:<text>{{product.stock}}</text></view>
|
|
|
- <view class="info-f tui-skeleton-fillet">起订量:<text>{{minBuyNumber}}</text></view>
|
|
|
- </view> -->
|
|
|
</view>
|
|
|
- <view class="wrap-seve">
|
|
|
+ <view class="wrap-seve" :class="goodsData.disabled ? 'none' : ''">
|
|
|
<text class="tui-skeleton-rect">服务:</text>
|
|
|
<text class="iconfont icon-dui tui-skeleton-rect"><text class="text">无忧退货</text></text>
|
|
|
<text class="iconfont icon-dui tui-skeleton-rect"><text class="text">快速退款</text></text>
|
|
@@ -83,31 +88,36 @@
|
|
|
</view>
|
|
|
<view class="product-details">
|
|
|
<!-- 头部 -->
|
|
|
- <view class="navbar tui-skeleton-fillet">
|
|
|
- <view class="nav-item"
|
|
|
- :class="{ current: tabCurrentIndex === 1 }"
|
|
|
- @click="tabClick(1)">
|
|
|
- <text class="line"></text>
|
|
|
- 商品详情
|
|
|
+ <view v-if="goodsData.disabled" class="navbar" :class="navbarFiexd"
|
|
|
+ :style="{top:headerBtnPosi.bottom + (headerBtnPosi.bottom - headerBtnPosi.height - systeminfo.statusBarHeight) +'px'}">
|
|
|
+ <view class="nav-item tui-skeleton-fillet" v-for="(item,index) in disabledTabNavList" :key="index" :class="{ current: tabCurrentIndex === index+2 }" @click="tabClick(index+2)">
|
|
|
+ <text class="line"></text>
|
|
|
+ <text>{{item.name}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-else class="navbar" :class="navbarFiexd"
|
|
|
+ :style="{top:headerBtnPosi.bottom + (headerBtnPosi.bottom - headerBtnPosi.height - systeminfo.statusBarHeight) +'px'}">
|
|
|
+ <view class="nav-item tui-skeleton-fillet" v-for="(item,index) in tabNavList" :key="index" :class="{ current: tabCurrentIndex === index }" @click="tabClick(index)">
|
|
|
+ <text class="line"></text>
|
|
|
+ <text>{{item.name}}</text>
|
|
|
</view>
|
|
|
- <view class="nav-item"
|
|
|
- :class="{ current: tabCurrentIndex === 2 }"
|
|
|
- @click="tabClick(2)">
|
|
|
- <text class="line"></text>
|
|
|
- 供应商信息
|
|
|
- </view>
|
|
|
</view>
|
|
|
- <!-- 商品详情,供应商详情展示 -->
|
|
|
- <view class="content tui-banner tui-skeleton-rect" v-if="tabCurrentIndex === 1">
|
|
|
+ <!-- 商品详情,供应商详情展示,相关推荐,评价-->
|
|
|
+ <view class="content tui-banner tui-skeleton-rect" v-if="tabCurrentIndex === 0">
|
|
|
<parser :html="html" :img-mode="widthFix"></parser>
|
|
|
</view>
|
|
|
- <view class="content sup" v-else>
|
|
|
+ <view class="content sup" v-if="tabCurrentIndex === 1">
|
|
|
<supplier-details :shop="shop"></supplier-details>
|
|
|
</view>
|
|
|
+ <view class="content hot" v-if="tabCurrentIndex === 2">
|
|
|
+ <recommend :query-productid="product.productID" v-if="isRecommend"></recommend>
|
|
|
+ </view>
|
|
|
+ <view class="content hot" v-if="tabCurrentIndex === 3">
|
|
|
+ <evaluate :query-productid ="product.productID" v-if="isEvaluate"></evaluate>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 底部按钮 -->
|
|
|
<view class="menu">
|
|
|
- <view class="isLower" v-if="goodsData.disabled">该商品已下架~</view>
|
|
|
<view class="bottom-btn" :style="{paddingBottom :isIphoneX ? '68rpx' : '0rpx'}">
|
|
|
<view class="bottom-le">
|
|
|
<view class="item-bt" @click="this.$api.switchTabTo('/pages/tabBar/home/home')">
|
|
@@ -173,21 +183,24 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="btn"><view class="button" @click="btnConfirm">确定</view></view>
|
|
|
+ <view class="btn"><view class="button" @click.stop="btnConfirm">确定</view></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <no-login v-if="isShowNoLogin" :productid="productID" :telPhone='telPhone' :alertType ='alertType'></no-login>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import { mapState,mapMutations } from 'vuex'
|
|
|
import headerBack from '@/components/module/headerNavbar/header-poduct' //自定义导航
|
|
|
+ import uniStars from '@/components/uni-stars/uni-stars.vue'
|
|
|
import parser from "@/components/jyf-Parser/index" //富文本处理
|
|
|
import tuiSkeleton from "@/components/tui-skeleton/tui-skeleton"
|
|
|
import supplierDetails from "@/components/module/productDetails/supplierDetails" //供应商详情
|
|
|
+ import recommend from "@/components/module/productDetails/recommend" //供应商详情
|
|
|
+ import evaluate from "@/components/module/productDetails/evaluate" //供应商详情
|
|
|
import { queryProductDetils } from "@/api/product.js"
|
|
|
- import { mapState,mapMutations } from 'vuex'
|
|
|
+ import { shoppingAddCart } from "@/api/cart.js"
|
|
|
|
|
|
var isPreviewImg;
|
|
|
export default{
|
|
@@ -195,26 +208,32 @@
|
|
|
headerBack,
|
|
|
parser,
|
|
|
tuiSkeleton,
|
|
|
- supplierDetails
|
|
|
+ supplierDetails,
|
|
|
+ recommend,
|
|
|
+ evaluate
|
|
|
},
|
|
|
data(){
|
|
|
return{
|
|
|
- html:'<div style="text-align: center;color:#333333;">暂无内容</div>',
|
|
|
+ html:'<div style="text-align: center;color:#333333;">暂无内容</div>',
|
|
|
+ tabNavList:[{name:'商品详情'},{name:'供应商细信息'},{name:'相关推荐'},{name:'评价'}],
|
|
|
+ disabledTabNavList:[{name:'相关推荐'},{name:'评价'}],
|
|
|
mode:'round',
|
|
|
specClass: '',//规格弹窗css类,控制开关动画
|
|
|
isBtnType:'',
|
|
|
current:0,
|
|
|
telPhone:'',
|
|
|
+ navbarFiexd:'none',
|
|
|
ladderPriceFlag:'',
|
|
|
- productLadderPrices:'',
|
|
|
- loginStatus:true,
|
|
|
+ ladderPriceList:'',
|
|
|
+ isRecommend:false,
|
|
|
+ isEvaluate:false,
|
|
|
isAnimation:false,
|
|
|
skeletonShow:true,
|
|
|
- isShowNoLogin:false,
|
|
|
isQuantity:false,
|
|
|
isStock:false,
|
|
|
disabled:false,
|
|
|
- tabCurrentIndex: 1,
|
|
|
+ disabledText:'',
|
|
|
+ tabCurrentIndex:0,
|
|
|
userID:'',
|
|
|
productID:0,
|
|
|
classifyID:'',//分类ID
|
|
@@ -227,7 +246,6 @@
|
|
|
stock:0,
|
|
|
number:0,
|
|
|
minBuyNumber:0,
|
|
|
- alertType:'',
|
|
|
productsList:[],
|
|
|
goodListData:[],
|
|
|
headerBtnPosi: this.setHeaderBtnPosi(), //获取设备顶部胶囊高度
|
|
@@ -244,12 +262,10 @@
|
|
|
},
|
|
|
onLoad(option) {
|
|
|
let self = this;
|
|
|
- console.log(option)
|
|
|
this.productID = option.id;//获取商品ID
|
|
|
if(option.page == 2){
|
|
|
this.backPage = option.page
|
|
|
}
|
|
|
- this.tabCurrentIndex = 1;// 页面显示是默认选中第一个
|
|
|
},
|
|
|
computed: {
|
|
|
...mapState(['hasLogin','userInfo'])
|
|
@@ -257,36 +273,46 @@
|
|
|
methods:{
|
|
|
initData(){// 初始化商品详情查询
|
|
|
queryProductDetils({productID:this.productID}).then(response =>{
|
|
|
- console.log(this.skeletonShow)
|
|
|
- this.productData = response.data;
|
|
|
+ this.skeletonShow = false
|
|
|
this.productImage=[];
|
|
|
- this.shop = response.data.shop;
|
|
|
- this.product = response.data.product;
|
|
|
- this.ladderPriceFlag = response.data.ladderPriceFlag;
|
|
|
- if(response.data.productLadderPrices!=null){
|
|
|
- this.productLadderPrices = response.data.productLadderPrices;
|
|
|
- }
|
|
|
- this.html = response.data.productDetailInfo == null ? this.html : this.$api.adaptRichTextImg(response.data.productDetailInfo.detailInfo)
|
|
|
- response.data.productImage.forEach(item =>{
|
|
|
+ this.shop = response.data.shop
|
|
|
+ this.product = response.data
|
|
|
+ this.ladderPriceFlag = this.product.ladderPriceFlag;
|
|
|
+ this.html = this.product.productDetail == null ? this.html : this.$api.adaptRichTextImg(this.product.productDetail.detailInfo)
|
|
|
+ this.stock = this.product.stock
|
|
|
+ this.number = this.product.minBuyNumber
|
|
|
+ this.minBuyNumber = this.product.minBuyNumber
|
|
|
+ this.classifyID = this.product.classifyID
|
|
|
+ //处理商品图片列表
|
|
|
+ this.product.imageList.forEach(item =>{
|
|
|
this.productImage.push(item.image);
|
|
|
})
|
|
|
- console.log(this.skeletonShow)
|
|
|
+ this.goodsData.cartCount = this.product.productCount
|
|
|
+ //处理阶梯价格
|
|
|
+ if(this.product.ladderPriceList!=null){
|
|
|
+ this.ladderPriceList = this.product.ladderPriceList;
|
|
|
+ }
|
|
|
//拆分金额并转千分位格式显示
|
|
|
- this.retailPrice = this.productData.retailPrice.toFixed(2);
|
|
|
- this.buyRetailPrice = this.productData.retailPrice;
|
|
|
- if(this.productData.validFlag =='2'){
|
|
|
+ this.retailPrice = this.product.retailPrice.toFixed(2);
|
|
|
+ this.buyRetailPrice = this.product.retailPrice;
|
|
|
+ //处理下架商品和售罄商品
|
|
|
+ if(this.product.validFlag =='3' || this.stock == 0){
|
|
|
this.disabled = true
|
|
|
+ this.tabCurrentIndex = 2;// 页面显示是默认选中第一
|
|
|
+ this.isRecommend = true
|
|
|
+ this.disabledText = '下架'
|
|
|
}else{
|
|
|
this.disabled = false
|
|
|
+ this.tabCurrentIndex = 0;// 页面显示是默认选中第三
|
|
|
+ this.disabledText = ''
|
|
|
+ }
|
|
|
+ this.goodsData.disabled = this.disabled
|
|
|
+ if(this.product.validFlag =='3'){
|
|
|
+ this.disabledText = '下架'
|
|
|
+ }
|
|
|
+ if(this.stock == 0){
|
|
|
+ this.disabledText = '售罄'
|
|
|
}
|
|
|
- this.stock = this.productData.product.stock
|
|
|
- this.number = this.productData.minBuyNumber
|
|
|
- this.minBuyNumber = this.productData.minBuyNumber
|
|
|
- this.classifyID = this.productData.classifyID
|
|
|
- this.goodsData.disabled = this.disabled
|
|
|
- this.goodsData.cartCount = this.productData.cartCount
|
|
|
- this.skeletonShow = false
|
|
|
- console.log(this.skeletonShow)
|
|
|
}).catch(response =>{
|
|
|
this.$util.msg(response.msg,2000);
|
|
|
})
|
|
@@ -306,6 +332,13 @@
|
|
|
},
|
|
|
tabClick(index) {//商品详情&&供应商信息tab切换
|
|
|
this.tabCurrentIndex = index;
|
|
|
+ if(this.tabCurrentIndex == 2){
|
|
|
+ console.log(this.product.productID)
|
|
|
+ this.isRecommend = true
|
|
|
+ }
|
|
|
+ if(this.tabCurrentIndex == 3){
|
|
|
+ this.isEvaluate = true
|
|
|
+ }
|
|
|
},
|
|
|
changeTab(e) {
|
|
|
this.tabCurrentIndex = e.target.current;
|
|
@@ -315,31 +348,23 @@
|
|
|
console.log(e.detail.query)
|
|
|
},
|
|
|
buyProductCart(){//底部购物车按钮点击
|
|
|
- if(!this.hasLogin){
|
|
|
- this.alertType = '3'
|
|
|
- this.isShowNoLogin =true
|
|
|
+ if(this.hasLogin){
|
|
|
+ this.$api.switchTabTo('/pages/tabBar/cart/cart')
|
|
|
}else{
|
|
|
- this.isShowNoLogin =false
|
|
|
- this.$api.switchTabTo('/pages/tabBar/cart/cart');
|
|
|
+ this.$api.navigateTo('/pages/user-module/login-accont?type=1')
|
|
|
}
|
|
|
},
|
|
|
btnGetConfirm(type){//加入购物车&&立即购买点击
|
|
|
- if(!this.hasLogin){
|
|
|
- if(type =='add'){
|
|
|
- this.alertType = '1'
|
|
|
- }else{
|
|
|
- this.alertType = '2'
|
|
|
- }
|
|
|
- this.isShowNoLogin =true
|
|
|
- }else{
|
|
|
- this.isShowNoLogin =false
|
|
|
+ if(this.hasLogin){
|
|
|
this.showSpec(type);
|
|
|
+ }else{
|
|
|
+ this.$api.navigateTo('/pages/user-module/login-accont?type=1')
|
|
|
}
|
|
|
},
|
|
|
changeCountAdd(){//popup弹窗数量增加按钮
|
|
|
this.number++
|
|
|
if(this.ladderPriceFlag == '1'){
|
|
|
- this.productLadderPrices.forEach((item,index)=>{
|
|
|
+ this.ladderPriceList.forEach((item,index)=>{
|
|
|
if(this.number>=item.buyNum){
|
|
|
this.buyRetailPrice = item.buyPrice
|
|
|
}
|
|
@@ -355,7 +380,7 @@
|
|
|
}else{
|
|
|
this.number--
|
|
|
if(this.ladderPriceFlag == '1'){
|
|
|
- this.productLadderPrices.forEach((item,index)=>{
|
|
|
+ this.ladderPriceList.forEach((item,index)=>{
|
|
|
if(this.number>=item.buyNum){
|
|
|
this.buyRetailPrice = item.buyPrice
|
|
|
}
|
|
@@ -387,10 +412,10 @@
|
|
|
},
|
|
|
btnConfirm() {//加入购物车&&立即购买跳转订单页并关闭弹窗
|
|
|
if(this.isBtnType == 'add'){
|
|
|
- // console.log(this.number)
|
|
|
+ console.log(this.isBtnType)
|
|
|
this.getAddProductCart()
|
|
|
}else{
|
|
|
- // console.log(this.number)
|
|
|
+ console.log(this.number)
|
|
|
this.toConfirmation()
|
|
|
}
|
|
|
},
|
|
@@ -399,50 +424,34 @@
|
|
|
let productStp ={
|
|
|
allPrice:this.number*this.buyRetailPrice,
|
|
|
allCount:this.number,
|
|
|
- id:this.productData.id,
|
|
|
- productCount:this.number,
|
|
|
- classifyID:this.classifyID,
|
|
|
+ id:this.product.productID,
|
|
|
+ productCount:this.number
|
|
|
}
|
|
|
this.$api.navigateTo(`/pages/user/order/create-order?type=prodcut&data=${JSON.stringify({data:productStp})}`)
|
|
|
setTimeout(() => {
|
|
|
this.specClass = 'none';
|
|
|
}, 200);
|
|
|
},
|
|
|
- getAddProductCart(){//增加购物车成功和toast弹窗提示成功
|
|
|
- this.$api.post('/details/addCart',
|
|
|
- {
|
|
|
- productID:this.productID,
|
|
|
- userID:this.userID,
|
|
|
- productCount:this.number,
|
|
|
- organizeID:this.userOrganizeID
|
|
|
- },
|
|
|
- response => {
|
|
|
- if (response.code == "1") {
|
|
|
- this.specClass = 'hide';
|
|
|
- this.$util.msg(response.msg,1500,true,'success');
|
|
|
- this.isAnimation = true
|
|
|
- setTimeout(() => {
|
|
|
- this.specClass = 'none';
|
|
|
- }, 200);
|
|
|
- setTimeout(() => {
|
|
|
- this.isAnimation = false;
|
|
|
- }, 2000);
|
|
|
- this.goodsData.cartCount = response.data;
|
|
|
- }else{
|
|
|
- this.$util.msg(response.msg,2000);
|
|
|
- setTimeout(function(){
|
|
|
- this.$api.switchTabTo('/pages/tabBar/home/home')
|
|
|
- },1000)
|
|
|
- }
|
|
|
- }
|
|
|
- )
|
|
|
+ getAddProductCart(){//增加购物车成功和toast弹窗提示成功
|
|
|
+ console.log(this.number)
|
|
|
+ shoppingAddCart({productID:this.productID,userID:this.userID,productCount:this.number}).then(response => {
|
|
|
+ this.specClass = 'hide';
|
|
|
+ this.$util.msg(response.msg,1500,true,'success')
|
|
|
+ this.isAnimation = true
|
|
|
+ setTimeout(() => {this.specClass = 'none'}, 200)
|
|
|
+ setTimeout(() => {this.isAnimation = false},2000)
|
|
|
+ this.goodsData.cartCount = this.product;
|
|
|
+ }).catch(response =>{
|
|
|
+ this.$util.msg(response.msg,2000);
|
|
|
+ })
|
|
|
},
|
|
|
navToLogin(){
|
|
|
- this.$api.navigateTo(`/pages/user-module/login?type=detilType&id=${this.productID}`)
|
|
|
+ this.$api.navigateTo(`/pages/user-module/login-accont?type=detilType&id=${this.productID}`)
|
|
|
},
|
|
|
setHeaderBtnPosi(){
|
|
|
// 获得胶囊按钮位置信息
|
|
|
let headerBtnPosi = uni.getMenuButtonBoundingClientRect();
|
|
|
+ // console.log(headerBtnPosi)
|
|
|
return headerBtnPosi
|
|
|
},
|
|
|
setSysteminfo(){
|
|
@@ -476,6 +485,11 @@
|
|
|
title: '',
|
|
|
}
|
|
|
}
|
|
|
+ if(e.scrollTop>700){
|
|
|
+ this.navbarFiexd = 'fixed'
|
|
|
+ }else{
|
|
|
+ this.navbarFiexd = 'none'
|
|
|
+ }
|
|
|
},
|
|
|
onShow() {
|
|
|
this.$api.getStorage().then((resolve) => {
|
|
@@ -554,6 +568,11 @@
|
|
|
float: left;
|
|
|
padding-bottom: 24rpx;
|
|
|
border-bottom: 1px solid #F8F8F8;
|
|
|
+ &.none{
|
|
|
+ .p-title{
|
|
|
+ color:#999999
|
|
|
+ }
|
|
|
+ }
|
|
|
.p-title{
|
|
|
line-height: 40rpx;
|
|
|
font-size: $font-size-28;
|
|
@@ -601,8 +620,16 @@
|
|
|
.p-login{
|
|
|
height: 44rpx;
|
|
|
line-height: 44rpx;
|
|
|
- color: #F8C499;
|
|
|
+ color: $color-system;
|
|
|
font-size: $font-size-24;
|
|
|
+ &.grade{
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+ .p-no{
|
|
|
+ float: left;
|
|
|
+ margin-right: 5rpx;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.wrap-ladder{
|
|
@@ -688,6 +715,9 @@
|
|
|
color: $text-color;
|
|
|
line-height: 40rpx;
|
|
|
text-align: left;
|
|
|
+ &.none{
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
.info-viewL{
|
|
|
min-width: 350rpx;
|
|
|
float: left;
|
|
@@ -722,6 +752,12 @@
|
|
|
font-size: $font-size-28;
|
|
|
color: $text-color;
|
|
|
border-bottom: 1px solid #F8F8F8;
|
|
|
+ &.none{
|
|
|
+ color: #999999;
|
|
|
+ .text{
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ }
|
|
|
.iconfont{
|
|
|
color: $color-system;
|
|
|
margin-left: 20rpx;
|
|
@@ -743,29 +779,34 @@
|
|
|
padding: 0 24rpx;
|
|
|
background: #fff;
|
|
|
z-index: 10;
|
|
|
+ display: flex;
|
|
|
+ &.fixed{
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
.nav-item {
|
|
|
display: flex;
|
|
|
- width: 142rpx;
|
|
|
+ flex: 1;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
height: 96rpx;
|
|
|
font-size: $font-size-28;
|
|
|
color: $text-color;
|
|
|
position: relative;
|
|
|
- margin-right: 48rpx;
|
|
|
float: left;
|
|
|
position: relative;
|
|
|
.line{
|
|
|
- width: 100%;
|
|
|
+ width: 60%;
|
|
|
height: 2px;
|
|
|
+ border-radius: 1px;
|
|
|
background: #FFFFFF;
|
|
|
position: absolute;
|
|
|
bottom: 0;
|
|
|
- left: 0;
|
|
|
+ left: 50%;
|
|
|
+ margin-left: -30%;
|
|
|
}
|
|
|
&.current{
|
|
|
color:$color-system;
|
|
|
- font-weight: bold;
|
|
|
.line{
|
|
|
background: $color-system;
|
|
|
}
|
|
@@ -779,15 +820,12 @@
|
|
|
}
|
|
|
.isLower{
|
|
|
width: 100%;
|
|
|
- height: 90rpx;
|
|
|
- background-color: rgba(255, 191, 162, 0.5);
|
|
|
- line-height: 90rpx;
|
|
|
+ height: 116rpx;
|
|
|
+ line-height: 116rpx;
|
|
|
text-align: center;
|
|
|
- color: #FFFFFF;
|
|
|
- font-size: $font-size-28;
|
|
|
- position: fixed;
|
|
|
- bottom: 110rpx;
|
|
|
- left: 0;
|
|
|
+ color: #000000;
|
|
|
+ font-size: $font-size-32;
|
|
|
+ font-weight: bold;
|
|
|
}
|
|
|
.bottom-btn{
|
|
|
width: 100%;
|