702 lines
16 KiB
Vue
702 lines
16 KiB
Vue
<template>
|
|
<view class="qualityManage">
|
|
<view class="fixedheader">
|
|
<headers :showBack="true">
|
|
<view class="headerName">
|
|
AI预警
|
|
</view>
|
|
</headers>
|
|
</view>
|
|
|
|
<!-- <view class="problemOverview"> -->
|
|
<!-- <view class="overLeft">问题概览</view>
|
|
<view class="overRight">{{nowTime}}</view>
|
|
<view class="problemData">
|
|
<view class="dataBox1 dataStyle">
|
|
<view class="day" v-if="statisticsValue.totalNumDifferYesterday<0">
|
|
较昨日{{statisticsValue.totalNumDifferYesterday||0}}</view>
|
|
<view class="day" v-else>较昨日+{{statisticsValue.totalNumDifferYesterday||0}}</view>
|
|
<view class="num">{{statisticsValue.totalNum}}</view>
|
|
<view class="text">总数</view>
|
|
</view>
|
|
<view class="dataBox2 dataStyle">
|
|
<view class="day" v-if="statisticsValue.oseNumDifferYesterday<0">
|
|
较昨日{{statisticsValue.oseNumDifferYesterday}}</view>
|
|
<view class="day" v-else>
|
|
较昨日+{{statisticsValue.oseNumDifferYesterday||0}}</view>
|
|
<view class="num">{{statisticsValue.overdueNotCloseNum}}</view>
|
|
<view class="text">超期未关闭</view>
|
|
</view>
|
|
<view class="dataBox3 dataStyle">
|
|
<view class="day" v-if="statisticsValue.closeNumDifferYesterday<0">
|
|
较昨日{{statisticsValue.closeNumDifferYesterday||0}}</view>
|
|
<view class="day" v-else>较昨日+{{statisticsValue.closeNumDifferYesterday||0}}</view>
|
|
<view class="num">{{statisticsValue.closeNum}}</view>
|
|
<view class="text">已闭合</view>
|
|
</view>
|
|
<view class="dataBox4 dataStyle">
|
|
<view class="day" v-if="statisticsValue.notCloseNumDifferYesterday<0">
|
|
较昨日{{statisticsValue.notCloseNumDifferYesterday||0}}</view>
|
|
<view class="day" v-else>较昨日+{{statisticsValue.notCloseNumDifferYesterday||0}}</view>
|
|
<view class="num">{{statisticsValue.notCloseNum}}</view>
|
|
<view class="text">未闭合</view>
|
|
</view>
|
|
</view>
|
|
<view class="overDataList">
|
|
待整改
|
|
<span style="margin-left: 70rpx;">{{statisticsValue.rectificationNum}}</span>
|
|
待复查
|
|
<span style="margin-left: 70rpx;">{{statisticsValue.reviewNum}}</span>
|
|
待核验
|
|
<span style="margin-left: 70rpx;">{{statisticsValue.verificationNum}}</span>
|
|
</view>
|
|
<view class="overData">
|
|
<view>待整改<span style="margin-left: 60rpx;">{{statisticsValue.rectificationNum}}</span></view>
|
|
<view>待复查<span style="margin-left: 60rpx;">{{statisticsValue.reviewNum}}</span></view>
|
|
<view>待核验<span style="margin-left: 60rpx;">{{statisticsValue.verificationNum}}</span></view>
|
|
</view> -->
|
|
<!-- </view> -->
|
|
<!-- <view class="commonModules" :style="{paddingTop: (mobileTopHeight + 100) * 1.5 + 'rpx'}">
|
|
<view class="overLeft">常用模块</view>
|
|
<view class="modulesList">
|
|
<view class="menu" @click="goList(1)">
|
|
<image class="icon" style="width: 60rpx; height: 60rpx; margin-right: 7px;"
|
|
src="@/static/newZlgl1.png"></image>
|
|
<view>AI预警列表</view>
|
|
</view>
|
|
<view class="menu" @click="goCapture" v-if="btnAuth">
|
|
<image class="icon" style="width: 60rpx; height: 60rpx; margin-right: 7px;"
|
|
src="@/static/newZlgl2.png"></image>
|
|
<view>手动抓拍</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<view class="sp-menu" :style="{paddingTop: (mobileTopHeight + 100) * 1.5 + 'rpx'}">
|
|
<view class="menu-item" @click="goList(1)">
|
|
<view class="item-icon">
|
|
<image src="@/static/bthgIcon/aiyj.png"></image>
|
|
</view>
|
|
<view class="item-text">
|
|
<text>AI预警列表</text>
|
|
</view>
|
|
</view>
|
|
<view class="menu-item" @click="goCapture" v-if="btnAuth">
|
|
<view class="item-icon">
|
|
<image src="@/static/bthgIcon/newZlgl2.png"></image>
|
|
</view>
|
|
<view class="item-text">
|
|
<text>手动抓拍</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<levitatedsphere :x="100" :y="80"></levitatedsphere>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import levitatedsphere from "@/components/levitatedsphere/levitatedsphere.vue"
|
|
import headers from "../../components/headers/headers.vue"
|
|
import uCharts from '@/components/u-charts/component.vue';
|
|
var _self;
|
|
export default {
|
|
components: {
|
|
uCharts
|
|
},
|
|
data() {
|
|
return {
|
|
mobileTopHeight: 0,
|
|
mendNumber: 0,
|
|
submitNumber: 0,
|
|
totalNum: 0,
|
|
pieChartData: {
|
|
title: {
|
|
name: "1",
|
|
color: '#7cb5ec',
|
|
fontSize: 12,
|
|
offsetY: 0,
|
|
background: 'rgba(0,0,0,0)'
|
|
},
|
|
series: [{
|
|
"data": 0,
|
|
color: '#FA5C53'
|
|
},
|
|
{
|
|
"data": 0,
|
|
color: '#FFCC00'
|
|
},
|
|
{
|
|
"data": 0,
|
|
color: '#6DD400'
|
|
},
|
|
{
|
|
"data": 0,
|
|
color: '#44C5D7'
|
|
},
|
|
]
|
|
},
|
|
manageTypeList: [{
|
|
typeName: '待整改数',
|
|
totalNum: 26
|
|
},
|
|
{
|
|
typeName: '待审核数',
|
|
totalNum: 12
|
|
},
|
|
{
|
|
typeName: '无需整改数',
|
|
totalNum: 20
|
|
},
|
|
{
|
|
typeName: '已闭合数',
|
|
totalNum: 10
|
|
}
|
|
],
|
|
colorList: ['#FA5C53', '#FFCC00', '#6DD400', '#44C5D7'],
|
|
statusBarHeight: 0,
|
|
projectSn: '',
|
|
statisticsValue: {
|
|
totalNum: 0, //总数
|
|
closeNum: 0, //已闭合
|
|
notCloseNum: 0, //未闭合
|
|
overdueNotCloseNum: 0, //超期未关闭
|
|
rectificationNum: 0, //待整改
|
|
reviewNum: 0, //待复查
|
|
verificationNum: 0, //待核验
|
|
totalNumDifferYesterday: 0, //
|
|
oseNumDifferYesterday: 0, //
|
|
closeNumDifferYesterday: 0, //
|
|
notCloseNumDifferYesterday: 0, //
|
|
|
|
|
|
},
|
|
nowTime: '',
|
|
timer: '', //定义一个定时器
|
|
projectInfoType: {},
|
|
btnAuth: false,
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.btnAuth = this.checkBtnPermission({key: 'add', menuPath: '/project/aiAnalysis/warningList'})
|
|
},
|
|
mounted() {
|
|
this.getTime()
|
|
var that = this
|
|
uni.getSystemInfo({
|
|
success(res) {
|
|
that.mobileTopHeight = res.statusBarHeight ? res.statusBarHeight : 0;
|
|
uni.setStorageSync('systemInfo',res)
|
|
console.log(res)
|
|
}
|
|
})
|
|
console.log('this.mobileTopHeight',this.mobileTopHeight)
|
|
// this.getListData();
|
|
// this.loadData();
|
|
},
|
|
onShow() {
|
|
this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
|
|
this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight;
|
|
this.projectInfoType = JSON.parse(uni.getStorageSync('projectInfoType'));
|
|
// this.getListData();
|
|
// this.loadData();
|
|
this.getRecordList()
|
|
},
|
|
methods: {
|
|
//实时时间
|
|
getTime() {
|
|
this.timer = setInterval(() => {
|
|
let timeDate = new Date()
|
|
let year = timeDate.getFullYear()
|
|
let mounth = timeDate.getMonth() + 1
|
|
let day = timeDate.getDate()
|
|
let hours = timeDate.getHours()
|
|
hours = hours >= 10 ? hours : '0' + hours
|
|
let minutes = timeDate.getMinutes()
|
|
minutes = minutes >= 10 ? minutes : '0' + minutes
|
|
let seconds = timeDate.getSeconds()
|
|
seconds = seconds >= 10 ? seconds : '0' + seconds
|
|
let week = timeDate.getDay()
|
|
let weekArr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
|
|
this.nowTime = `${year}-${mounth}-${day} ${hours}:${minutes}:${seconds}`
|
|
}, 1000)
|
|
},
|
|
//获取检查记录数据
|
|
getRecordList() {
|
|
// let data = {
|
|
// projectSn: this.projectSn
|
|
// }
|
|
// this.sendRequest({
|
|
// url: 'xmgl/qualityInspectionRecord/list',
|
|
// method: 'post',
|
|
// data,
|
|
// success: res => {
|
|
// this.statisticsValue = res.result.total
|
|
// console.log('获取检查记录数据', res)
|
|
// }
|
|
// })
|
|
let data = {
|
|
projectSn: this.projectSn
|
|
}
|
|
this.sendRequest({
|
|
url: 'xmgl/aiStatistic/selectAiAnalyseHardWareAlarmTypeCount',
|
|
method: 'post',
|
|
data,
|
|
success: res => {
|
|
// this.statisticsValue = res.result.total
|
|
// console.log('获取检查记录数据', res)
|
|
}
|
|
})
|
|
},
|
|
loadData() {
|
|
if (this.manageTypeList.length > 0) {
|
|
let arr = [];
|
|
this.manageTypeList.forEach((item, index) => {
|
|
let json = {
|
|
"data": item.totalNum,
|
|
color: this.colorList[index]
|
|
};
|
|
arr.push(json)
|
|
});
|
|
this.pieChartData.series = arr;
|
|
};
|
|
},
|
|
//获取记录
|
|
getListData() {
|
|
let that = this;
|
|
let userId = JSON.parse(uni.getStorageSync('userInfo')).userId;
|
|
//获取我整改的巡查记录数量
|
|
this.sendRequest({
|
|
url: 'xmgl/qualityInspectionRecord/selectQualityStatistics',
|
|
method: 'post',
|
|
data: {
|
|
projectSn: this.projectSn
|
|
},
|
|
success: res => {
|
|
console.log(res)
|
|
this.totalNum = res.result.total.totalNum
|
|
let data = res.result
|
|
let arr = [{
|
|
typeName: '待整改数',
|
|
num: data.total.rectificationNum
|
|
},
|
|
{
|
|
typeName: '待审核数',
|
|
num: data.total.reviewNum
|
|
},
|
|
{
|
|
typeName: '无需整改数',
|
|
num: data.total.totalNum - data.total.rectificationNum
|
|
},
|
|
{
|
|
typeName: '已闭合数',
|
|
num: data.total.closeNum
|
|
}
|
|
]
|
|
this.manageTypeList = arr
|
|
let arr2 = []
|
|
this.manageTypeList.forEach((item, index) => {
|
|
let json = {
|
|
"data": item.num,
|
|
color: this.colorList[index]
|
|
};
|
|
arr2.push(json);
|
|
});
|
|
this.pieChartData.series = arr2;
|
|
}
|
|
})
|
|
|
|
},
|
|
//列表页
|
|
goList(type) {
|
|
uni.navigateTo({
|
|
url: "./indexTwo"
|
|
})
|
|
},
|
|
//新增按钮
|
|
goCapture() {
|
|
const url = this.projectInfoType.isEnableDeduct == 1 ? "./manualCapture/index" : "./manualCapture/indexTwo";
|
|
uni.navigateTo({
|
|
url,
|
|
})
|
|
},
|
|
addPrjcet() {
|
|
// 项目质量自检
|
|
uni.navigateTo({
|
|
url: "./projectList"
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.fixedheader :deep( .headerBox ){
|
|
background-color: transparent !important;
|
|
}
|
|
.qualityManage {
|
|
height: 100%;
|
|
background-image: url(@/static/bthgIcon/main_bg1.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 100%;
|
|
padding-bottom: 20rpx;
|
|
.sp-menu {
|
|
margin: 0 38rpx;
|
|
padding-top: 200rpx;
|
|
// height: 1200rpx;
|
|
// height: 1000rpx;
|
|
// background-color: darkred;
|
|
display: grid;
|
|
grid-gap: 24rpx;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
|
|
// grid-template-columns: repeat(auto-fill, 220rpx);
|
|
// place-items: center;
|
|
// justify-content: center;
|
|
.menu-item {
|
|
// width: 220rpx;
|
|
height: 274rpx;
|
|
// background-color: darkblue;
|
|
box-shadow: 0px 8rpx 15rpx 0px rgba(219, 229, 255, 0.6);
|
|
border-radius: 10rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
background-color: #ffffff;
|
|
|
|
.item-icon {
|
|
// width: 220rpx;
|
|
// height: 220rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 14rpx;
|
|
|
|
image {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
}
|
|
}
|
|
|
|
.item-text {
|
|
align-items: center;
|
|
// width: 220rpx;
|
|
height: 54rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
text {
|
|
text-align: center;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.fixedheader {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
z-index: 2;
|
|
|
|
:deep(.headerBox ){
|
|
background: #2b8df3;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.problemOverview {
|
|
// height: 33%;
|
|
height: 10%;
|
|
// box-sizing: border-box;
|
|
border-radius: 20rpx;
|
|
border: 3px solid #fafbfc;
|
|
// margin: 17% 2%;
|
|
// padding: 3% 3%;
|
|
|
|
|
|
|
|
.overRight {
|
|
float: right;
|
|
font-size: 24rpx;
|
|
color: gray;
|
|
}
|
|
|
|
.problemData {
|
|
margin-top: 13%;
|
|
display: flex;
|
|
|
|
.dataStyle {
|
|
width: 300rpx;
|
|
height: 180rpx;
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.dataBox1 {
|
|
background: #ebf1ff;
|
|
border-top-left-radius: 10rpx;
|
|
border-bottom-left-radius: 10rpx;
|
|
|
|
.day {
|
|
font-size: 24rpx;
|
|
color: #3a7bff;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.num {
|
|
font-size: 40rpx;
|
|
font-weight: bold;
|
|
color: #3a7bff;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 24rpx;
|
|
font-weight: bold;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
.dataBox2 {
|
|
background: #fcebec;
|
|
|
|
.day {
|
|
font-size: 24rpx;
|
|
color: #ea3941;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.num {
|
|
font-size: 40rpx;
|
|
font-weight: bold;
|
|
color: #ea3941;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
.dataBox3 {
|
|
background: #eef9f6;
|
|
|
|
.day {
|
|
font-size: 24rpx;
|
|
color: #5ecba7;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.num {
|
|
font-size: 40rpx;
|
|
font-weight: bold;
|
|
color: #5ecba7;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
|
|
.dataBox4 {
|
|
background: #fff4e7;
|
|
border-top-right-radius: 10rpx;
|
|
border-bottom-right-radius: 10rpx;
|
|
|
|
.day {
|
|
font-size: 24rpx;
|
|
color: #ff9810;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.num {
|
|
font-size: 40rpx;
|
|
font-weight: bold;
|
|
color: #ff9810;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.text {
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.overDataList {
|
|
padding-left: 7px;
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
.overDataList>span:not(:last-child)::after {
|
|
content: '|';
|
|
margin: 0 20rpx;
|
|
color: #e9e9e9;
|
|
}
|
|
|
|
.commonModules {
|
|
height: 66%;
|
|
margin: -10% 2%;
|
|
padding: 3% 3%;
|
|
|
|
.modulesList {
|
|
display: flex;
|
|
margin-top: 15%;
|
|
flex-wrap: wrap;
|
|
|
|
.menu {
|
|
text-align: center;
|
|
margin-left: 60rpx;
|
|
margin-bottom: 5%;
|
|
font-size: 28rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.overLeft {
|
|
float: left;
|
|
color: #000;
|
|
font-weight: 600;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
// .smallHeight{
|
|
// // height: calc(100% - 45px);
|
|
// height: 100%;
|
|
// box-sizing: border-box;
|
|
// background: #F6F6F6;
|
|
// }
|
|
|
|
// .qualityManage >>> .headerBox {
|
|
// background-color: #13b98c;
|
|
// }
|
|
// .chart_wrap .chart_box{
|
|
// width: 60%;
|
|
// position: relative;
|
|
// }
|
|
// .chart_wrap{
|
|
// display: flex;
|
|
// font-size: 24rpx;
|
|
// color: #fff;
|
|
// }
|
|
// .chart_box #pieChart{
|
|
// margin-left: 76rpx !important;
|
|
// margin-top: 56rpx !important;
|
|
// }
|
|
// .chart_message{
|
|
// margin-left: 60rpx;
|
|
// padding-top: 60rpx;
|
|
// }
|
|
// .chart_wrap .flex{
|
|
// width: 240rpx;
|
|
// margin: 8rpx 0;
|
|
// }
|
|
// .chart_wrap .num {
|
|
// font-size: 24rpx;
|
|
// color: #fff;
|
|
// }
|
|
// .chart_title{
|
|
// background: #0f9c75;
|
|
// width: 216rpx;
|
|
// height: 216rpx;
|
|
// position: absolute;
|
|
// z-index: 1;
|
|
// border-radius: 50%;
|
|
// left: 116rpx;
|
|
// top: 96rpx;
|
|
// display: flex;
|
|
// flex-direction: column;
|
|
// align-items: center;
|
|
// justify-content: center;
|
|
// }
|
|
// .chart_title span{
|
|
// font-size: 48rpx;
|
|
// }
|
|
// .chart_wrap .bg_color{
|
|
// width: 10rpx;
|
|
// height: 10rpx;
|
|
// border-radius: 50%;
|
|
// margin: 0 32rpx 0 20rpx;
|
|
// }
|
|
// .qualityManage .content {
|
|
// width: 100%;
|
|
// height: 100%;
|
|
// padding: 0px 30rpx 0;
|
|
// box-sizing: border-box;
|
|
// margin-top: -60rpx;
|
|
// z-index: 99;
|
|
// }
|
|
|
|
// .flex {
|
|
// display: flex;
|
|
// align-items: center;
|
|
// }
|
|
|
|
// .flex2 {
|
|
// display: flex;
|
|
// align-items: center;
|
|
// justify-content: space-between;
|
|
// }
|
|
|
|
// .item {
|
|
// width: 100%;
|
|
// box-sizing: border-box;
|
|
// padding: 14px 30rpx;
|
|
// box-shadow: 0 0 20rpx #d3d3d3;
|
|
// margin-bottom: 36rpx;
|
|
// border-radius: 4px;
|
|
// color: rgba(51, 51, 51, 100);
|
|
// font-size: 30rpx;
|
|
// font-family: PingFangSC-Regular;
|
|
// background-color: #FFFFFF;
|
|
// }
|
|
|
|
// .value {
|
|
// font-size: 26rpx;
|
|
// }
|
|
|
|
// .num {
|
|
// margin-right: 10rpx;
|
|
// font-size: 37rpx;
|
|
// color: #4181FE;
|
|
// }
|
|
|
|
// .addBtn {
|
|
// position: absolute;
|
|
// bottom: 100rpx;
|
|
// left: 0;
|
|
// right: 0;
|
|
// width: 60%;
|
|
// margin: 0 auto;
|
|
// text-align: center;
|
|
// padding: 20rpx 0;
|
|
// border-radius: 60rpx;
|
|
// background-color: rgba(65, 129, 254, 0.9);
|
|
// font-size: 30rpx;
|
|
// color: #fff;
|
|
// box-shadow: 0 0 10rpx rgba(65, 129, 254, 0.7);
|
|
// }
|
|
|
|
// .addBtn:active {
|
|
// background-color: #4181FE;
|
|
// }
|
|
// .chart_wrap{
|
|
// width: 100%;
|
|
// height: 480rpx;
|
|
// background-image: url(../../../static/titleBg2.png);
|
|
// background-size: cover;
|
|
// }
|
|
</style> |