You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
175 lines
4.1 KiB
175 lines
4.1 KiB
<template>
|
|
<view class="content flex flex-direction">
|
|
<view v-if="healthCode" style="position: relative;">
|
|
<image
|
|
src="/static/img/shanda2.png"
|
|
class="bg1"
|
|
></image>
|
|
<view class="bg-code" @click="getPreviewImg(healthCode)">
|
|
<view class="healthy-code-bg shadow-lg">
|
|
<image class="healthy-code" :src="healthCode"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<image
|
|
v-else
|
|
src="/static/img/shanda1.png"
|
|
class="bg"
|
|
></image>
|
|
|
|
<view :class="healthCode ? 'box1' : 'box'">
|
|
<view
|
|
@tap="openPage('/pages/apply-code/apply-code')"
|
|
class="cu-card flex margin bg-white shadow card-radius"
|
|
hover-class="cc-active"
|
|
v-show="!healthCode"
|
|
>
|
|
<view class="flex align-center padding">
|
|
<view class="round lg cu-avatar icon1">
|
|
<view class="iconfont icon-qrcode"></view>
|
|
</view>
|
|
<view class="padding-left-sm flex-sub">
|
|
<view class="text-xl">领取健康码</view>
|
|
<view class="text-df padding-top-xs description">领取健康码，查看健康状态</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
@tap="openPage('/pages/punch-the-clock/punch-the-clock')"
|
|
class="cu-card flex margin bg-white shadow card-radius"
|
|
hover-class="cc-active"
|
|
>
|
|
<view class="flex align-center padding">
|
|
<view class="round lg cu-avatar icon2">
|
|
<view class="iconfont icon-carryout"></view>
|
|
</view>
|
|
<view class="padding-left-sm flex-sub">
|
|
<view class="text-xl">每日健康打卡</view>
|
|
<view class="text-df padding-top-xs description">山大人员健康情况打卡</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
@tap="openPage('/pages/add-stroke/add-stroke')"
|
|
class="cu-card flex margin bg-white shadow card-radius"
|
|
hover-class="cc-active"
|
|
>
|
|
<view class="flex align-center padding">
|
|
<view class="round lg cu-avatar icon3">
|
|
<view class="iconfont icon-car"></view>
|
|
</view>
|
|
<view class="padding-left-sm flex-sub">
|
|
<view class="text-xl">行程上报</view>
|
|
<view class="text-df padding-top-xs description">外出行程及时上报</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
@tap="openPage('/pages/statistics/statistics')"
|
|
class="cu-card flex margin bg-white shadow card-radius"
|
|
hover-class="cc-active"
|
|
>
|
|
<view class="flex align-center padding">
|
|
<view class="round lg cu-avatar icon4">
|
|
<view class="iconfont icon-linechart"></view>
|
|
</view>
|
|
<view class="padding-left-sm flex-sub">
|
|
<view class="text-xl">统计</view>
|
|
<view class="text-df padding-top-xs description">山大校园疫情统计</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from 'vuex';
|
|
export default {
|
|
name: 'Home',
|
|
data() {
|
|
return {};
|
|
},
|
|
computed: mapState('user', ['userInfo', 'healthCode']),
|
|
methods: {
|
|
//预览图片
|
|
getPreviewImg(image) {
|
|
var imgArr = [];
|
|
imgArr.push(image);
|
|
uni.previewImage({
|
|
urls: imgArr,
|
|
current: imgArr[0],
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.bg {
|
|
width: 100%;
|
|
height: 495rpx;
|
|
}
|
|
|
|
.bg1 {
|
|
width: 100%;
|
|
height: 635rpx;
|
|
}
|
|
|
|
.bg-code {
|
|
display: flex;
|
|
width: 100%;
|
|
position: absolute;
|
|
top: 370rpx;
|
|
|
|
.healthy-code-bg {
|
|
margin: 0 auto;
|
|
width: 230rpx;
|
|
height: 230rpx;
|
|
border-radius: 6px;
|
|
overflow: hidden;
|
|
background: $whiteShadow;
|
|
|
|
.healthy-code {
|
|
margin: 5rpx;
|
|
width: 220rpx;
|
|
height: 220rpx;
|
|
border-radius: 6px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.box {
|
|
position: relative;
|
|
top: -100rpx;
|
|
}
|
|
|
|
.box1 {
|
|
position: relative;
|
|
top: 0;
|
|
}
|
|
|
|
.card-radius {
|
|
border-radius: 15rpx;
|
|
}
|
|
|
|
.description {
|
|
color: $grey;
|
|
}
|
|
|
|
.icon1 {
|
|
background: $iconGreen;
|
|
}
|
|
|
|
.icon2 {
|
|
background: $iconCyan;
|
|
}
|
|
|
|
.icon3 {
|
|
background: $iconBlue;
|
|
}
|
|
|
|
.icon4 {
|
|
background: $iconPurple;
|
|
}
|
|
</style>
|
|
|