examTeamApp/pages/home/home.vue

923 lines
25 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content indexCarList">
<!-- 头部 -->
<headerIndex :isArea="false" v-if="isShow"></headerIndex>
<!-- 蓝牙提示区 -->
<view v-if="userList.length">
<view class="bleTips" v-if="islink==0">
{{textLink}}
</view>
<view class="bleTips2 bleTips" v-else @click="openBluetoothAdapter">
{{textLink}}
</view>
</view>
<view class="notice" v-if="notices.length">
<text>{{$t('index.notice')}}</text>
<!-- -->
<swiper class="swiper" vertical="true" autoplay="true">
<swiper-item v-for="(item,index) in notices" :key="index" @click="$tools.NewsPtype(item)">
<view class='overflow'>{{item.title}}</view>
</swiper-item>
</swiper>
</view>
<!-- 工具区 -->
<view class="tools_l">
<view v-for="(item,index) in toollist" :key="index" class="list" @click="handleTool(index,item.path)"
:class="[language=='zh-Hans'?'':'list2']">
<image :src="item.icon"></image>
<view class="text">{{item.title}}</view>
</view>
</view>
<!-- 身体数据 -->
<view class="report">
<view class="bold mt-10 ml-10 title" v-if="info&&info.top_list.length">
<view>{{$t('index.body')}}</view>
<view class="time">{{info?info.record_time:''}}</view>
</view>
<view class="box" v-if="info&&info.top_list.length" v-for="(item,index) in info.top_list">
<view class="data data2">
<view class="left" :class="[item.difference_val?'':'left2']">
<view class="name bold">{{item.name}}</view>
<view>
<text class="bold mr-5"
:class="[item.difference_val?'size26':'size14']">{{item.value}}</text>{{item.unit}}
</view>
</view>
<view class="right" v-if="item.difference_val">
<view>{{$t("index.ideal")}}{{item.name}}</view>
<view class="lixiang">
<view class="mr-10"><text class="mr-5">{{item.standard_val}}</text>{{item.unit}}</view>
<view>
<icon class="t-icon t-icon-shang" v-if="Number(item.difference_val)>0"></icon>
<icon class="t-icon t-icon-xia" v-if="Number(item.difference_val)<0"></icon>
{{item.difference_val}}
</view>
</view>
</view>
</view>
<view class="myinfoPage">
<view class="desc">
<view v-if="item.desc" class="ming size12">{{item.desc}}</view>
<view :class="[item.list.length?'statuevue':'']" v-if="item.list">
<view class="bi">
<view :style="'left:'+item.offset+'%'" class="peobox">
<view class="xx"></view>
</view>
<view class="item" v-for="(ite , ind) in item.list" :key="ind"
:style="{backgroundColor:ite.color}">
<view class="span1">{{ite.text}}</view>
<view class="span" v-if="ind<item.list.length-1">{{ite.max_val}}
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="item2">
<view class="item2_data" :style="userInfo.stage=='婴儿'?'width:25%':'width:33%'"
v-for="(item,index) in info.top_list" @click="handleToggleTop(item,index)">
<view class="data" :class="[activeHeight==index?'activeHeight':'']">
<view class="c666 mb-5">{{item.name}}</view>
<view><text>{{item.value}}</text>{{item.unit}}</view>
</view>
</view>
<view class="myinfoPage" v-if="infoListTop">
<view class="desc">
<view v-if="infoListTop.desc" class="ming">{{infoListTop.desc}}</view>
<view :class="[infoListTop.list.length?'statuevue':'']" v-if="infoListTop.list">
<view class="bi">
<view :style="'left:'+infoListTop.offset+'%'" class="peobox">
<view class="xx"></view>
</view>
<view class="item" v-for="(ite , ind) in infoListTop.list" :key="ind"
:style="{backgroundColor:ite.color}">
<view class="span1">{{ite.text}}</view>
<view class="span" v-if="ind<infoListTop.list.length-1">{{ite.max_val}}
</view>
</view>
</view>
</view>
</view>
</view>
</view> -->
<view class="nolist" v-if="!info">
<image src="../../static/none.png"></image>
<text>{{$t('index.none')}}</text>
</view>
<view class="box2" v-if="info&&info.body_type_value">
<view>{{$t('index.BodyScore')}}{{info?info.score_value:0}}{{$t("index.number")}}</view>
<view>{{$t('index.BodyType')}}{{info?info.body_type_value:$t("index.no")}}</view>
</view>
<view class="bold mt-10 ml-10" v-if="info&&info.bottom_list.length">{{$t('index.otherData')}}</view>
<view class="ml-10 mr-10" v-if="info&&info.bottom_list.length">
<view class="myinfoPage">
<view class="box1">
<uni-collapse accordion>
<uni-collapse-item class="list" v-for="(item,index) in info.bottom_list" :key="index">
<template v-slot:title>
<uni-list-item class="block">
<view class="name">
<icon class="t-icon iconfont" :class="'t-icon-'+item.key_name">
</icon>
<text>{{item.name}}</text>
</view>
<view class="val" v-if="item.key_name=='key_name'"> - </view>
<view class="val" v-else>{{item.value?item.value:'0'}}{{item.unit}}
</view>
<view class="level">
<view class="btnf"
:style="{backgroundColor:(item.standard=='异常'?'#FFF':item.color)}"
:class="[item.standard=='异常'?'btnC':'']">
{{item.standard=='异常'?'-':item.standard}}
</view>
</view>
</uni-list-item>
</template>
<view class="desc">
<view v-if="item.desc" class="ming size12">{{item.desc}}</view>
<view :class="[item.list.length?'statuevue':'']" v-if="item.list">
<view class="bi" v-if="item.key_name!='kcal'">
<view :style="'left:'+item.offset+'%'" class="peobox">
<view class="xx"></view>
</view>
<view class="item" v-for="(ite , ind) in item.list" :key="ind"
:style="{backgroundColor:ite.color}">
<view class="span1">{{ite.text}}</view>
<view class="span" v-if="ind<item.list.length-1">{{ite.max_val}}
</view>
</view>
</view>
<view v-else>
<view class="kcalClass" v-if="item.list&&item.list.length">
{{$t("index.Standard")}}:{{item.list[0].max_val}}kcal
</view>
</view>
</view>
</view>
</uni-collapse-item>
</uni-collapse>
</view>
</view>
</view>
<!-- 数据参考 -->
<view class="tips c999 ml-15 mb-15" v-if="info.literature.length">
<text>*{{$t("index.dataReference")}}</text>
<text v-for="(item,index) in info.literature" :key="index">
{{item}}
</text>
</view>
<view class="tips2 ml-10" v-if="info.bottom_list">
<uni-icons type="info-filled" color="red"></uni-icons>
{{$t("index.referencetips")}}
</view>
<!-- banner -->
<view class="f_banner" v-if="banner.length">
<swiper class="swiper" indicator-dots="true" autoplay="true">
<swiper-item v-for="(image, index) in banner" :key="index" @click="$tools.NewsPtype(image)">
<image :src="image.pic" mode="aspectFill" />
</swiper-item>
</swiper>
</view>
<!-- 成长建议 -->
<view v-if="cplist.sleeplist.length||cplist.nutritionlist.length" class="ml-10 mr-10">
<view class="bold mt-10">{{$t("index.growthAdvice")}}</view>
<view class="jianyi_box">
<view class="jianyi">
<view @click="proposalnd=1" :class="{active:proposalnd==1}">
<image src="../../static/icon4.png"></image>
<text>{{$t("index.nutrition")}}</text>
</view>
<view @click="proposalnd=2" :class="{active:proposalnd==2}">
<image src="../../static/icon1.png"></image>
<text>{{$t("index.sleep")}}</text>
</view>
<view @click="proposalnd=3" :class="{active:proposalnd==3}">
<image src="../../static/icon3.png"></image>
<text>{{$t("index.movement")}}</text>
</view>
<view @click="proposalnd=4" :class="{active:proposalnd==4}">
<image src="../../static/icon2.png"></image>
<text>{{$t("index.emotion")}}</text>
</view>
</view>
<view>
<view v-if="proposalnd==1&&cplist.nutritionlist.length" class="jianyi-con">
<text v-for="(item,index) in cplist.nutritionlist" :key="index">{{item}}</text>
</view>
<view v-if="proposalnd==2&&cplist.sleeplist.length" class="jianyi-con">
<text v-for="(item,index) in cplist.sleeplist" :key="index">{{item}}</text>
</view>
<view v-if="proposalnd==3&&cplist.sportlist.length" class="jianyi-con">
<text v-for="(item,index) in cplist.sportlist" :key="index">{{item}}</text>
</view>
<view v-if="proposalnd==4&&cplist.moodlist.length" class="jianyi-con">
<text v-for="(item,index) in cplist.moodlist" :key="index">{{item}}</text>
</view>
</view>
</view>
</view>
</view>
<!-- 卡片 -->
<view class="list" v-if="user&&language == 'zh-Hans'">
<view class="bold mt-10 ml-10" v-if="user.card_data_list.length">卡片数据</view>
<view v-for="(item,index) in user.card_data_list">
<!-- 标题 -->
<view class="card box" @click="handlerReport(item)" :style="{'backgroundColor':item.background_color}">
<view class="boxBg">
<image :src="item.background_pic"></image>
</view>
<view class="title border">
<view class="name2">{{item.card_name}}</view>
<view class="time">
{{item.record_time}}
<uni-icons type="right" size="20" v-if="item.inside_data[0].value"></uni-icons>
</view>
</view>
<view class="target item">
<view class="bold size16 c666" v-if="item.acd_id!=2">本次数据</view>
<view class="bold size14" v-else>
<text class="size32">{{item.inside_data[1].value}}</text>
{{item.inside_data[1].unit}}
</view>
<view class="btnGroup">
<view class="blueBtn" v-if="item.acd_id==2" @click.stop
@click="$Bluetooth.handleDevicesMac(item.device_determine,item.acd_id)">蓝牙连接
</view>
<view class="blueBtn" v-else-if="item.acd_id==6">蓝牙连接</view>
<view v-else></view>
<view class="orangeBtn" @click="handlerRecord(item.acd_id)" @click.stop>手动记录</view>
</view>
</view>
<!-- 内容 -->
<view class="item title"
:style="{'justifyContent':item.inside_data.length>2?'space-between':'center'}">
<view v-for="(ite,ind) in item.inside_data" :class="[item.inside_data.length>3?'item2':'']">
<view class="weight"><text>{{ite.value?ite.value:'-'}}</text>{{ite.unit}}</view>
<view class="name mt-5" v-if="item.acd_id!=8">{{ite.name}}</view>
</view>
</view>
</view>
</view>
</view>
<!-- 设置数据卡片 -->
<view class="setcard" @click="handleCard" v-if="userList.length&&user.measure_model==1&&language == 'zh-Hans'">
设置数据页卡片
</view>
<!-- 弹框广告 -->
<view class="wrapper" v-if="isCoupon">
<view class="bg" @click="isCoupon=false">
<view class="edit">
<swiper class="text" autoplay="true">
<swiper-item v-for="(ite,ind) in pop" :key="ind" @click="$tools.NewsPtype(ite)">
<image :src="ite.pic" mode="aspectFill" />
<view class="bold mt-5">{{ite.title}}</view>
</swiper-item>
</swiper>
<uni-icons type="clear" @click="isCoupon=false" size="40" class="clear"></uni-icons>
</view>
</view>
</view>
<!-- <view class="nolist" @click="handleAddUser" :style="{'marginTop':isShow?'150px':'0'}">
<image src="../../static/none.png"></image>
<text>请先添加成员</text>
</view> -->
<!-- 手动 -->
<record :rtype="rtype"></record>
</view>
</template>
<script>
import {
mapState
} from "vuex";
let myTime;
import headerIndex from "@/element/headerIndex.vue"
import record from '@/element/manuallyAdd/record.vue';
import {
I18nT
} from "vue-i18n";
export default {
data() {
return {
rtype: 0,
transition: 1.6,
isShow: true,
infoListTop: {},
activeHeight: 0,
deviceName: "",
deviceId: "",
serviceId: "",
write: "",
notify: "",
devicesList: [],
islink: 0, //-1重新连接
textLink: "",
proposalnd: 1,
unit: "",
language: "",
toolList: [{
"icon": "/static/q2.png",
"title": "中招估分",
"path": "/pages/score/score"
}, {
"icon": "/static/q4.png",
"title": this.$t("index.bmi"),
"path": "/pageTwo/home/bmi"
},
{
"icon": "/static/q6.png",
"title": this.$t("common.titleInheritHeighet"),
"path": "/pageTwo/home/inheritHeighet"
},
{
"icon": "/static/q1.png",
"title": this.$t("index.skipping"),
"path": "/pages/skiping/skip?acd_id=6"
},
{
"icon": "/static/q10.png",
"title": this.$t("index.vitalcapacity"),
"path": "/pages/lunging/vitalcapacity?acd_id=8"
},
{
"icon": "/static/q3.png",
"title": this.$t("common.titleContrast"),
"path": "/pageTwo/compk/contrast?acd_id=2"
},
{
"icon": "/static/q5.png",
"title": this.$t("common.titleBody"),
"path": "/pages/body/body?acd_id=2"
},
{
"icon": "/static/q7.png",
"title": this.$t("index.manualRecording"),
"path": ""
},
{
"icon": "/static/q8.png",
"title": this.$t("common.titleHistory"),
"path": "/pageTwo/history/history?acd_id=2"
},
{
"icon": "/static/q9.png",
"title": this.$t("common.titleManage"),
"path": "/pageTwo/my/manage"
}
]
}
},
components: {
record,
headerIndex
},
computed: {
...mapState(["user", "familayList", 'MeasureResult', "bannerCon", "isConnected", "isBluetoothTyle"]),
userInfo() {
return this.user
},
userList() {
return this.familayList
},
cplist() {
return this.MeasureResult.cplist
},
info() {
let that = this
that.infoListTop = that.MeasureResult.top_list[0] ? that.MeasureResult.top_list[0] : {}
that.activeHeight = 0
return that.MeasureResult
},
toollist() {
let list = this.toolList
return uni.getStorageSync('language') == "zh-Hans" ? list : list.splice(1, 7)
},
isCoupon() {
return this.bannerCon.isCoupon
},
notices() {
return this.bannerCon.notices
},
banner() {
return this.bannerCon.banner
},
pop() {
return this.bannerCon.pop
},
},
onLoad() {
let that = this
uni.onBluetoothAdapterStateChange(function(res) {
that.$store.commit("changeBluetooth", res.available);
})
that.openBluetoothAdapter()
that.onBLEConnectionStateChange()
},
onPullDownRefresh() {
let that = this
that.isShow = true
that.onBLEConnectionStateChange()
uni.stopPullDownRefresh()
},
watch: {
isConnected: function() {
let that = this
console.log("isConnected", that.isConnected)
if (!that.isConnected) {
that.textLink = that.$t("linkBluetooth.startlinkBluetooth")
that.islink = -1
}
},
isBluetoothTyle: function() {
let that = this
console.log("isBluetoothTyle", that.isBluetoothTyle)
if (!that.isBluetoothTyle) {
that.textLink = that.$t("linkBluetooth.startlinkBluetooth")
that.islink = -1
}
},
},
onShow() {
let that = this
that.language = uni.getStorageSync('language')
uni.onBluetoothAdapterStateChange(function(res) {
that.$store.commit("changeBluetooth", res.available);
})
if (uni.getStorageSync('isBle') && uni.getStorageSync('isBle') == true) {
that.openBluetoothAdapter()
uni.setStorageSync('isBle', false)
console.log("首次添加玩用户后初始化蓝牙", uni.getStorageSync('isBle'))
}
},
methods: {
detail(ite) {
uni.navigateTo({
url: "/pageTwo/webview/webview?id=" + ite.id + '&url=' + ite.jump_url
})
},
// 设置数据页卡片
handleCard() {
uni.navigateTo({
url: "/pageTwo/cardList/card"
})
},
handleTool(ind, path) {
let that = this
console.log("path", path)
if (path == "") {
that.handlerRecord(2)
} else {
that.navTo(path)
}
},
// 报告页
handlerReport(item) {
console.log("item", item)
let device = item.device_determine ? 1 : 0
uni.navigateTo({
url: item.page_url_report + "?acd_id=" + item.acd_id + '&device=' + device
})
},
// 手动添加
handlerRecord(id) {
this.rtype = id
this.$store.commit('changeRecord', true)
},
// 添加成员
handleAddUser() {
uni.navigateTo({
url: "/pageTwo/my/userInfo"
})
},
handleToggleTop(item, index) {
this.infoListTop = item
this.activeHeight = index
},
navTo(url) {
console.log("url", url)
uni.navigateTo({
url: url
})
},
// 初始化蓝牙
openBluetoothAdapter() {
let that = this
that.devicesList = []
uni.openBluetoothAdapter({
success: e => {
that.islink = 0
that.textLink = that.$t("linkBluetooth.searchBluetooth")
console.log("蓝牙初始化成功")
that.startBluetoothDeviceDiscovery()
},
fail: err => {
that.islink = -1
that.textLink = that.$tools.getBluetoothAdapter(err)
console.log('初始化蓝牙失败:' + err);
return
}
});
},
// 开始搜寻附近的蓝牙外围设备
startBluetoothDeviceDiscovery() {
let that = this
uni.startBluetoothDevicesDiscovery({
allowDuplicatesKey: true, //是否允许重复上报同一设备
interval: 200,
success: res => {
console.log("搜索设备")
that.onBluetoothDeviceFound();
},
fail: res => {}
});
},
/**
* 发现外围设备
*/
onBluetoothDeviceFound() {
var that = this;
uni.onBluetoothDeviceFound(res => {
res.devices.forEach(device => {
console.log("name", device.name)
if (!device.name && !device.localName) {
device.advertisData = device.advertisData ? device.advertisData : ''
let value = that.$tools.ab2hex(device.advertisData, "")
let type = value.substring(0, 2)
let id = value.substring(12, 16)
if (type.toLowerCase() == 'c0') {
console.log(value, "id", id)
clearTimeout(myTime);
that.deviceName = "c00002"
device.deviceId = device.deviceId
that.handleDevice(device)
}
return
}
if (device.name.indexOf("G02") != -1) {
clearTimeout(myTime);
that.deviceId = device.deviceId;
that.$Bluetooth.stopBluetoothDevicesDiscovery()
that.handleDevice(device)
return
}
if (device.name.indexOf("Chipsea_BLE") != -1) {
clearTimeout(myTime);
that.deviceId = device.deviceId;
that.$Bluetooth.stopBluetoothDevicesDiscovery()
that.handleDevice(device)
return
}
if (device.name.indexOf('YPC') != -1) {
clearTimeout(myTime);
device.deviceId = device.deviceId
that.$Bluetooth.stopBluetoothDevicesDiscovery()
that.handleDevice(device)
return
}
if (device.name.toLowerCase().indexOf('da') != -1) {
clearTimeout(myTime);
device.deviceId = device.deviceId
that.handleDevice(device)
return
}
if (device.name.toLowerCase().indexOf('pcl') != -1 || (device.localName && device
.localName.toLowerCase().indexOf('pcl') != -1)) {
clearTimeout(myTime);
that.deviceName = device.name
that.deviceId = device.deviceId;
that.handleDevice(device)
return
}
})
});
that.handleMyTime()
},
handleDevice(device) {
let that = this
const foundDevices = that.devicesList
const idx = that.$tools.inArray(foundDevices, "deviceId", device.deviceId)
console.log("1111111", device.name)
if (idx === -1) {
// 体脂秤
if (device.name.toLowerCase().indexOf("pcl") != -1) {
that.devicesList.push(device)
uni.navigateTo({
url: "/pageTwo/devices/PCL?deviceId=" + device.deviceId
})
return
}
// 思迈德协议,假阻抗,体脂秤
if (that.deviceName == "c00002") {
that.devicesList.push(device)
uni.navigateTo({
url: "/pageTwo/devices/PCL22?deviceId=" + device.deviceId
})
return
}
// 思迈德协议,假阻抗,体脂秤
if (device.name.toLowerCase() == "da") {
that.devicesList.push(device)
uni.navigateTo({
url: "/pageTwo/devices/PCL22S?deviceId=" + device.deviceId
})
return
}
// 身高仪
if (device.name.indexOf("G02") != -1) {
that.devicesList.push(device)
uni.navigateTo({
url: "/pageTwo/devices/G02?deviceId=" + device.deviceId
})
return
}
// 跳绳
if (device.name.indexOf("YPC") != -1) {
that.devicesList.push(device)
uni.navigateTo({
url: "/pages/skiping/skip?deviceId=" + device.deviceId
})
return
}
// 婴儿秤
if (device.name.indexOf("Chipsea_BLE") != -1) {
that.devicesList.push(device)
uni.navigateTo({
url: "/pageTwo/devices/B20?deviceId=" + device.deviceId
})
return
}
}
},
handleMyTime() {
var that = this;
myTime = setTimeout(function() {
if (!that.devicesList.length) {
that.islink = -1
that.textLink = that.$t("linkBluetooth.Nodevicefound")
clearTimeout(myTime);
that.$Bluetooth.stopBluetoothDevicesDiscovery()
}
}, 50000);
},
// 从广播秤返回后更改蓝牙状态
getBlereload() {
let that = this
that.islink = -1
that.textLink = that.$t("linkBluetooth.remeasure")
},
// 监听蓝牙连接状态
onBLEConnectionStateChange() {
let that = this
uni.onBLEConnectionStateChange(function(res) {
console.log("监听蓝牙连接状态", res.connected)
that.$store.commit("changeConnected", res.connected);
})
},
/**
* 断开蓝牙模块
*/
closeBluetoothAdapter() {
let that = this;
uni.closeBluetoothAdapter({
success: res => {
console.log('蓝牙模块关闭成功');
}
})
},
/**
* 断开蓝牙连接
*/
closeBLEConnection() {
var that = this;
uni.closeBLEConnection({
deviceId: that.deviceId,
success: res => {
console.log('断开蓝牙连接成功');
that.$store.commit("changeConnected", false);
}
});
},
}
}
</script>
<style lang="scss" scoped>
@import "@/scss/body.scss";
/deep/.header {
width: 100%;
.top {
color: #fff;
background: $maincolor ;
}
}
/deep/.cityList {
margin-top: -36px;
}
/deep/.box {
padding: 10px 10px 1px !important;
}
.list {
margin-top: 0rpx;
padding: 0;
}
.blueBtn {
color: #fff;
padding: 5px !important;
background-color: #2397f1;
}
.orangeBtn {
color: #fff;
padding: 5px !important;
background-color: #FF974C;
}
.border {
border-bottom: 1px solid #f7f7f7;
}
.target {
height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
position: relative;
z-index: 99;
.bold {
width: 45%;
text-align: left;
}
.btnGroup {
width: 50%;
display: flex;
justify-content: space-between;
}
}
.item {
position: relative;
z-index: 99;
}
.size32 {
font-size: 80rpx;
}
.card {
position: relative;
overflow: hidden;
}
.boxBg {
width: 250rpx;
height: 215rpx;
position: absolute;
right: 15px;
z-index: 9;
bottom: -50rpx;
image {
width: 100%;
height: 100%;
}
}
.content {
min-height: 100vh;
padding-bottom: 15px;
background-color: #f7f7f7;
}
.bleTips {
height: 35px;
line-height: 35px;
margin: 15px 10px 10px;
background: #fff;
border-radius: 10px;
text-align: center;
box-shadow: 0px 1px 5px 2px #dfe2e1fc;
}
.bleTips2 {
background: #fea606;
color: #fff;
}
// 工具
.tools_l {
width: 100%;
display: flex;
flex-wrap: wrap;
padding-top: 15px;
background: #fff;
justify-content: space-between;
.list {
width: 20%;
text-align: center;
font-size: 14px;
margin-bottom: 20px;
.text {
margin-top: 5px;
color: #666;
font-size: 14px;
}
}
image {
width: 35px;
height: 35px;
}
}
.activeHeight {
padding-bottom: 10px;
border-bottom: 2px solid $maincolor;
}
.title {
display: flex;
margin-right: 10px;
justify-content: space-between;
}
.data2 {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
height: 60px;
line-height: 30px;
.name {
width: 100%;
}
.left2 {
width: 100%;
display: flex;
justify-content: space-between;
}
.right {
width: 50%;
display: flex;
flex-wrap: wrap;
font-size: 14px;
.lixiang {
display: flex;
align-items: baseline;
// justify-content: space-between;
view {
display: flex;
align-items: baseline;
}
text {
color: $maincolor;
font-size: 22px;
font-weight: bold;
}
}
}
}
.list2 {
width: 22% !important;
margin-bottom: 10px !important;
}
.list2:nth-child(n+5) {
width: 33% !important;
}
</style>