Skip to content

M
mallapp
Commit 3c2f121d authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent a178484a
Hide whitespace changes
Inline Side-by-side
Showing with 865 additions and 1170 deletions
pages/kotra/activeSignUp.vue
View file @ 3c2f121d
......@@ -216,7 +216,22 @@
@click="goOnAdd()">继续添加联系人</view>
</view>
</template>
<view style="font-size: 16px;margin-top: 52rpx;font-weight: 600;">2021中国（成都）首店经济发展大会疫情防控提醒</view>
<view style="font-size:13px !important;margin-top: 24rpx;">
1、本次大会不接待14天内有国内中高风险地区旅居史人员；
</view>
<view style="font-size:13px !important;margin-top: 24rpx;">
2、省外参会人员需持72小时以内的核酸检测阴性证明报告；
</view>
<view style="font-size:13px !important;margin-top: 24rpx;">
3、请佩戴口罩、测温、扫场所码，出示绿码进入会场。
</view>
<view style="font-size:13px !important;margin-top: 24rpx;">
谢谢配合
</view>
</view>
<view>
<view class="ac_upBtn" style="width:90%;margin:25rpx auto" @click="goSignUp()">提交</view>
</view>
......
pages/kotra/brand/detail.vue
View file @ 3c2f121d
<template>
<view
style="
<view style="
height: 100vh;
overflow: hidden;
box-sizing: border-box;
position: relative;
"
>
<scroll-view scroll-y="true" style="height: 100%" @scroll="scroll" v-if='details'>
<view class="bg-red">
<view class="detail-box">
<view class="header flex" style="popsition: relative">
<view class="title" style="display: flex; align-items: flex-end">
{{ details.BrandName }}
<view
v-for="(item, index) in details.PrizeList"
:key="index"
class="screenBoxItem"
@click="chooseYear(item)"
>
<view class="screenBoxItemYear activeYear">{{
item.YearInfo
}}</view
><view class="screenBoxItemName activeName">{{
">
<scroll-view scroll-y="true" style="height: 100%" @scroll="scroll" v-if='details'>
<view class="bg-red">
<view class="detail-box">
<view class="header flex" style="popsition: relative">
<view class="title" style="display: flex; align-items: flex-end">
{{ details.BrandName }}
<view v-for="(item, index) in details.PrizeList" :key="index" class="screenBoxItem" @click="chooseYear(item)">
<view class="screenBoxItemYear activeYear">{{ item.YearInfo
}}</view>
<view class="screenBoxItemName activeName">{{
item.Name
}}</view>
</view>
</view>
</view>
</view>
<!-- 关注 -->
<view
style="
<!-- 关注 -->
<view style="
width: 120rpx;
height: 120rpx;
margin-left: 12rpx;
......@@ -41,145 +31,61 @@
top: 0;
right: 50rpx;
"
@click="follow"
>
<image
v-if="details.CollectId == 0"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616480343000_509.png"
style="width: 100%; height: 100%"
></image>
<image
v-if="details.CollectId > 0"
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616480343000_370.png"
style="width: 100%; height: 100%"
></image>
</view>
</view>
<view
class="score-box flex item-center"
v-if="details.OpenShopWish != -1"
>
<u-rate
:current="details.OpenShopWish"
:count="5"
:size="25"
active-icon="star"
active-color="#F30329"
:disabled="true"
inactive-color="#b2b2b2"
class="rate"
></u-rate>
<text class="score"
>{{ details.OpenShopWish ? details.OpenShopWish : "0" }}分</text
>
<text class="desire">开店意愿</text>
</view>
<view v-if="details.OpenShopWish == -1">
<text class="desire">无开店意愿</text>
</view>
<view style="width: 100%">
<view
v-if="!details.VideoUrl || details.VideoUrl == ''"
class="img-box"
>
<view
v-if="details.BannerList.length == 1"
v-for="(src, index) in details.BannerList"
:key="index"
style="width: 100%; height: 226rpx"
>
<image
:src="src"
style="width: 100%; height: 100%; border-radius: 20rpx"
mode="aspectFill"
@click="previewImage(0)"
></image>
</view>
<view
v-if="details.BannerList.length == 2"
v-for="(src, index) in details.BannerList"
:key="index"
style="width: calc((100vw - 80rpx - 10rpx) / 2); height: 226rpx"
>
<image
:src="src"
v-if="index == 0"
style="
@click="follow">
<image v-if="details.CollectId == 0" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616480343000_509.png"
style="width: 100%; height: 100%"></image>
<image v-if="details.CollectId > 0" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616480343000_370.png"
style="width: 100%; height: 100%"></image>
</view>
</view>
<view class="score-box flex item-center" v-if="details.OpenShopWish != -1">
<u-rate :current="details.OpenShopWish" :count="5" :size="25" active-icon="star" active-color="#F30329" :disabled="true"
inactive-color="#b2b2b2" class="rate"></u-rate>
<text class="score">{{ details.OpenShopWish ? details.OpenShopWish : "0" }}分</text>
<text class="desire">开店意愿</text>
</view>
<view v-if="details.OpenShopWish == -1">
<text class="desire">无开店意愿</text>
</view>
<view style="width: 100%">
<view v-if="!details.VideoUrl || details.VideoUrl == ''" class="img-box">
<view v-if="details.BannerList.length == 1" v-for="(src, index) in details.BannerList" :key="index" style="width: 100%; height: 226rpx">
<image :src="src" style="width: 100%; height: 100%; border-radius: 20rpx" mode="aspectFill" @click="previewImage(0)"></image>
</view>
<view v-if="details.BannerList.length == 2" v-for="(src, index) in details.BannerList" :key="index" style="width: calc((100vw - 80rpx - 10rpx) / 2); height: 226rpx">
<image :src="src" v-if="index == 0" style="
width: 100%;
height: 100%;
border-radius: 20rpx 0 0 20rpx;
"
mode="aspectFill"
@click="previewImage(index)"
></image>
<image
:src="src"
v-if="index == 1"
style="
mode="aspectFill" @click="previewImage(index)"></image>
<image :src="src" v-if="index == 1" style="
width: 100%;
height: 100%;
border-radius: 0 20rpx 20rpx 0;
"
mode="aspectFill"
@click="previewImage(index)"
></image>
</view>
<view
v-for="(src, index) in details.BannerList"
:key="index"
v-if="details.BannerList.length > 2"
style="height: 226rpx"
>
<image
:src="src"
class="img"
mode="aspectFill"
v-if="index == 0"
@click="previewImage(index)"
style="border-radius: 20rpx 0 0 20rpx"
></image>
<image
:src="src"
class="img"
mode="aspectFill"
v-if="index == 1"
@click="previewImage(index)"
></image>
<image
:src="src"
class="img"
mode="aspectFill"
v-if="index == 2"
@click="previewImage(index)"
style="border-radius: 0 20rpx 20rpx 0"
></image>
</view>
</view>
<view v-else>
<view v-if="details.BannerList.length == 1" class="img-box">
<view
style="
mode="aspectFill" @click="previewImage(index)"></image>
</view>
<view v-for="(src, index) in details.BannerList" :key="index" v-if="details.BannerList.length > 2" style="height: 226rpx">
<image :src="src" class="img" mode="aspectFill" v-if="index == 0" @click="previewImage(index)" style="border-radius: 20rpx 0 0 20rpx"></image>
<image :src="src" class="img" mode="aspectFill" v-if="index == 1" @click="previewImage(index)"></image>
<image :src="src" class="img" mode="aspectFill" v-if="index == 2" @click="previewImage(index)" style="border-radius: 0 20rpx 20rpx 0"></image>
</view>
</view>
<view v-else>
<view v-if="details.BannerList.length == 1" class="img-box">
<view style="
width: calc((100vw - 80rpx - 10rpx) / 2);
height: 226rpx;
position: relative;
"
>
<video
id="myVideo"
:src="details.VideoUrl"
style="
">
<video id="myVideo" :src="details.VideoUrl" style="
width: 100%;
height: 100%;
border-radius: 20rpx 0 0 20rpx;
"
:controls="controls"
:show-center-play-btn="false"
:show-fullscreen-btn="false"
@fullscreenchange="brandvideoControl"
></video>
<view
@click="enlarge(details.VideoUrl)"
style="
:controls="controls" :show-center-play-btn="false" :show-fullscreen-btn="false" @fullscreenchange="brandvideoControl"></video>
<view @click="enlarge(details.VideoUrl)" style="
position: absolute;
left: 50%;
top: 50%;
......@@ -192,59 +98,36 @@
display: flex;
align-items: center;
justify-content: center;
"
>
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png"
style="width: 37rpx; height: 44rpx"
mode=""
></image>
</view>
</view>
<view
v-for="(src, index) in details.BannerList"
:key="index"
style="
">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png"
style="width: 37rpx; height: 44rpx" mode=""></image>
</view>
</view>
<view v-for="(src, index) in details.BannerList" :key="index" style="
width: calc((100vw - 80rpx - 10rpx) / 2);
height: 226rpx;
"
>
<image
:src="src"
style="
">
<image :src="src" style="
width: 100%;
height: 100%;
border-radius: 0 20rpx 20rpx 0;
"
mode="aspectFill"
@click="previewImage(index)"
></image>
</view>
</view>
<view v-if="details.BannerList.length > 1" class="img-box">
<view
style="
mode="aspectFill" @click="previewImage(index)"></image>
</view>
</view>
<view v-if="details.BannerList.length > 1" class="img-box">
<view style="
width: calc((100vw - 80rpx - 20rpx) / 3);
height: 226rpx;
position: relative;
"
>
<video
id="myVideo"
:src="details.VideoUrl"
style="
">
<video id="myVideo" :src="details.VideoUrl" style="
width: 100%;
height: 100%;
border-radius: 20rpx 0 0 20rpx;
"
:controls="controls"
:show-center-play-btn="false"
:show-fullscreen-btn="false"
@fullscreenchange="brandvideoControl"
></video>
<view
@click="enlarge(details.VideoUrl)"
style="
:controls="controls" :show-center-play-btn="false" :show-fullscreen-btn="false" @fullscreenchange="brandvideoControl"></video>
<view @click="enlarge(details.VideoUrl)" style="
position: absolute;
left: 50%;
top: 50%;
......@@ -257,109 +140,68 @@
display: flex;
align-items: center;
justify-content: center;
"
>
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png"
style="width: 37rpx; height: 44rpx"
mode=""
></image>
</view>
</view>
<view
v-for="(src, index) in details.BannerList"
:key="index"
style="
">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1616471847000_345.png"
style="width: 37rpx; height: 44rpx" mode=""></image>
</view>
</view>
<view v-for="(src, index) in details.BannerList" :key="index" style="
width: calc((100vw - 80rpx - 10rpx) / 3);
height: 226rpx;
"
v-if="index < 2"
>
<image
:src="src"
style="width: 100%; height: 100%"
v-if="index == 0"
mode="aspectFill"
@click="previewImage(index)"
></image>
<image
:src="src"
style="
v-if="index < 2">
<image :src="src" style="width: 100%; height: 100%" v-if="index == 0" mode="aspectFill" @click="previewImage(index)"></image>
<image :src="src" style="
width: 100%;
height: 100%;
border-radius: 0 20rpx 20rpx 0;
"
v-if="index == 1"
mode="aspectFill"
@click="previewImage(index)"
></image>
</view>
</view>
</view>
</view>
<!-- //奖章 -->
<view class="MedalBox" v-if="details.ListEnroll.length > 0">
<view
v-for="(item, index) in details.ListEnroll"
:key="index"
class="MedalBoxItem"
>
<image
:src="item.MedalImageBig"
mode="heightFix"
style="height: 100%"
/>
</view>
</view>
<view class="info1 flex flex-between">
<view class="info1-item">
<view class="info1-con">
{{ details.ShopNum }}
</view>
<view class="info1-title"> 店铺数量 </view>
</view>
<!-- <view class="info1-item">
v-if="index == 1" mode="aspectFill" @click="previewImage(index)"></image>
</view>
</view>
</view>
</view>
<!-- //奖章 -->
<view class="MedalBox" v-if="details.ListEnroll.length > 0">
<view v-for="(item, index) in details.ListEnroll" :key="index" class="MedalBoxItem">
<image :src="item.MedalImageBig" mode="heightFix" style="height: 100%" />
</view>
</view>
<view class="info1 flex flex-between">
<view class="info1-item">
<view class="info1-con">
{{ details.ShopNum }}
</view>
<view class="info1-title"> 店铺数量 </view>
</view>
<!-- <view class="info1-item">
<view class="info1-con">
{{ details.ProjectName }}
</view>
<view class="info1-title"> 对标载体 </view>
</view> -->
<view class="info1-item">
<view class="info1-con">
<view
class="brand-xinx-item-t"
:style="{ color: mainColor }"
v-if="
<view class="info1-item">
<view class="info1-con">
<view class="brand-xinx-item-t" :style="{ color: mainColor }" v-if="
details.AreaRequirement == 0 &&
details.EndAreaRequirement != 0
"
>{{
">{{
details.EndAreaRequirement >= 10000
? details.EndAreaRequirement / 10000 + "万"
: details.EndAreaRequirement
}}<text style="font-size: 12px">㎡</text></view
>
<view
class="brand-xinx-item-t"
:style="{ color: mainColor }"
v-if="
}}<text style="font-size: 12px">㎡</text></view>
<view class="brand-xinx-item-t" :style="{ color: mainColor }" v-if="
details.EndAreaRequirement == 0 &&
details.AreaRequirement != 0
"
>{{
">{{
details.AreaRequirement >= 10000
? details.AreaRequirement / 10000 + "万"
: details.AreaRequirement
}}<text style="font-size: 12px">㎡</text></view
>
<view
class="brand-xinx-item-t"
:style="{ color: mainColor }"
v-if="
}}<text style="font-size: 12px">㎡</text></view>
<view class="brand-xinx-item-t" :style="{ color: mainColor }" v-if="
details.AreaRequirement != 0 &&
details.EndAreaRequirement != 0
"
>{{
">{{
details.AreaRequirement >= 10000
? details.AreaRequirement / 10000 + "万"
: details.AreaRequirement
......@@ -367,23 +209,17 @@
details.EndAreaRequirement >= 10000
? details.EndAreaRequirement / 10000 + "万"
: details.EndAreaRequirement
}}<text style="font-size: 12px">㎡</text></view
>
<view
class="brand-xinx-item-t"
:style="{ color: mainColor }"
v-if="
}}<text style="font-size: 12px">㎡</text></view>
<view class="brand-xinx-item-t" :style="{ color: mainColor }" v-if="
details.AreaRequirement == 0 &&
details.EndAreaRequirement == 0
"
>/</view
>
</view>
<view class="info1-title"> 面积需求 </view>
</view>
</view>
<view class="baseinfo">
<!-- <view class="baseinfo-item flex ">
">/</view>
</view>
<view class="info1-title"> 面积需求 </view>
</view>
</view>
<view class="baseinfo">
<!-- <view class="baseinfo-item flex ">
<view class="baseinfo-label">
拓店区域：
</view>
......@@ -399,902 +235,746 @@
商业地产+体育运动的新型“SPORTMALL”的全新商业场景
</view>
</view> -->
<view class="baseinfo-item flex" v-if="details.CustomerType && details.CustomerType!='' ">
<view class="baseinfo-label"> 客群定位： </view>
<view class="baseinfo-con">
{{ details.CustomerType }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.BrandType && details.BrandType!='' ">
<view class="baseinfo-label"> 行业定位： </view>
<view class="baseinfo-con">
{{ details.BrandType }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.StoreExpansion && details.StoreExpansion!='' ">
<view class="baseinfo-label"> 开店方向： </view>
<view class="baseinfo-con">
{{ details.StoreExpansion }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.IsInChengdu && details.IsInChengdu==1 ">
<view class="baseinfo-label"> 成都落地： </view>
<view class="baseinfo-con">
是
</view>
</view>
<view class="baseinfo-item flex" v-if="details.WishDescription && details.WishDescription != ''">
<view class="baseinfo-label"> 拓展对接人： </view>
</view>
<view style="width: 100%; height: 360rpx" v-if="details.WishDescription && details.WishDescription != ''">
<image
:src="details.WishCard"
style="width: 100%; height: 360rpx; border-radius: 20px"
@click="previewImage2(details.WishCard)"
></image>
</view>
</view>
<view class="brand-title" v-if="details.WishDescription && details.WishDescription != ''">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/kotra-tzxq.png"
mode="widthFix"
></image>
</view>
<view
style="margin-top: 30rpx"
v-if="details.WishDescription && details.WishDescription != ''"
>
<h-parse
:content="details.WishDescription"
@navigate="clickDescription"
></h-parse>
</view>
<view class="brand-title">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/kotra-wyxq.png"
mode="widthFix"
></image>
</view>
<view class="Listbox">
<view
id="kiakou"
class="Listbox-item"
@click="showTips('kiakou', details.ShopSize, details.IsShopSize)"
>
<image
:src="EquityList[8].ImagePath"
v-if="details.IsShopSize == 1"
mode="widthFix"
></image>
<image
:src="EquityList[8].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{
<view class="baseinfo-item flex" v-if="details.CustomerType && details.CustomerType!='' ">
<view class="baseinfo-label"> 客群定位： </view>
<view class="baseinfo-con">
{{ details.CustomerType }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.BrandType && details.BrandType!='' ">
<view class="baseinfo-label"> 行业定位： </view>
<view class="baseinfo-con">
{{ details.BrandType }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.StoreExpansion && details.StoreExpansion!='' ">
<view class="baseinfo-label"> 开店方向： </view>
<view class="baseinfo-con">
{{ details.StoreExpansion }}
</view>
</view>
<view class="baseinfo-item flex" v-if="details.IsInChengdu && details.IsInChengdu==1 ">
<view class="baseinfo-label"> 成都落地： </view>
<view class="baseinfo-con">
是
</view>
</view>
<view class="baseinfo-item flex" v-if="details.Other && details.Other!='' ">
<view class="baseinfo-label"> 拓展需求： </view>
<view class="baseinfo-con">
<rich-text :nodes="details.Other"></rich-text>
</view>
</view>
<view class="baseinfo-item flex" v-if="details.WishDescription && details.WishDescription != ''">
<view class="baseinfo-label"> 拓展对接人： </view>
</view>
<view style="width: 100%; height: 360rpx" v-if="details.WishDescription && details.WishDescription != ''">
<image :src="details.WishCard" style="width: 100%; height: 360rpx; border-radius: 20px" @click="previewImage2(details.WishCard)"></image>
</view>
</view>
<view class="brand-title" v-if="details.WishDescription && details.WishDescription != ''">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/kotra-tzxq.png" mode="widthFix"></image>
</view>
<view style="margin-top: 30rpx" v-if="details.WishDescription && details.WishDescription != ''">
<h-parse :content="details.WishDescription" @navigate="clickDescription"></h-parse>
</view>
<view class="brand-title">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/kotra-wyxq.png" mode="widthFix"></image>
</view>
<view class="Listbox">
<view id="kiakou" class="Listbox-item" @click="showTips('kiakou', details.ShopSize, details.IsShopSize)">
<image :src="EquityList[8].ImagePath" v-if="details.IsShopSize == 1" mode="widthFix"></image>
<image :src="EquityList[8].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{
color: details.IsShopSize == 1 ? '#424242' : '#D6D6D6',
}"
>{{ EquityList[8].Title }}</text
>
</view>
<view class="Listbox-item">
<image
:src="EquityList[0].ImagePath"
v-if="details.Plumbing == 1"
mode="widthFix"
></image>
<image
:src="EquityList[0].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{
}">{{ EquityList[8].Title }}</text>
</view>
<view class="Listbox-item">
<image :src="EquityList[0].ImagePath" v-if="details.Plumbing == 1" mode="widthFix"></image>
<image :src="EquityList[0].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{
color: details.Plumbing == 1 ? '#424242' : '#D6D6D6',
}"
>{{ EquityList[0].Title }}</text
>
</view>
<view class="Listbox-item">
<image
:src="EquityList[7].ImagePath"
v-if="details.Caliber == 1"
mode="widthFix"
></image>
<image
:src="EquityList[7].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{ color: details.Caliber == 1 ? '#424242' : '#D6D6D6' }"
>{{ EquityList[7].Title }}</text
>
</view>
<view class="Listbox-item">
<image
:src="EquityList[1].ImagePath"
v-if="details.Sewage == 1"
mode="widthFix"
></image>
<image
:src="EquityList[1].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{ color: details.Sewage == 1 ? '#424242' : '#D6D6D6' }"
>{{ EquityList[1].Title }}</text
>
</view>
}">{{ EquityList[0].Title }}</text>
</view>
<view class="Listbox-item">
<image :src="EquityList[7].ImagePath" v-if="details.Caliber == 1" mode="widthFix"></image>
<image :src="EquityList[7].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{ color: details.Caliber == 1 ? '#424242' : '#D6D6D6' }">{{ EquityList[7].Title }}</text>
</view>
<view class="Listbox-item">
<image :src="EquityList[1].ImagePath" v-if="details.Sewage == 1" mode="widthFix"></image>
<image :src="EquityList[1].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{ color: details.Sewage == 1 ? '#424242' : '#D6D6D6' }">{{ EquityList[1].Title }}</text>
</view>
<!-- 燃气 -->
<view
class="Listbox-item"
id="ranqi"
@click="showTips('ranqi', details.RanQiBZ, details.RanQi)"
>
<image
:src="EquityList[2].ImagePath"
v-if="details.RanQi == 1"
mode="widthFix"
></image>
<image
:src="EquityList[2].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{ color: details.RanQi == 1 ? '#424242' : '#D6D6D6' }"
>{{ EquityList[2].Title }}</text
>
</view>
<view
class="Listbox-item"
id="dianliang"
@click="
<!-- 燃气 -->
<view class="Listbox-item" id="ranqi" @click="showTips('ranqi', details.RanQiBZ, details.RanQi)">
<image :src="EquityList[2].ImagePath" v-if="details.RanQi == 1" mode="widthFix"></image>
<image :src="EquityList[2].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{ color: details.RanQi == 1 ? '#424242' : '#D6D6D6' }">{{ EquityList[2].Title }}</text>
</view>
<view class="Listbox-item" id="dianliang" @click="
showTips('dianliang', details.DianLiang, details.IsDianLiang)
"
>
<image
:src="EquityList[3].ImagePath"
v-if="details.IsDianLiang == 1"
mode="widthFix"
></image>
<image
:src="EquityList[3].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{
">
<image :src="EquityList[3].ImagePath" v-if="details.IsDianLiang == 1" mode="widthFix"></image>
<image :src="EquityList[3].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{
color: details.IsDianLiang == 1 ? '#424242' : '#D6D6D6',
}"
>{{ EquityList[3].Title }}</text
>
</view>
}">{{ EquityList[3].Title }}</text>
</view>
<view
class="Listbox-item"
id="paiyan"
@click="showTips('paiyan', details.PaiYanBZ, details.PaiYan)"
>
<image
:src="EquityList[5].ImagePath"
v-if="details.PaiYan == 1"
mode="widthFix"
></image>
<image
:src="EquityList[5].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{ color: details.PaiYan == 1 ? '#424242' : '#D6D6D6' }"
>{{ EquityList[5].Title }}</text
>
</view>
<view class="Listbox-item">
<image
:src="EquityList[6].ImagePath"
v-if="details.KongTiao == 1"
mode="widthFix"
></image>
<image
:src="EquityList[6].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{
<view class="Listbox-item" id="paiyan" @click="showTips('paiyan', details.PaiYanBZ, details.PaiYan)">
<image :src="EquityList[5].ImagePath" v-if="details.PaiYan == 1" mode="widthFix"></image>
<image :src="EquityList[5].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{ color: details.PaiYan == 1 ? '#424242' : '#D6D6D6' }">{{ EquityList[5].Title }}</text>
</view>
<view class="Listbox-item">
<image :src="EquityList[6].ImagePath" v-if="details.KongTiao == 1" mode="widthFix"></image>
<image :src="EquityList[6].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{
color: details.KongTiao == 1 ? '#424242' : '#D6D6D6',
}"
>{{ EquityList[6].Title }}</text
>
</view>
<view class="Listbox-item">
<image
:src="EquityList[4].ImagePath"
v-if="details.XinFeng == 1"
mode="widthFix"
></image>
<image
:src="EquityList[4].Image_n"
v-else
mode="widthFix"
></image>
<text
class="list-item-text"
:style="{ color: details.XinFeng == 1 ? '#424242' : '#D6D6D6' }"
>{{ EquityList[4].Title }}</text
>
</view>
</view>
</view>
</view>
</scroll-view>
<bianmarenTooltip
:gravity="gravity"
:tooltipShow="tooltipShow"
:btns="tooltipBtns"
:eleId="eleId"
>
</bianmarenTooltip>
<auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth="gbAuth" ></auth>
</view>
}">{{ EquityList[6].Title }}</text>
</view>
<view class="Listbox-item">
<image :src="EquityList[4].ImagePath" v-if="details.XinFeng == 1" mode="widthFix"></image>
<image :src="EquityList[4].Image_n" v-else mode="widthFix"></image>
<text class="list-item-text" :style="{ color: details.XinFeng == 1 ? '#424242' : '#D6D6D6' }">{{ EquityList[4].Title }}</text>
</view>
</view>
</view>
</view>
</scroll-view>
<bianmarenTooltip :gravity="gravity" :tooltipShow="tooltipShow" :btns="tooltipBtns" :eleId="eleId">
</bianmarenTooltip>
<auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth="gbAuth"></auth>
</view>
</template>
<script>
import auth from "@/components/auth/index.vue";
import hParse from "@/components/u-parse/parse.vue";
import bianmarenTooltip from "../components/bianmaren-tooltips.vue";
let timer;
export default {
components: {
hParse,
bianmarenTooltip,
auth
},
data() {
return {
showAuth:false,
u:{},
rate: 5,
ID: 0,
details: null,
typeList: [
{
Id: 0,
Name: "视频",
},
{
Id: 1,
Name: "图片",
},
],
boxOption: 0,
navsOption: 0,
titleStyle: {},
active: 0,
mainColor: "",
controls: false, //显示默认控件
EquityList: [
{
Title: "上下水",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-sxs.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-sxs-n.png",
},
{
Title: "排污",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pw.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pw-n.png",
},
{
Title: "燃气",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-rh.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-rh-n.png",
},
{
Title: "电量负荷",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-dl.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-dl-n.png",
},
{
Title: "新风",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-xf.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-xf-n.png",
},
{
Title: "排烟量",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pyl.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pyl-n.png",
},
{
Title: "空调",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kt.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kt-n.png",
},
{
Title: "管径",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-gj.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-gj-n.png",
},
{
Title: "开口尺寸",
ImagePath:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kkcc.png",
Image_n:
"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kkcc-n.png",
},
],
gravity: "top",
tooltipShow: false,
tooltipBtns: ["今日sad"],
eleId: "", //点击元素
islook: false, //是否可以浏览心愿
};
},
onLoad(options) {
let that = this;
if (options && options.id) {
this.ID = options.id;
this.u = uni.getStorageSync("mall_UserInfo");
if (!this.u) {
this.u = {
nickName: "未登录",
avatarUrl: "",
};
this.showAuth = true;
} else {
this.GetBrandDetails();
}
}
uni.getSystemInfo({
success(res) {
that.titleStyle = {
height: "45px",
paddingTop: `${res.statusBarHeight}px`,
opacity: "0%",
};
},
});
this.mainColor = this.$uiConfig.mainColor;
uni.setNavigationBarTitle({
title: "详情",
});
uni.setNavigationBarColor({
frontColor: "#ffffff",
backgroundColor: "#D40224",
animation: {
duration: 400,
timingFunc: "easeIn",
},
});
},
onShareTimeline() {
//朋友圈
let uid = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserId
: 0;
if (uid == 0) {
uid = uni.getStorageSync("pid") ? uni.getStorageSync("pid").pid : 0;
}
let SmallShopId = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").SmallShopId
: 0;
if (SmallShopId == 0) {
//如果微店id为0 去找所属微店id
SmallShopId = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserSmallShopId
: 0;
}
let Up = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserPageType
: 0;
return {
title: this.details.FullBrandName ? this.details.FullBrandName : "",
query:
"user_id=" +
uid +
"&SmallShopId=" +
SmallShopId +
"&Up=" +
Up +
"&id=" +
this.ID,
imageUrl:
this.details.BannerList && this.details.BannerList.length > 0
? this.details.BannerList[0]
: "",
};
},
onShareAppMessage(res) {
//朋友
let uid = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserId
: 0;
if (uid == 0) {
uid = uni.getStorageSync("pid") ? uni.getStorageSync("pid").pid : 0;
}
let SmallShopId = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").SmallShopId
: 0;
if (SmallShopId == 0) {
//如果微店id为0 去找所属微店id
SmallShopId = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserSmallShopId
: 0;
}
let Up = uni.getStorageSync("mall_UserInfo")
? uni.getStorageSync("mall_UserInfo").UserPageType
: 0;
return {
title: this.details.FullBrandName ? this.details.FullBrandName : "",
path:
"/pages/index/index?user_id=" +
uid +
"&SmallShopId=" +
SmallShopId +
"&Up=" +
Up +
"&id=" +
this.ID +
"&JumpType=15",
imageUrl:
this.details.BannerList && this.details.BannerList.length > 0
? this.details.BannerList[0]
: "",
};
},
methods: {
reloadUserinfo() {
this.u = uni.getStorageSync("mall_UserInfo");
this.GetBrandDetails();
},
//关闭登录窗口
gbAuth() {
uni.navigateBack()
},
showTips(id, text, showis) {
clearInterval(timer);
if (this.eleId == id && this.tooltipShow == true) {
this.tooltipShow = false;
} else {
console.log(text, showis);
if (text != undefined && text != null && text != "" && showis == 1) {
this.eleId = id;
this.tooltipBtns = [text];
this.tooltipShow = true;
timer = setTimeout(() => {
this.tooltipShow = false;
}, 3000);
} else {
this.tooltipShow = false;
}
}
},
clickDescription(e) {
console.log(e);
},
GetBrandDetails() {
this.request2(
{
url: "/api/AppletTrade/GetBrandDetails",
data: {
ID: this.ID,
},
},
(res) => {
if (res.resultCode == 1) {
this.details = res.data;
if (res.data.VideoUrl == "") {
this.active = 1;
}
this.details.imgs = [];
this.details.BannerList.forEach((x) => {
let obj = {
name: x,
};
this.details.imgs.push(obj);
});
}
}
);
},
changeHandler(i) {
this.active = i;
},
previewImage(i) {
console.log(i);
uni.previewImage({
urls: this.details.BannerList,
current: i,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function (data) {},
fail: function (err) {
console.log(err.errMsg);
},
},
});
},
previewImage2(i) {
uni.previewImage({
urls: [this.details.WishCard],
current: 0,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function (data) {},
fail: function (err) {
console.log(err.errMsg);
},
},
});
},
scroll(e) {
this.boxOption = Math.floor((e.detail.scrollTop - 50) / 1.5);
this.titleStyle.opacity =
(e.detail.scrollTop - 100 < 0
? 0
: Math.floor(e.detail.scrollTop - 100)) + "%";
this.tooltipShow = false;
this.$forceUpdate();
},
goback() {
uni.navigateBack({
delta: 1,
});
},
enlarge(file) {
// 全屏
this.videoContext = uni.createVideoContext("myVideo");
this.videoContext.requestFullScreen({
direction: 0,
});
},
brandvideoControl(e) {
console.log(e);
if (e.detail.fullScreen == false) {
this.videoContext.stop();
this.controls = false;
} else {
this.videoContext.play();
this.controls = true;
}
},
getlove() {
this.request2(
{
url: "/api/AppletTrade/GetCollect",
data: {
Type: 2,
SourceId: this.ID,
Id: this.details.CollectId,
},
},
(res) => {
if (res.resultCode == 1) {
uni.showToast({
title: res.message,
icon: "none",
});
this.GetBrandDetails();
}
}
);
},
// 关注与取消关注
follow() {
let that = this;
let parms = {
url: "/api/AppletTrade/GetCollect",
data: {
SourceId: this.ID,
Id: this.details.CollectId,
Type: 2,
},
};
this.request2(parms, (res) => {
if (res.resultCode == 1) {
that.GetBrandDetails();
}
});
},
},
};
import auth from "@/components/auth/index.vue";
import hParse from "@/components/u-parse/parse.vue";
import bianmarenTooltip from "../components/bianmaren-tooltips.vue";
let timer;
export default {
components: {
hParse,
bianmarenTooltip,
auth
},
data() {
return {
showAuth: false,
u: {},
rate: 5,
ID: 0,
details: null,
typeList: [{
Id: 0,
Name: "视频",
},
{
Id: 1,
Name: "图片",
},
],
boxOption: 0,
navsOption: 0,
titleStyle: {},
active: 0,
mainColor: "",
controls: false, //显示默认控件
EquityList: [{
Title: "上下水",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-sxs.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-sxs-n.png",
},
{
Title: "排污",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pw.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pw-n.png",
},
{
Title: "燃气",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-rh.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-rh-n.png",
},
{
Title: "电量负荷",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-dl.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-dl-n.png",
},
{
Title: "新风",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-xf.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-xf-n.png",
},
{
Title: "排烟量",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pyl.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-pyl-n.png",
},
{
Title: "空调",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kt.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kt-n.png",
},
{
Title: "管径",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-gj.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-gj-n.png",
},
{
Title: "开口尺寸",
ImagePath: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kkcc.png",
Image_n: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/k-brand-kkcc-n.png",
},
],
gravity: "top",
tooltipShow: false,
tooltipBtns: ["今日sad"],
eleId: "", //点击元素
islook: false, //是否可以浏览心愿
};
},
onLoad(options) {
let that = this;
if (options && options.id) {
this.ID = options.id;
this.u = uni.getStorageSync("mall_UserInfo");
if (!this.u) {
this.u = {
nickName: "未登录",
avatarUrl: "",
};
this.showAuth = true;
} else {
this.GetBrandDetails();
}
}
uni.getSystemInfo({
success(res) {
that.titleStyle = {
height: "45px",
paddingTop: `${res.statusBarHeight}px`,
opacity: "0%",
};
},
});
this.mainColor = this.$uiConfig.mainColor;
uni.setNavigationBarTitle({
title: "详情",
});
uni.setNavigationBarColor({
frontColor: "#ffffff",
backgroundColor: "#D40224",
animation: {
duration: 400,
timingFunc: "easeIn",
},
});
},
onShareTimeline() {
//朋友圈
let uid = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserId :
0;
if (uid == 0) {
uid = uni.getStorageSync("pid") ? uni.getStorageSync("pid").pid : 0;
}
let SmallShopId = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").SmallShopId :
0;
if (SmallShopId == 0) {
//如果微店id为0 去找所属微店id
SmallShopId = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserSmallShopId :
0;
}
let Up = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserPageType :
0;
return {
title: this.details.FullBrandName ? this.details.FullBrandName : "",
query: "user_id=" +
uid +
"&SmallShopId=" +
SmallShopId +
"&Up=" +
Up +
"&id=" +
this.ID,
imageUrl: this.details.BannerList && this.details.BannerList.length > 0 ?
this.details.BannerList[0] : "",
};
},
onShareAppMessage(res) {
//朋友
let uid = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserId :
0;
if (uid == 0) {
uid = uni.getStorageSync("pid") ? uni.getStorageSync("pid").pid : 0;
}
let SmallShopId = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").SmallShopId :
0;
if (SmallShopId == 0) {
//如果微店id为0 去找所属微店id
SmallShopId = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserSmallShopId :
0;
}
let Up = uni.getStorageSync("mall_UserInfo") ?
uni.getStorageSync("mall_UserInfo").UserPageType :
0;
return {
title: this.details.FullBrandName ? this.details.FullBrandName : "",
path: "/pages/index/index?user_id=" +
uid +
"&SmallShopId=" +
SmallShopId +
"&Up=" +
Up +
"&id=" +
this.ID +
"&JumpType=15",
imageUrl: this.details.BannerList && this.details.BannerList.length > 0 ?
this.details.BannerList[0] : "",
};
},
methods: {
reloadUserinfo() {
this.u = uni.getStorageSync("mall_UserInfo");
this.GetBrandDetails();
},
//关闭登录窗口
gbAuth() {
uni.navigateBack()
},
showTips(id, text, showis) {
clearInterval(timer);
if (this.eleId == id && this.tooltipShow == true) {
this.tooltipShow = false;
} else {
console.log(text, showis);
if (text != undefined && text != null && text != "" && showis == 1) {
this.eleId = id;
this.tooltipBtns = [text];
this.tooltipShow = true;
timer = setTimeout(() => {
this.tooltipShow = false;
}, 3000);
} else {
this.tooltipShow = false;
}
}
},
clickDescription(e) {
console.log(e);
},
GetBrandDetails() {
this.request2({
url: "/api/AppletTrade/GetBrandDetails",
data: {
ID: this.ID,
},
},
(res) => {
if (res.resultCode == 1) {
this.details = res.data;
if (res.data.VideoUrl == "") {
this.active = 1;
}
this.details.imgs = [];
this.details.BannerList.forEach((x) => {
let obj = {
name: x,
};
this.details.imgs.push(obj);
});
}
}
);
},
changeHandler(i) {
this.active = i;
},
previewImage(i) {
console.log(i);
uni.previewImage({
urls: this.details.BannerList,
current: i,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function(data) {},
fail: function(err) {
console.log(err.errMsg);
},
},
});
},
previewImage2(i) {
uni.previewImage({
urls: [this.details.WishCard],
current: 0,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function(data) {},
fail: function(err) {
console.log(err.errMsg);
},
},
});
},
scroll(e) {
this.boxOption = Math.floor((e.detail.scrollTop - 50) / 1.5);
this.titleStyle.opacity =
(e.detail.scrollTop - 100 < 0 ?
0 :
Math.floor(e.detail.scrollTop - 100)) + "%";
this.tooltipShow = false;
this.$forceUpdate();
},
goback() {
uni.navigateBack({
delta: 1,
});
},
enlarge(file) {
// 全屏
this.videoContext = uni.createVideoContext("myVideo");
this.videoContext.requestFullScreen({
direction: 0,
});
},
brandvideoControl(e) {
console.log(e);
if (e.detail.fullScreen == false) {
this.videoContext.stop();
this.controls = false;
} else {
this.videoContext.play();
this.controls = true;
}
},
getlove() {
this.request2({
url: "/api/AppletTrade/GetCollect",
data: {
Type: 2,
SourceId: this.ID,
Id: this.details.CollectId,
},
},
(res) => {
if (res.resultCode == 1) {
uni.showToast({
title: res.message,
icon: "none",
});
this.GetBrandDetails();
}
}
);
},
// 关注与取消关注
follow() {
let that = this;
let parms = {
url: "/api/AppletTrade/GetCollect",
data: {
SourceId: this.ID,
Id: this.details.CollectId,
Type: 2,
},
};
this.request2(parms, (res) => {
if (res.resultCode == 1) {
that.GetBrandDetails();
}
});
},
},
};
</script>
<style lang="scss" scoped>
.flex {
display: flex;
}
.wrap {
flex-wrap: wrap;
}
.flex-center {
justify-content: center;
align-items: center;
}
.flex-between {
justify-content: space-between;
}
.item-center {
align-items: center;
}
.bg-red {
background-color: #d40224;
}
.detail-box {
width: 100%;
box-shadow: 0px -4rpx 71rpx 0rpx rgba(111, 111, 111, 0.26);
border-radius: 50rpx 50rpx 0rpx 0rpx;
padding: 40rpx 40rpx 90rpx 40rpx;
font-family: PingFang SC;
background-color: #ffffff;
.header {
margin-bottom: 20rpx;
align-items: flex-start;
.title {
max-width: calc(100vw - 100rpx - 70rpx);
font-size: 42rpx;
font-weight: 800;
color: #1f1f1f;
margin-right: 20rpx;
}
.tag-box {
border-radius: 6rpx;
width: 70px;
display: flex;
margin-top: 4px;
height: 20px;
.tag1 {
display: flex;
align-items: center;
justify-content: center;
background-color: #1f1f1f;
font-size: 20rpx;
color: #ffffff;
}
.tag2 {
display: flex;
align-items: center;
justify-content: center;
background-image: linear-gradient(90deg, #e8cea5, #caa974);
font-size: 20rpx;
color: #1f1f1f;
}
}
}
.score-box {
height: 40rpx;
margin-bottom: 35rpx;
.rate {
margin-right: 20rpx;
}
.score {
font-size: 20rpx;
font-weight: 500;
color: #f30329;
margin-right: 20rpx;
}
.desire {
font-size: 20rpx;
color: #111111;
}
}
.img-box {
height: 226rpx;
border-radius: 20rpx;
box-shadow: 0rpx 10rpx 30rpx 0rpx rgba(36, 36, 36, 0.2);
margin-bottom: 45rpx;
display: flex;
align-items: center;
justify-content: space-between;
overflow: hidden;
.img {
width: calc((100vw - 80rpx - 20rpx) / 3);
height: 226rpx;
}
}
.info1 {
margin-bottom: 60rpx;
.info1-item {
// width: 200rpx;之前的3个是200 下面是2个 就平分了宽度
width: calc((100vw - 80rpx - 20rpx) / 2);
.info1-con {
font-size: 30rpx;
font-weight: bold;
color: #f30329;
text-align: center;
margin-bottom: 18rpx;
}
.info1-title {
text-align: center;
font-size: 24rpx;
font-weight: 500;
color: #a4a4a4;
}
}
}
.baseinfo {
margin-bottom: 40rpx;
.baseinfo-item {
margin-bottom: 30rpx;
.baseinfo-label {
font-size: 24rpx;
font-weight: 500;
color: #a4a4a4;
margin-right: 10rpx;
white-space: nowrap;
}
.baseinfo-con {
font-size: 26rpx;
font-weight: 500;
color: #1f1f1f;
}
}
}
}
.brand-title {
width: 134rpx;
margin-top: 30px;
}
.brand-title image {
width: 100%;
height: auto;
}
.Listbox {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 10px;
}
.Listbox-item {
width: 25%;
display: flex;
flex-direction: column;
align-items: center;
height: 170rpx;
align-items: center;
justify-content: center;
}
.Listbox-item image {
width: 74rpx;
height: auto;
}
.list-item-text {
width: calc(100vw / 4);
margin-top: 5px;
text-align: center;
font-size: 12px;
}
.screenBoxItem {
/* width: 130rpx; */
height: 30rpx;
background-color: #e2e2e2;
border-radius: 23rpx;
margin-right: 30rpx;
display: flex;
color: #999999;
overflow: hidden;
margin: 0 10rpx;
overflow: hidden;
border-radius: 6rpx;
}
.screenBoxItemYear {
/* width: 50%; */
height: 30rpx;
background: #e2e2e2;
display: flex;
justify-content: center;
align-items: center;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 500;
white-space: nowrap;
border-radius: 6rpx 0px 0px 6rpx;
box-sizing: border-box;
padding: 0 10rpx;
}
.activeYear {
background: #1f1f1f;
color: #ffffff;
}
.screenBoxItemName {
/* width: 50%; */
height: 30rpx;
background: #eaeaea;
display: flex;
justify-content: center;
align-items: center;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 500;
box-sizing: border-box;
padding: 0 10rpx;
white-space: nowrap;
border-radius: 0px 6rpx 6rpx 0px;
}
.activeName {
background: #d0aa7b;
color: #111111;
}
.MedalBox {
background: #f0f0f0;
border-radius: 20rpx;
box-sizing: border-box;
padding: 15rpx;
display: flex;
flex-wrap: wrap;
margin-bottom: 30rpx;
}
.MedalBoxItem {
width: 30%;
height: 135rpx;
display: flex;
justify-content: center;
align-items: center;
margin: 10rpx;
}
.flex {
display: flex;
}
.wrap {
flex-wrap: wrap;
}
.flex-center {
justify-content: center;
align-items: center;
}
.flex-between {
justify-content: space-between;
}
.item-center {
align-items: center;
}
.bg-red {
background-color: #d40224;
}
.detail-box {
width: 100%;
box-shadow: 0px -4rpx 71rpx 0rpx rgba(111, 111, 111, 0.26);
border-radius: 50rpx 50rpx 0rpx 0rpx;
padding: 40rpx 40rpx 90rpx 40rpx;
font-family: PingFang SC;
background-color: #ffffff;
.header {
margin-bottom: 20rpx;
align-items: flex-start;
.title {
max-width: calc(100vw - 100rpx - 70rpx);
font-size: 42rpx;
font-weight: 800;
color: #1f1f1f;
margin-right: 20rpx;
}
.tag-box {
border-radius: 6rpx;
width: 70px;
display: flex;
margin-top: 4px;
height: 20px;
.tag1 {
display: flex;
align-items: center;
justify-content: center;
background-color: #1f1f1f;
font-size: 20rpx;
color: #ffffff;
}
.tag2 {
display: flex;
align-items: center;
justify-content: center;
background-image: linear-gradient(90deg, #e8cea5, #caa974);
font-size: 20rpx;
color: #1f1f1f;
}
}
}
.score-box {
height: 40rpx;
margin-bottom: 35rpx;
.rate {
margin-right: 20rpx;
}
.score {
font-size: 20rpx;
font-weight: 500;
color: #f30329;
margin-right: 20rpx;
}
.desire {
font-size: 20rpx;
color: #111111;
}
}
.img-box {
height: 226rpx;
border-radius: 20rpx;
box-shadow: 0rpx 10rpx 30rpx 0rpx rgba(36, 36, 36, 0.2);
margin-bottom: 45rpx;
display: flex;
align-items: center;
justify-content: space-between;
overflow: hidden;
.img {
width: calc((100vw - 80rpx - 20rpx) / 3);
height: 226rpx;
}
}
.info1 {
margin-bottom: 60rpx;
.info1-item {
// width: 200rpx;之前的3个是200 下面是2个 就平分了宽度
width: calc((100vw - 80rpx - 20rpx) / 2);
.info1-con {
font-size: 30rpx;
font-weight: bold;
color: #f30329;
text-align: center;
margin-bottom: 18rpx;
}
.info1-title {
text-align: center;
font-size: 24rpx;
font-weight: 500;
color: #a4a4a4;
}
}
}
.baseinfo {
margin-bottom: 40rpx;
.baseinfo-item {
margin-bottom: 30rpx;
.baseinfo-label {
font-size: 24rpx;
font-weight: 500;
color: #a4a4a4;
margin-right: 10rpx;
white-space: nowrap;
}
.baseinfo-con {
font-size: 26rpx;
font-weight: 500;
color: #1f1f1f;
}
}
}
}
.brand-title {
width: 134rpx;
margin-top: 30px;
}
.brand-title image {
width: 100%;
height: auto;
}
.Listbox {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 10px;
}
.Listbox-item {
width: 25%;
display: flex;
flex-direction: column;
align-items: center;
height: 170rpx;
align-items: center;
justify-content: center;
}
.Listbox-item image {
width: 74rpx;
height: auto;
}
.list-item-text {
width: calc(100vw / 4);
margin-top: 5px;
text-align: center;
font-size: 12px;
}
.screenBoxItem {
/* width: 130rpx; */
height: 30rpx;
background-color: #e2e2e2;
border-radius: 23rpx;
margin-right: 30rpx;
display: flex;
color: #999999;
overflow: hidden;
margin: 0 10rpx;
overflow: hidden;
border-radius: 6rpx;
}
.screenBoxItemYear {
/* width: 50%; */
height: 30rpx;
background: #e2e2e2;
display: flex;
justify-content: center;
align-items: center;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 500;
white-space: nowrap;
border-radius: 6rpx 0px 0px 6rpx;
box-sizing: border-box;
padding: 0 10rpx;
}
.activeYear {
background: #1f1f1f;
color: #ffffff;
}
.screenBoxItemName {
/* width: 50%; */
height: 30rpx;
background: #eaeaea;
display: flex;
justify-content: center;
align-items: center;
font-size: 20rpx;
font-family: PingFang SC;
font-weight: 500;
box-sizing: border-box;
padding: 0 10rpx;
white-space: nowrap;
border-radius: 0px 6rpx 6rpx 0px;
}
.activeName {
background: #d0aa7b;
color: #111111;
}
.MedalBox {
background: #f0f0f0;
border-radius: 20rpx;
box-sizing: border-box;
padding: 15rpx;
display: flex;
flex-wrap: wrap;
margin-bottom: 30rpx;
}
.MedalBoxItem {
width: 30%;
height: 135rpx;
display: flex;
justify-content: center;
align-items: center;
margin: 10rpx;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment