蜂箱
This commit is contained in:
parent
b7f637808d
commit
ec2140d707
|
|
@ -1,6 +1,6 @@
|
|||
const install = (Vue, vm) => {
|
||||
Vue.prototype.$u.http.setConfig({
|
||||
// baseUrl: 'http://192.168.2.27:3202',
|
||||
// baseUrl: 'http://192.168.2.18:3202',
|
||||
baseUrl: 'https://fen.ccttiot.com/prod-api',
|
||||
loadingText: '努力加载中~',
|
||||
loadingTime: 800,
|
||||
|
|
|
|||
|
|
@ -668,7 +668,7 @@
|
|||
margin-top: 20rpx;
|
||||
padding: 20rpx 26rpx;
|
||||
width: 462rpx;
|
||||
height: 260rpx;
|
||||
max-height: 600rpx;
|
||||
background: #F6F6F6;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
|
||||
|
|
|
|||
|
|
@ -16,27 +16,45 @@
|
|||
<image src="https://api.ccttiot.com/smartmeter/img/static/uR30yYn3IsHDu5qWV0ML" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tabbar">
|
||||
<view class="cont" v-for="(item,index) in miyuancolumns" :key="index" @click="btntab(index,item)">
|
||||
{{item.label == null ? '--' : item.label}} <text v-if="item.count != '-1'">({{item.count == null ? '0' : item.count}})</text>
|
||||
<view class="gl" :id="indextab == index ? 'active' : ''"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="no_cont" v-if="logoflag">
|
||||
<!-- <view class="no_cont" v-if="logoflag">
|
||||
<view class="img">
|
||||
<image src="https://api.ccttiot.com/smartmeter/img/static/uUZ3MF84e3bKgwAei8Rz" mode=""></image>
|
||||
</view>
|
||||
<view class="txt">
|
||||
当前还没有添加蜂箱哦
|
||||
</view>
|
||||
</view>
|
||||
<view class="warp_box" v-else>
|
||||
<swiper class="swiper" :style="{ height: swiperHeight + 'rpx' }" :current='curtitidx'
|
||||
@change="swiperchange">
|
||||
<swiper-item >
|
||||
<scroll-view class="swiper-item" scroll-y="true" @scrolltolower="loadMore">
|
||||
<view class="card_box" v-for="(item,index) in fxlist" :key="index" @click="todetail(item.beehiveId)">
|
||||
</view> -->
|
||||
<view class="fd">
|
||||
<!-- 刷新动画 -->
|
||||
<!-- <view class="shuaxin">
|
||||
<image src="https://api.ccttiot.com/smartmeter/img/static/uO9UFjzbzS9YlabzL4HV" mode="aspectFit"></image>
|
||||
</view> -->
|
||||
|
||||
<view class="fd_top u-skeleton-fillet">
|
||||
<view class="fd_da">
|
||||
<view class="fd_lt"
|
||||
:style="{ transform: `translateX(${-curtitidx * 100 > -300 ? 0 : -curtitidx * 120}rpx)`}">
|
||||
<view class="fd_tit" v-for="(item,index) in miyuancolumns" :key="index"
|
||||
:class="index == curtitidx ? 'act1' : ''" @click="btntab(index,item)">
|
||||
{{item.name == null ? '--' : item.name}} <text v-if="item.count != '-1'">({{item.count == null ? '0' : item.count}})</text>
|
||||
<view :class="index == curtitidx ? 'active' : ''"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<swiper class="swiper" style="height: 100%;" :current='curtitidx' @change="swiperchange"
|
||||
@touchstart="touchStart" @touchend="touchEnd">
|
||||
<swiper-item v-for="(items,index) in miyuancolumns" :key="index" class="">
|
||||
<view class="" v-if="items && items.wateringList && items.wateringList.length == 0"
|
||||
style="width: 100%;height: 200rpx;margin: auto;margin-top: 230rpx;text-align: center;">
|
||||
<image style="width: 200rpx;height: 200rpx;"
|
||||
src="https://api.ccttiot.com/smartmeter/img/static/uUZ3MF84e3bKgwAei8Rz" mode="aspectFit"></image>
|
||||
<view class="" style="font-size: 28rpx;color: #808080;margin-top: 30rpx;">暂未添加蜂箱...</view>
|
||||
</view>
|
||||
<view class="swiper_item">
|
||||
<view class="card_box" v-for="(item,indexs) in items.wateringList" :key="indexs" @click="todetail(item.beehiveId)">
|
||||
<view class="card">
|
||||
<view class="card_top">
|
||||
<view class="name">
|
||||
|
|
@ -45,9 +63,6 @@
|
|||
<view class="online" :id="item.onlineStatus == 0 ? 'status' : ''">
|
||||
{{item.onlineStatus == 0 ? '离线' : '在线'}}
|
||||
</view>
|
||||
<!-- <view class="type">
|
||||
已认养
|
||||
</view> -->
|
||||
<view class="ele">
|
||||
<view class="type" @click.stop="btngengxin">
|
||||
更新数据
|
||||
|
|
@ -175,10 +190,12 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
|
||||
<tab-bar :indexs='2' style=""></tab-bar>
|
||||
<u-toast ref="uToast" />
|
||||
</view>
|
||||
|
|
@ -194,15 +211,20 @@
|
|||
code: '',
|
||||
swiperHeight:554,
|
||||
curtitidx:0,
|
||||
miyuancolumns: [{label:'全部',count:'0'}],
|
||||
miyuancolumns: [{name:'全部',count:'0'}],
|
||||
pagesum: 1,
|
||||
pagesize: 99,
|
||||
pagesizes: 5,
|
||||
pagesizes: 10,
|
||||
fxlist:[],
|
||||
total: '',
|
||||
apiaryId:'',
|
||||
indextab:0,
|
||||
logoflag:false,
|
||||
wateringList:[],
|
||||
touchStartX: 0, // 触屏起始点x
|
||||
touchStartY: 0, // 触屏起始点y
|
||||
qingqiuflag:true,
|
||||
shujuflag: false,
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
|
@ -211,34 +233,61 @@
|
|||
onShow() {
|
||||
this.indextab = 0
|
||||
this.pagesum = 1
|
||||
this.miyuancolumns = []
|
||||
this.getmiyuancolumns()
|
||||
},
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
touchStart(e) {
|
||||
this.touchStartX = e.touches[0].clientX;
|
||||
this.touchStartY = e.touches[0].clientY;
|
||||
},
|
||||
// 松开
|
||||
touchEnd(e) {
|
||||
let deltaX = e.changedTouches[0].clientX - this.touchStartX;
|
||||
let deltaY = e.changedTouches[0].clientY - this.touchStartY;
|
||||
if (Math.abs(deltaX) > 50 && Math.abs(deltaX) > Math.abs(deltaY)) {
|
||||
if (deltaX >= 0) {
|
||||
// console.log("左滑")
|
||||
} else {
|
||||
// console.log("右滑")
|
||||
}
|
||||
} else if (Math.abs(deltaY) > 50 && Math.abs(deltaX) < Math.abs(deltaY)) {
|
||||
if (deltaY < 100) {
|
||||
console.log("上滑")
|
||||
if(this.qingqiuflag == true){
|
||||
if (this.miyuancolumns[0].wateringList.length < this.total) {
|
||||
this.qingqiuflag = false
|
||||
this.getlist()
|
||||
}
|
||||
}
|
||||
} else {
|
||||
console.log(deltaY)
|
||||
if (deltaY > 250) {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
// 刷新蜂箱最新数据
|
||||
btngengxin(){
|
||||
uni.showLoading({
|
||||
title: '更新数据中...',
|
||||
mask: true
|
||||
})
|
||||
this.indextab = 0
|
||||
this.curtitidx = 0
|
||||
this.pagesum = 1
|
||||
this.getlist()
|
||||
},
|
||||
// 进行蜂箱搜索
|
||||
changserch(){
|
||||
let data = {
|
||||
pageNum:this.pagesum,
|
||||
pageSize:this.pagesizes,
|
||||
name:this.code,
|
||||
sn:this.code
|
||||
}
|
||||
this.$u.get('/farm/beehive/list', data).then(res => {
|
||||
if(res.code == 200){
|
||||
this.fxlist = []
|
||||
this.total = res.total
|
||||
this.fxlist = res.rows
|
||||
}
|
||||
})
|
||||
this.pagesum = 1
|
||||
this.getlist()
|
||||
},
|
||||
// 点击蜂箱详情进行页面跳转
|
||||
todetail(beehiveId){
|
||||
|
|
@ -248,9 +297,9 @@
|
|||
},
|
||||
// 点击tab请求tab中的蜂箱
|
||||
btntab(index,item){
|
||||
this.indextab = index
|
||||
this.curtitidx = index
|
||||
this.pagesum = 1
|
||||
this.apiaryId = item.value
|
||||
this.apiaryId = this.miyuancolumns[this.curtitidx].value
|
||||
this.getlist()
|
||||
},
|
||||
// 请求蜂箱列表
|
||||
|
|
@ -259,40 +308,61 @@
|
|||
pageNum:this.pagesum,
|
||||
pageSize:this.pagesizes,
|
||||
apiaryId:this.apiaryId,
|
||||
refreshIot:true
|
||||
refreshIot:true,
|
||||
name:this.code,
|
||||
}
|
||||
this.$u.get('/farm/beehive/list', data).then(res => {
|
||||
if(res.code == 200){
|
||||
uni.hideLoading()
|
||||
this.total = res.total
|
||||
if(this.total < 1){
|
||||
this.logoflag = true
|
||||
}else{
|
||||
this.logoflag = false
|
||||
if(this.pagesum > 1){
|
||||
this.fxlist = this.fxlist .concat(res.rows)
|
||||
this.wateringList = res.rows
|
||||
this.qingqiuflag = true
|
||||
this.miyuancolumns.forEach(groupItem => {
|
||||
groupItem.wateringList
|
||||
})
|
||||
this.wateringList.forEach(wateringItem => {
|
||||
this.miyuancolumns[0].wateringList.push(wateringItem)
|
||||
})
|
||||
this.wateringList.forEach(wateringItem => {
|
||||
this.miyuancolumns.forEach(groupItem => {
|
||||
if (groupItem.value !== null && wateringItem.apiaryId !== null && groupItem.value == wateringItem.apiaryId) {
|
||||
if (!groupItem.wateringList.some(item => item.apiaryId === wateringItem.apiaryId)) {
|
||||
groupItem.wateringList.push(wateringItem)
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
uni.hideLoading()
|
||||
if(this.total > this.miyuancolumns.length){
|
||||
this.pagesum++
|
||||
}
|
||||
}else{
|
||||
this.fxlist = res.rows
|
||||
this.wateringList = res.rows
|
||||
this.qingqiuflag = true
|
||||
this.miyuancolumns.forEach(groupItem => {
|
||||
groupItem.wateringList = []
|
||||
})
|
||||
this.wateringList.forEach(wateringItem => {
|
||||
this.miyuancolumns[0].wateringList.push(wateringItem);
|
||||
})
|
||||
this.wateringList.forEach(wateringItem => {
|
||||
this.miyuancolumns.forEach(groupItem => {
|
||||
if (groupItem.value !== null && wateringItem.apiaryId !== null && groupItem.value == wateringItem.apiaryId) {
|
||||
groupItem.wateringList.push(wateringItem)
|
||||
}
|
||||
})
|
||||
})
|
||||
uni.hideLoading()
|
||||
if(this.total > this.miyuancolumns.length){
|
||||
this.pagesum++
|
||||
}
|
||||
}
|
||||
this.pagesum++
|
||||
}
|
||||
}else{
|
||||
uni.hideLoading()
|
||||
}
|
||||
})
|
||||
},
|
||||
// 请求更多蜂箱列表
|
||||
loadMore() {
|
||||
if (this.fxlist.length < this.total) {
|
||||
this.getlist()
|
||||
} else {
|
||||
this.$refs.uToast.show({
|
||||
title: '没有更多蜂箱了',
|
||||
type: 'default',
|
||||
position:'bottom'
|
||||
})
|
||||
}
|
||||
},
|
||||
// 请求蜂箱tab导航栏
|
||||
getmiyuancolumns() {
|
||||
let data = {
|
||||
|
|
@ -303,20 +373,23 @@
|
|||
if (res.code === 200) {
|
||||
this.miyuancolumns = res.rows.map(item => ({
|
||||
value: item.apiaryId,
|
||||
label: item.name,
|
||||
name: item.name,
|
||||
count:item.beehiveCount
|
||||
}))
|
||||
this.miyuancolumns.unshift({ label: '全部',value:'',count:'-1'})
|
||||
this.miyuancolumns.unshift({ name: '全部',value:'',count:'-1'})
|
||||
console.log(this.miyuancolumns);
|
||||
this.apiaryId = this.miyuancolumns[0].value
|
||||
this.logoflag = false
|
||||
this.getlist()
|
||||
} else {
|
||||
this.logoflag = true
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
swiperchange(e) {
|
||||
this.curtitidx = e.detail.current
|
||||
this.pagesum = 1
|
||||
this.apiaryId = this.miyuancolumns[this.curtitidx].value
|
||||
this.getlist()
|
||||
},
|
||||
// 点击跳转到添加蜂箱页面
|
||||
addApiary(){
|
||||
|
|
@ -329,11 +402,20 @@
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
#active{
|
||||
.active{
|
||||
border-bottom: 3px solid #FFC107;
|
||||
font-weight: 600;
|
||||
font-size: 40rpx;
|
||||
display: block !important;
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
background: #FFC107;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 4rpx;
|
||||
left: 0rpx;
|
||||
opacity: .7;
|
||||
z-index: -1;
|
||||
}
|
||||
#status{
|
||||
background-color: #808080;
|
||||
|
|
@ -341,11 +423,112 @@
|
|||
page {
|
||||
background-color: #FAFDFD;
|
||||
}
|
||||
.card_top{
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
.txt{
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #808080;
|
||||
}
|
||||
.line{
|
||||
margin-left: 18rpx;
|
||||
margin-right: 18rpx;
|
||||
width: 0rpx;
|
||||
height: 30rpx;
|
||||
border: 2rpx solid #808080;
|
||||
}
|
||||
.name{
|
||||
font-weight: 600;
|
||||
font-size: 36rpx;
|
||||
color: #3D3D3D;
|
||||
}
|
||||
.online{
|
||||
margin-left: 26rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #4CD964;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.type{
|
||||
margin-left: 24rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #FFC107;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.ele{
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #808080;
|
||||
.type{
|
||||
margin-left: 24rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #FFC107;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
image{
|
||||
margin-right: 12rpx;
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.info_cont{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.info_li:nth-child(3n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.info_li{
|
||||
margin-top: 28rpx;
|
||||
width: 33%;
|
||||
.li_top{
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
image{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
.li_txt{
|
||||
margin-left: 12rpx;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
font-weight: 600;
|
||||
font-size: 30rpx;
|
||||
color: #3D3D3D;
|
||||
span{
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.li_bot{
|
||||
margin-left: 4rpx;
|
||||
margin-top: 14rpx;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #3D3D3D;
|
||||
}
|
||||
}
|
||||
}
|
||||
.page {
|
||||
width: 750rpx;
|
||||
.swiper {
|
||||
height: 76vh !important;
|
||||
padding-bottom: 230rpx;
|
||||
height: 62vh !important;
|
||||
// padding-bottom: 230rpx;
|
||||
box-sizing: border-box;
|
||||
.swiper-item {
|
||||
overflow: scroll;
|
||||
|
|
@ -359,107 +542,6 @@
|
|||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0,0,0,0.15);
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
.info_cont{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.info_li:nth-child(3n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.info_li{
|
||||
margin-top: 28rpx;
|
||||
width: 33%;
|
||||
.li_top{
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
image{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
.li_txt{
|
||||
margin-left: 12rpx;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
font-weight: 600;
|
||||
font-size: 30rpx;
|
||||
color: #3D3D3D;
|
||||
span{
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.li_bot{
|
||||
margin-left: 4rpx;
|
||||
margin-top: 14rpx;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #3D3D3D;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card_top{
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
.txt{
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #808080;
|
||||
}
|
||||
.line{
|
||||
margin-left: 18rpx;
|
||||
margin-right: 18rpx;
|
||||
width: 0rpx;
|
||||
height: 30rpx;
|
||||
border: 2rpx solid #808080;
|
||||
}
|
||||
.name{
|
||||
font-weight: 600;
|
||||
font-size: 36rpx;
|
||||
color: #3D3D3D;
|
||||
}
|
||||
.online{
|
||||
margin-left: 26rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #4CD964;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.type{
|
||||
margin-left: 24rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #FFC107;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.ele{
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #808080;
|
||||
.type{
|
||||
margin-left: 24rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #FFC107;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
image{
|
||||
margin-right: 12rpx;
|
||||
width: 46rpx;
|
||||
height: 46rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -556,4 +638,250 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.fd {
|
||||
margin-top: 20rpx;
|
||||
padding: 0 40rpx;
|
||||
padding-bottom: 200rpx;
|
||||
height: 100%;
|
||||
|
||||
.fz {
|
||||
margin: 0 -40rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 750rpx;
|
||||
height: 830rpx;
|
||||
background: #F7FAFE;
|
||||
border-radius: 30rpx 30rpx 0 0;
|
||||
z-index: 10071;
|
||||
opacity: 0;
|
||||
animation-name: fadeIn;
|
||||
animation-duration: 1s;
|
||||
animation-fill-mode: forwards;
|
||||
|
||||
.fz_top {
|
||||
margin: 18rpx 0 auto;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
|
||||
.icon-shanchu {
|
||||
margin-left: 40rpx;
|
||||
font-size: 50rpx;
|
||||
}
|
||||
|
||||
.tit {
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.txt {
|
||||
margin-right: 40rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
color: #2A82E4;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.card_cont {
|
||||
width: 750rpx;
|
||||
padding-left: 30rpx;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
.cards {
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 40rpx;
|
||||
width: 682rpx;
|
||||
border-radius: 30rpx;
|
||||
height: 114rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 16rpx 40rpx 0rpx rgba(42, 130, 228, 0.1);
|
||||
|
||||
.txt {
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.num {
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fd_top {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
.fd_da {
|
||||
width: 664rpx;
|
||||
overflow: hidden;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
-ms-overflow-style: none;
|
||||
/* 去除IE和Edge的默认滚动条 */
|
||||
scrollbar-width: none;
|
||||
|
||||
/* 去除Firefox的默认滚动条 */
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fd_lt {
|
||||
display: flex;
|
||||
transition: transform 0.3s ease;
|
||||
padding-top: 10rpx;
|
||||
|
||||
.fd_tit {
|
||||
text-align: center;
|
||||
padding: 0 15rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 34rpx;
|
||||
font-weight: 400;
|
||||
color: #666;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.act1 {
|
||||
font-size: 36rpx !important;
|
||||
font-weight: 700 !important;
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
|
||||
.fd_set {
|
||||
font-size: 60rpx;
|
||||
}
|
||||
|
||||
.icon-liebiao {
|
||||
margin-top: 10rpx;
|
||||
margin-left: 20rpx;
|
||||
font-size: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.shebei {
|
||||
width: 750rpx;
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
text-align: center;
|
||||
padding-top: 300rpx;
|
||||
font-size: 32rpx;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
|
||||
.swiper_item {
|
||||
height: 100vh;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 660rpx;
|
||||
|
||||
.card_box {
|
||||
margin-top: 34rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.card {
|
||||
// display: flex;
|
||||
// margin-top: 20rpx;
|
||||
width: 680rpx;
|
||||
max-height: 500rpx;
|
||||
padding-bottom: 20rpx;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
// box-shadow: 0rpx 16rpx 40rpx 0rpx rgba(255, 255, 255, 0);
|
||||
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
|
||||
.card_left {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
margin-left: 50rpx;
|
||||
|
||||
.card_left_tit {
|
||||
font-size: 36rpx;
|
||||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||||
font-weight: 600;
|
||||
color: #8883F0;
|
||||
}
|
||||
|
||||
.card_left_sta {
|
||||
|
||||
padding-top: 15rpx;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 23.32rpx;
|
||||
height: 36.47rpx;
|
||||
|
||||
}
|
||||
|
||||
.sta_txt {
|
||||
// margin-left: 15rpx;
|
||||
color: #262B37;
|
||||
font-size: 26rpx;
|
||||
font-family: HarmonyOS Sans SC, HarmonyOS Sans SC;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.card_left_no {
|
||||
padding-top: 15rpx;
|
||||
font-size: 26rpx;
|
||||
font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
|
||||
font-weight: 400;
|
||||
color: #95989D;
|
||||
}
|
||||
}
|
||||
|
||||
.card_right {
|
||||
margin-top: 30rpx;
|
||||
margin-left: auto;
|
||||
margin-right: 50rpx;
|
||||
|
||||
image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user