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.
149 lines
3.8 KiB
149 lines
3.8 KiB
2 years ago
|
//监管用户
|
||
|
|
<template>
|
||
|
|
<view style="min-height: 100vh;">
|
||
|
|
<view :style="{background: 'url('+applet+'/jg/banner.png) no-repeat',height:'30vh',backgroundSize:'100%'}">
|
||
|
|
<image :src="applet+'/close.png'" style="width: 35px;height: 35px;margin-top: 40px;margin-left: 10px;"
|
||
|
|
@tap="close"></image>
|
||
|
|
</view>
|
||
|
|
<view style="height: calc(100vh - 30vh);padding: 10px;"
|
||
|
|
:style="{background: 'url('+applet+'/jg/bg.png) no-repeat',backgroundSize:'100% 100%'}">
|
||
|
|
<view class="charts-box">
|
||
|
|
<qiun-data-charts type="arcbar" :opts="opts" :chartData="chartData" />
|
||
|
|
</view>
|
||
|
|
<view class="home-left-bottom">
|
||
|
|
<view class="home-left-bottom-item"
|
||
|
|
:style="{background: 'url('+applet+'/jg/unit1_bg.png) no-repeat',backgroundSize:'100% 100%'}"
|
||
|
|
@click="gourl('/pages/massif/addMassif')">
|
||
|
|
<view class="text">
|
||
|
|
<view class="ttt1" >567</view>
|
||
|
|
<view class="ttt">联网单位</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="home-left-bottom-item"
|
||
|
|
:style="{background: 'url('+applet+'/jg/unit2_bg.png) no-repeat',backgroundSize:'100% 100%'}"
|
||
|
|
@click="gourl('/pages/device/binding')">
|
||
|
|
<view class="text">
|
||
|
|
<view class="ttt1" >567</view>
|
||
|
|
<view class="ttt">已打卡单位</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="home-left-bottom-item"
|
||
|
|
:style="{background: 'url('+applet+'/jg/unit3_bg.png) no-repeat',backgroundSize:'100% 100%'}"
|
||
|
|
@click="gourl('/pages/task/add')">
|
||
|
|
<view class="text">
|
||
|
|
<view class="ttt1" >567</view>
|
||
|
|
<view class="ttt">未完全打卡单位</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="home-left-bottom-item"
|
||
|
|
:style="{background: 'url('+applet+'/jg/unit4_bg.png) no-repeat',backgroundSize:'100% 100%'}"
|
||
|
|
@click="gourl('/pages/device/perceptionConf')">
|
||
|
|
<view class="text">
|
||
|
|
<view class="ttt1" >567</view>
|
||
|
|
<view class="ttt">未打卡单位</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
applet: this.$url.data.applet,
|
||
|
|
chartData: {},
|
||
|
|
//您可以通过修改 config-ucharts.js 文件中下标为 ['arcbar'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
|
||
|
|
opts: {
|
||
|
|
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
|
||
|
|
"#ea7ccc"
|
||
|
|
],
|
||
|
|
padding: undefined,
|
||
|
|
title: {
|
||
|
|
name: "80%",
|
||
|
|
fontSize: 35,
|
||
|
|
color: "#2fc25b"
|
||
|
|
},
|
||
|
|
subtitle: {
|
||
|
|
name: "正确率",
|
||
|
|
fontSize: 25,
|
||
|
|
color: "#666666"
|
||
|
|
},
|
||
|
|
extra: {
|
||
|
|
arcbar: {
|
||
|
|
type: "circle",
|
||
|
|
width: 12,
|
||
|
|
backgroundColor: "#E9E9E9",
|
||
|
|
startAngle: 1.5,
|
||
|
|
endAngle: 0.25,
|
||
|
|
gap: 2,
|
||
|
|
linearType: "custom"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
this.loadCharts()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
loadCharts() {
|
||
|
|
let res = {
|
||
|
|
series: [{
|
||
|
|
name: "正确率",
|
||
|
|
color: "#2fc25b",
|
||
|
|
data: 0.8
|
||
|
|
}]
|
||
|
|
};
|
||
|
|
this.chartData = JSON.parse(JSON.stringify(res));
|
||
|
|
},
|
||
|
|
gourl(){
|
||
|
|
|
||
|
|
},
|
||
|
|
close() {
|
||
|
|
uni.removeStorageSync("token")
|
||
|
|
uni.redirectTo({
|
||
|
|
url: '/pages/login/index'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
.charts-box {
|
||
|
|
width: 50%;
|
||
|
|
height: 200px;
|
||
|
|
margin: 0 auto;
|
||
|
|
}
|
||
|
|
.home-left-bottom {
|
||
|
|
width: 100%;
|
||
|
|
height: 22vh;
|
||
|
|
margin-top: 30px;
|
||
|
|
display: flex;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
justify-content: space-between
|
||
|
|
}
|
||
|
|
|
||
|
|
.home-left-bottom-item {
|
||
|
|
height: 45%;
|
||
|
|
width: 48%;
|
||
|
|
.text{
|
||
|
|
width: 60%;
|
||
|
|
height: 100%;
|
||
|
|
margin-left: 40%;
|
||
|
|
.ttt{
|
||
|
|
text-align: center;
|
||
|
|
margin-top: 14%;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
.ttt1{
|
||
|
|
text-align: center;
|
||
|
|
margin-top: 14%;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|