hldy_app/pages/assess/index.vue

161 lines
3.8 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="backgroundContainer">
<view class="assess-title">
<view class="left-icons">
<image class="left-icons-img" :src="`/static/index/undericons/doublekuai.png`" />
<view class="right-icons-font">服务考核-</view>
<view class="right-icons-text">批量考核</view>
</view>
<view class="right-icons">
<image class="right-icons-img" :src="`/static/index/undericons/man.png`" />
<view :class="darkFans?`right-icons-font-dark`: `right-icons-font` ">王金福</view>
<image class="right-icons-img-icon"
:src="darkFans?`/static/index/undericons/face.png`:`/static/index/undericons/facelight.png`" />
<image class="right-icons-img-icon"
:src="darkFans?`/static/index/undericons/hand.png`:`/static/index/undericons/handlight.png`" />
<image class="right-icons-img-icon" @click="jumpTo"
:src="darkFans?`/static/index/undericons/out.png`:`/static/index/undericons/outlight.png`" />
</view>
</view>
<view class="assess-another">
<view class="left-contain">
<view class="calendar">
<calendar />
</view>
</view>
</view>
<!-- <calendar /> -->
<!-- <view v-for="(item,index) in menuArray" :key="index">
<view class="menuCard" @click="jumpTo(item.url)">
{{item.name}}
</view>
</view>
<view class="small-button">
服务考核
</view> -->
</view>
<!-- 自动更新组件 -->
</template>
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount, computed, nextTick, } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import calendar from '@/component/public/calendar.vue'
// 暗黑模式
const darkFans = ref(false);
const zyupgrade = ref(null)
type darkFanstype = {
darkFans : boolean
}
const jumpTo = (url : string) => {
uni.navigateBack()
// uni.navigateTo({
// url: url
// });
}
// 生命周期钩子
onLoad((options : darkFanstype) => {
// 为uni.navigateBack()啥这么写因为options给我返回的是字符串这个`false`,只能这么写,前端中`false`是true
// uni.navigateBack()
});
// 生命周期钩子
onShow(() => {
zyupgrade.value?.check_update()
});
</script>
<style scoped lang="less">
.backgroundContainer {
position: relative;
width: 100%;
height: 100vh;
background-image: url('/static/index/lightbgcnew.png');
background-size: cover;
background-position: center center;
overflow: hidden;
}
.assess-title {
margin-top: 60rpx;
width: 100%;
height: 60rpx;
display: flex;
align-items: center;
justify-content: space-between;
.right-icons {
display: flex;
align-items: center;
float: right;
height: 70rpx;
margin-right: 40rpx;
.right-icons-font {
margin-left: 10rpx;
margin-right: 10rpx;
font-size: 35rpx;
margin-top: -15rpx;
}
.right-icons-font-dark {
color: #fff;
margin-left: 10rpx;
margin-right: 10rpx;
font-size: 35rpx;
margin-top: -15rpx;
}
.right-icons-img {
width: 80rpx;
height: 80rpx;
margin-left: 10rpx;
margin-right: 10rpx;
margin-top: -20rpx;
}
.right-icons-img-icon {
width: 60rpx;
height: 80rpx;
margin-left: 8rpx;
}
}
.left-icons{
display: flex;
margin-left: 40rpx;
.left-icons-img {
width: 70rpx;
height: 70rpx;
}
.right-icons-font {
font-weight: 700;
font-size: 35rpx;
margin-left: 10rpx;
margin-top: 10rpx;
}
.right-icons-text{
font-size: 35rpx;
margin-top: 10rpx;
}
}
}
.assess-another{
width: 100%;
height: calc(100vh - 120rpx);
margin-top: 10rpx;
display: flex;
margin-left: 50rpx;
.left-contain{
height: 100%;
width: 600rpx;
.calendar{
width: 100%;
height: 650rpx;
background: linear-gradient(to top,#F4F3FF,#FFFFFF,#ECEFFF);
border-radius: 25rpx;
}
}
}
</style>