shenzhen-dev #2
@ -13,7 +13,7 @@ VITE_API_URL = 'http://192.168.34.221:9111'
|
||||
# 沈阳合盈线上
|
||||
# VITE_API_URL = "http://101.43.164.214:45022"
|
||||
# 演示平台
|
||||
# VITE_API_URL = 'http://jxj.zhgdyun.com:9809'
|
||||
VITE_API_URL = 'http://jxj.zhgdyun.com:9809'
|
||||
# 百色七参数线上地址
|
||||
# VITE_API_URL = 'http://101.43.164.214:11111'
|
||||
# 七参数标准版(测试平台)
|
||||
|
||||
@ -1,6 +1,35 @@
|
||||
<template>
|
||||
<div class="centerBottom">
|
||||
|
||||
<div class="cbHeader">
|
||||
<div class="cbHeaderInfo">
|
||||
<div class="cubeIcon"></div>
|
||||
<div>公告提示</div>
|
||||
</div>
|
||||
<div class="cbHeaderLine"></div>
|
||||
</div>
|
||||
<div class="cbContent">
|
||||
<el-scrollbar height="370">
|
||||
<div class="item" v-for="(item,index) in listData" :key="index">
|
||||
<div class="itemHead">
|
||||
<div class="itemHeadInner" v-if="item.type === 1">{{item.header}}</div>
|
||||
<div class="itemHeadInner2" v-if="item.type === 3">{{item.header}}</div>
|
||||
<div class="itemContent">
|
||||
<el-tooltip class="box-item" effect="dark" :content="item.content" placement="top-start">
|
||||
<text style="margin-left:10px">{{item.content}}</text>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="itemContent">
|
||||
<el-tooltip class="box-item" effect="dark" :content="item.content" placement="top-start">
|
||||
{{item.content}}
|
||||
</el-tooltip>
|
||||
</div> -->
|
||||
<div class="itemTime">
|
||||
<text class="timeInfo">{{item.startTime + '-' + item.endTime}}</text>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -10,85 +39,24 @@ import { ref, watch, onMounted } from "vue";
|
||||
import { getStageOption } from "@/api/modules/projectOverview";
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
const progressList = ref([
|
||||
// {
|
||||
// name: "施工证获取",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "土方开挖",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "桩基",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "支护开始",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "垫层完成",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "正负零",
|
||||
// status: 0
|
||||
// },
|
||||
// {
|
||||
// name: "工程达到预售条件",
|
||||
// status: 0
|
||||
// }
|
||||
] as any);
|
||||
// ts
|
||||
type Props = {
|
||||
projectData?: any; // 传入项目信息
|
||||
};
|
||||
// withDefaults 定义默认值(传入的数据类型同默认值)
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
projectData: {}
|
||||
});
|
||||
// 项目信息
|
||||
const projectData = ref({} as any);
|
||||
|
||||
watch(
|
||||
() => props.projectData,
|
||||
newVal => {
|
||||
// console.log(newVal, "newVal");
|
||||
if (newVal) {
|
||||
// props.xData = newVal;
|
||||
projectData.value = newVal;
|
||||
console.log("当前阶段", projectData.value.constructionStage);
|
||||
if (progressList.value.length > 0) {
|
||||
progressList.value[projectData.value.constructionStage - 1].status = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
let listData = ref([
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控胜多负少v现场v在时代广场彼此相伴',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在sdasdasdasdasdasdasdasczxczxcz作前，应对吊装设备进行安全把控',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在sdasdasdasdasdasdasdasczxczxcz作前，应对吊装设备进行安全把控',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在sdasdasdasdasdasdasdasczxczxcz作前，应对吊装设备进行安全把控',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在sdasdasdasdasdasdasdasczxczxcz作前，应对吊装设备进行安全把控',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在sdasdasdasdasdasdasdasczxczxcz作前，应对吊装设备进行安全把控',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
{header: '硬件警报',type: 3,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设sdasdasdasdasdasdasdasczxczxcz之间的衔接进行全面检查，以防止',startTime: '2024-04-01',endTime:"2024-04-20"},
|
||||
])
|
||||
|
||||
//获取里程碑option
|
||||
const getProgressOption = async () => {
|
||||
const res: any = await getStageOption({ dictionaryEncoding: "project_construction_stage", projectSn: store.sn });
|
||||
if (res.result.length > 0) {
|
||||
let newArray = res.result.map((item: any) => {
|
||||
return {
|
||||
name: item.name,
|
||||
status: 0
|
||||
};
|
||||
});
|
||||
progressList.value = newArray;
|
||||
console.log(projectData.value, "里程碑option", res);
|
||||
if (projectData.value.constructionStage) {
|
||||
progressList.value[projectData.value.constructionStage - 1].status = 1;
|
||||
}
|
||||
}
|
||||
};
|
||||
//将方法暴露给父组件
|
||||
defineExpose({
|
||||
getProgressOption
|
||||
})
|
||||
onMounted( async () => {
|
||||
getProgressOption();
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -97,5 +65,98 @@ onMounted( async () => {
|
||||
background: url("@/assets/images/commandScreen/card-center-bottom.png") no-repeat;
|
||||
// background: #fff;
|
||||
background-size: 100% 100%;
|
||||
// width: 100%;
|
||||
// height: 60%;
|
||||
// background-color: #fff;
|
||||
padding: 10px 20px;
|
||||
position: relative;
|
||||
// padding-top: 15px;
|
||||
.cbHeader{
|
||||
width:100%;
|
||||
height: 40px;
|
||||
// background-color: darkred;
|
||||
.cbHeaderInfo{
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.cubeIcon{
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
// background-color: #fff;
|
||||
background: url("@/assets/images/commandScreen/head-cube.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// margin-left: -5px;
|
||||
margin: 0 3px 0 -5px;
|
||||
}
|
||||
}
|
||||
.cbHeaderLine{
|
||||
height: 4px;
|
||||
width: 100%;
|
||||
// background-color: darkblue;
|
||||
background: url("@/assets/images/commandScreen/head-line.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.cbContent{
|
||||
width: 100%;
|
||||
height: calc(100% - 40px);
|
||||
// background: #fff;
|
||||
.item{
|
||||
width: 100%;
|
||||
line-height: 130%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// justify-content: flex-start;
|
||||
justify-content: space-between;
|
||||
// background-color: green;
|
||||
color: #fff;
|
||||
.itemHead{
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
width: 75%;
|
||||
.itemHeadInner{
|
||||
border: 1px solid #f77c7d;
|
||||
box-shadow: 0 0 0 1px #f77c7d;
|
||||
background: rgba(247,124,125, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.itemHeadInner2{
|
||||
font-size: 16px;
|
||||
border: 1px solid #0db027;
|
||||
box-shadow: 0 0 0 1px #0db027;
|
||||
background: rgba(13,176,39, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.itemContent{
|
||||
margin-left: 10px;
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.itemTime{
|
||||
// background-color: #fff;
|
||||
width: 25%;
|
||||
font-size: 16px;
|
||||
.timeInfo{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -10,8 +10,6 @@
|
||||
</div>
|
||||
<div class="right">
|
||||
<rightAll class="rightAll"></rightAll>
|
||||
<rightCenter class="rightCenter"></rightCenter>
|
||||
<rightBottom class="rightBottom"></rightBottom>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -51,11 +49,11 @@ const projectData = ref(null as any);
|
||||
margin: 0 1%;
|
||||
|
||||
.centerTop {
|
||||
height: 55%;
|
||||
height: 53.8%;
|
||||
// margin-bottom: 3%;
|
||||
}
|
||||
.centerBottom {
|
||||
height: 45%;
|
||||
height: 44.2%;
|
||||
margin: 2% 0 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -12,24 +12,19 @@
|
||||
<div class="cbHeader">
|
||||
<div class="cbHeaderInfo">
|
||||
<div class="cubeIcon"></div>
|
||||
<div>教育智能提示</div>
|
||||
<div>隐患智能分析</div>
|
||||
</div>
|
||||
<div class="cbHeaderLine"></div>
|
||||
</div>
|
||||
<div class="cbContent">
|
||||
<el-scrollbar height="270">
|
||||
<el-scrollbar height="278">
|
||||
<div class="item" v-for="(item,index) in listData" :key="index">
|
||||
<div class="itemHead">
|
||||
<div class="itemHeadInner" v-if="item.type === 1">{{item.header}}</div>
|
||||
<div class="itemHeadInner2" v-if="item.type === 2">{{item.header}}</div>
|
||||
</div>
|
||||
<div class="itemContent">
|
||||
<el-tooltip
|
||||
class="box-item"
|
||||
effect="dark"
|
||||
:content="item.content"
|
||||
placement="top-start"
|
||||
>
|
||||
<el-tooltip class="box-item" effect="dark" :content="item.content" placement="top-start" >
|
||||
{{item.content}}
|
||||
</el-tooltip>
|
||||
</div>
|
||||
@ -64,7 +59,7 @@ let listData = ref([
|
||||
])
|
||||
|
||||
let questionTotal = ref(0 as any);
|
||||
let dataList = ref([
|
||||
let dataList2 = ref([
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
@ -99,6 +94,7 @@ let dataList = ref([
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
function Pie() {
|
||||
let dataArr = [];
|
||||
for (var i = 0; i < 150; i++) {
|
||||
@ -131,7 +127,7 @@ function Pie() {
|
||||
return dataArr;
|
||||
}
|
||||
|
||||
function drawEchart() {
|
||||
function drawEchart2() {
|
||||
let echartsTest = echarts.init(document.getElementById("echartsEdu"));
|
||||
let option = {
|
||||
tooltip: {
|
||||
@ -187,16 +183,16 @@ function drawEchart() {
|
||||
}
|
||||
}
|
||||
},
|
||||
data: dataList.value.map(item => {
|
||||
data: dataList2.value.map(item => {
|
||||
if (item.show) {
|
||||
return item.name;
|
||||
}
|
||||
}),
|
||||
formatter: function (data) {
|
||||
if (dataList.value && dataList.value.length) {
|
||||
for (var i = 0; i < dataList.value.length; i++) {
|
||||
if (data === dataList.value[i].name) {
|
||||
var value = dataList.value[i].value;
|
||||
if (dataList2.value && dataList2.value.length) {
|
||||
for (var i = 0; i < dataList2.value.length; i++) {
|
||||
if (data === dataList2.value[i].name) {
|
||||
var value = dataList2.value[i].value;
|
||||
var percentage = value + "%";
|
||||
return "{name| " + data + "} {gap| }" + "{value|" + value + " " + "}";
|
||||
}
|
||||
@ -332,7 +328,7 @@ function drawEchart() {
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: dataList.value
|
||||
data: dataList2.value
|
||||
},
|
||||
{
|
||||
type: "pie",
|
||||
@ -356,10 +352,10 @@ function drawEchart() {
|
||||
// const safeData = ref(null as any);
|
||||
const qualityInfo = async () => {
|
||||
const res: any = await selectQualityStatisticsApi({ projectSn: store.sn });
|
||||
dataList.value[0].value = res.result.total.rectificationNum;
|
||||
dataList.value[1].value = res.result.total.totalNum - res.result.total.rectificationNum;
|
||||
dataList2.value[0].value = res.result.total.rectificationNum;
|
||||
dataList2.value[1].value = res.result.total.totalNum - res.result.total.rectificationNum;
|
||||
questionTotal.value = res.result.total.totalNum;
|
||||
drawEchart();
|
||||
drawEchart2();
|
||||
};
|
||||
//将方法暴露给父组件
|
||||
defineExpose({
|
||||
@ -437,7 +433,7 @@ onMounted( async () => {
|
||||
// background: #fff;
|
||||
.item{
|
||||
width: 100%;
|
||||
line-height: 160%;
|
||||
line-height: 130%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
|
||||
@ -5,19 +5,21 @@
|
||||
人员履职情况分析
|
||||
</div>
|
||||
<div class="hRight">
|
||||
<el-date-picker style="width: 85%" v-model="value1" type="daterange" range-separator="To" start-placeholder="Start date" end-placeholder="End date" :size="size"/>
|
||||
<el-date-picker style="width: 85%" v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :size="size"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
|
||||
<el-tab-pane label="整改人" name="first"></el-tab-pane>
|
||||
<el-tab-pane label="检查人" name="second"></el-tab-pane>
|
||||
<el-tab-pane label="按分包单位分析" name="third"></el-tab-pane>
|
||||
<el-tab-pane :label="'整改人'" name="first"></el-tab-pane>
|
||||
<el-tab-pane :label="'检查人'" name="second"></el-tab-pane>
|
||||
<el-tab-pane :label="'按分包单位分析'" name="third"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="tabList">
|
||||
<div>排名</div>
|
||||
<div>姓名</div>
|
||||
<div>整改数量</div>
|
||||
<div v-if="activeIndex === '0' || activeIndex === '1'">姓名</div>
|
||||
<div v-if="activeIndex === '2'">分组单位</div>
|
||||
<div v-if="activeIndex === '0' || activeIndex === '2'">整改数量</div>
|
||||
<div v-if="activeIndex === '1'">发起隐患处</div>
|
||||
<div>整改率</div>
|
||||
<div>及时整改率</div>
|
||||
</div>
|
||||
@ -47,9 +49,18 @@ import { getStageOption } from "@/api/modules/projectOverview";
|
||||
import type { TabsPaneContext } from 'element-plus'
|
||||
|
||||
const activeName = ref('first')
|
||||
const activeIndex = ref('1' as any)
|
||||
let dateRange = ref([] as any)
|
||||
|
||||
const handleClick = (tab: TabsPaneContext, event: Event) => {
|
||||
console.log(tab, event)
|
||||
// console.log(tab, event)
|
||||
// console.log('tab',tab.index)
|
||||
// console.log('activeName',activeName.value)
|
||||
// if(activeName.value === 'first') console.log('1')
|
||||
// if(activeName.value === 'second') console.log('2')
|
||||
// if(activeName.value === 'third') console.log('3')
|
||||
activeIndex.value = tab.index
|
||||
console.log('activeIndex',activeIndex.value)
|
||||
}
|
||||
const tabList = [
|
||||
{ sortLine: '1', name: 'Tom', count: '1', rate: '100%', immediateRate: '100%'},
|
||||
@ -185,4 +196,23 @@ onMounted( async () => {
|
||||
|
||||
}
|
||||
}
|
||||
::v-deep .el-input__inner {
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .el-select .el-input .el-select__caret {
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .el-input__wrapper {
|
||||
width: 85%;
|
||||
height: 0%;
|
||||
background: #0d2956;
|
||||
}
|
||||
::v-deep .el-range-separator {
|
||||
color: #ccc;
|
||||
font-size: 10px;
|
||||
}
|
||||
::v-deep .el-range-input {
|
||||
color: #ccc;
|
||||
font-size: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,8 +1,58 @@
|
||||
<template>
|
||||
<div class="rightAll">
|
||||
<!-- <Card title="安全管理"> -->
|
||||
<div id="echartsSafe" style="width: 100%; height: 100%"></div>
|
||||
<!-- </Card> -->
|
||||
<div class="header">
|
||||
<div class="hLeft">
|
||||
隐患统计智能分析
|
||||
</div>
|
||||
<div class="hRight">
|
||||
<el-date-picker style="width: 85%" v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :size="size"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="contentTop">
|
||||
<div class="ctHead">
|
||||
<div>重大隐患超期未整改<text>{{overdueMajorDangerCount}}</text>个，占比<text>{{overdueMajorDangerRate}}%</text></div>
|
||||
</div>
|
||||
<div class="ctContent">
|
||||
<div id="echartsSafe" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contentMiddle">
|
||||
<div class="cmHead">
|
||||
<div>重大隐患未销项<text>{{majorDangerCount}}</text>个，占比<text>{{majorDangerRate}}%</text></div>
|
||||
</div>
|
||||
<div class="cmContent">
|
||||
<div id="echarts2" style="width: 100%; height: 100%"></div>
|
||||
<!-- <div id="echartsMajorDanger" style="width: 100%; height: 100%"></div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contentBottom">
|
||||
<div class="cbHeader">
|
||||
<div class="cbHeaderInfo">
|
||||
<div class="cubeIcon"></div>
|
||||
<div>教育智能提示</div>
|
||||
</div>
|
||||
<div class="cbHeaderLine"></div>
|
||||
</div>
|
||||
<div class="cbContent">
|
||||
<el-scrollbar height="350">
|
||||
<div class="item" v-for="(item,index) in listData" :key="index">
|
||||
<div class="itemHead">
|
||||
<div class="itemHeadInner" v-if="item.type === 1">{{item.header}}</div>
|
||||
<div class="itemHeadInner2" v-if="item.type === 2">{{item.header}}</div>
|
||||
</div>
|
||||
<div class="itemContent">
|
||||
<el-tooltip class="box-item" effect="dark" :content="item.content" placement="top-start">
|
||||
{{item.content}}
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -10,18 +60,48 @@
|
||||
import Card from "@/components/card.vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
// import rightTop from "@/views/commandScreen/commandCenter/rightTop.vue";
|
||||
// import rightCenter from "@/views/commandScreen/commandCenter/rightCenter.vue";
|
||||
const store = GlobalStore();
|
||||
import { getProjectInspectRecordCountApi } from "@/api/modules/projectOverview";
|
||||
import { selectQualityStatisticsApi } from "@/api/modules/projectOverview";
|
||||
import * as echarts from "echarts";
|
||||
const echartsTest = ref();
|
||||
let questionTotal = ref(0 as any);
|
||||
|
||||
let dateRange = ref([] as any);
|
||||
|
||||
let majorDangerCount = ref(20 as any);
|
||||
let majorDangerRate = ref(50 as any);
|
||||
let overdueMajorDangerCount = ref(20 as any);
|
||||
let overdueMajorDangerRate = ref(50 as any);
|
||||
|
||||
let listData = ref([
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
])
|
||||
|
||||
let dataList = ref([
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
name: "未整改安全问题",
|
||||
|
||||
name: "重大隐患",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#EC6266",
|
||||
@ -32,7 +112,7 @@ let dataList = ref([
|
||||
{
|
||||
value: 70,
|
||||
show: true,
|
||||
name: "已整改安全问题",
|
||||
name: "一般隐患",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#6375C7",
|
||||
@ -41,6 +121,7 @@ let dataList = ref([
|
||||
}
|
||||
}
|
||||
]);
|
||||
|
||||
function Pie() {
|
||||
let dataArr = [];
|
||||
for (var i = 0; i < 150; i++) {
|
||||
@ -81,7 +162,7 @@ function drawEchart() {
|
||||
},
|
||||
title: {
|
||||
text: questionTotal.value,
|
||||
subtext: "安全问题数",
|
||||
subtext: "超期未整改数",
|
||||
x: "24%",
|
||||
y: "center",
|
||||
textAlign: "center",
|
||||
@ -104,8 +185,8 @@ function drawEchart() {
|
||||
icon: "rect",
|
||||
type: "plain",
|
||||
orient: "vertical",
|
||||
left: "50%",
|
||||
top: "40%",
|
||||
left: "55%",
|
||||
top: "35%",
|
||||
align: "left",
|
||||
itemGap: 30,
|
||||
itemWidth: 8, // 设置宽度
|
||||
@ -285,53 +366,13 @@ function drawEchart() {
|
||||
}
|
||||
]
|
||||
};
|
||||
// let option = {
|
||||
// tooltip: {
|
||||
// trigger: 'item'
|
||||
// },
|
||||
// legend: {
|
||||
// top: '5%',
|
||||
// left: 'center'
|
||||
// },
|
||||
// series: [
|
||||
// {
|
||||
// name: 'Access From',
|
||||
// type: 'pie',
|
||||
// radius: ['40%', '70%'],
|
||||
// avoidLabelOverlap: false,
|
||||
// label: {
|
||||
// show: false,
|
||||
// position: 'center'
|
||||
// },
|
||||
// emphasis: {
|
||||
// label: {
|
||||
// show: true,
|
||||
// fontSize: 40,
|
||||
// fontWeight: 'bold'
|
||||
// }
|
||||
// },
|
||||
// labelLine: {
|
||||
// show: false
|
||||
// },
|
||||
// data: [
|
||||
// { value: 1048, name: 'Search Engine' },
|
||||
// { value: 735, name: 'Direct' },
|
||||
// { value: 580, name: 'Email' },
|
||||
// { value: 484, name: 'Union Ads' },
|
||||
// { value: 300, name: 'Video Ads' }
|
||||
// ]
|
||||
// }
|
||||
// ]
|
||||
// };
|
||||
echartsTest.value.setOption(option, true);
|
||||
window.addEventListener("resize", () => {
|
||||
console.log(echartsTest)
|
||||
echartsTest.value.resize();
|
||||
})
|
||||
}
|
||||
|
||||
//获取安全管理
|
||||
// const safeData = ref(null as any);
|
||||
const getSafeInfo = async () => {
|
||||
const res: any = await getProjectInspectRecordCountApi({ projectSn: store.sn });
|
||||
// console.log("获取安全管理", res);
|
||||
@ -341,12 +382,269 @@ const getSafeInfo = async () => {
|
||||
questionTotal.value = res.result.totalNum;
|
||||
drawEchart();
|
||||
};
|
||||
|
||||
let dataList2 = ref([
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
name: "重大隐患",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#038cf5",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 70,
|
||||
show: true,
|
||||
name: "一般隐患",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#01d6f4",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
]);
|
||||
|
||||
function drawEchart2() {
|
||||
let echartsTest = echarts.init(document.getElementById("echarts2"));
|
||||
let option = {
|
||||
tooltip: {
|
||||
trigger: "item"
|
||||
},
|
||||
title: {
|
||||
text: questionTotal.value,
|
||||
// text: '100%',
|
||||
subtext: "入场三级教育\n完成率",
|
||||
x: "24%",
|
||||
y: "center",
|
||||
textAlign: "center",
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 26,
|
||||
fontWeight: "normal",
|
||||
// align: "center",
|
||||
// width: "200px",
|
||||
fontFamily: "sadigitalNumber"
|
||||
},
|
||||
subtextStyle: {
|
||||
color: "#ccc",
|
||||
fontSize: 12,
|
||||
fontWeight: "normal"
|
||||
// align: "center",
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
selectedMode: false, // 取消图例上的点击事件
|
||||
icon: "rect",
|
||||
type: "plain",
|
||||
orient: "vertical",
|
||||
left: "55%",
|
||||
top: "35%",
|
||||
align: "left",
|
||||
itemGap: 30,
|
||||
itemWidth: 8, // 设置宽度
|
||||
itemHeight: 7, // 设置高度
|
||||
symbolKeepAspect: false,
|
||||
textStyle: {
|
||||
color: "#000",
|
||||
rich: {
|
||||
name: {
|
||||
verticalAlign: "right",
|
||||
align: "left",
|
||||
fontSize: 14,
|
||||
color: "#FFFFFF"
|
||||
},
|
||||
value: {
|
||||
align: "left",
|
||||
fontSize: 14,
|
||||
color: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
},
|
||||
data: dataList2.value.map(item => {
|
||||
if (item.show) {
|
||||
return item.name;
|
||||
}
|
||||
}),
|
||||
formatter: function (data) {
|
||||
if (dataList2.value && dataList2.value.length) {
|
||||
for (var i = 0; i < dataList2.value.length; i++) {
|
||||
if (data === dataList2.value[i].name) {
|
||||
var value = dataList2.value[i].value;
|
||||
var percentage = value + "%";
|
||||
return "{name| " + data + "} {gap| }" + "{value|" + value + " " + "}";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
// 外侧光线
|
||||
{
|
||||
name: "",
|
||||
type: "gauge",
|
||||
center: ["25%", "55%"],
|
||||
radius: "90%",
|
||||
startAngle: 235,
|
||||
endAngle: -50,
|
||||
min: 0,
|
||||
max: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: [
|
||||
[
|
||||
100 / 100,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#526277"
|
||||
},
|
||||
{
|
||||
offset: 0.25,
|
||||
color: "rgba(4, 14, 54,0.4)"
|
||||
},
|
||||
{
|
||||
offset: 0.7,
|
||||
color: "rgba(4, 14, 54,0.4)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#526277"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "rgba(255,255,255,0)"]
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
axisTick: {
|
||||
show: 0
|
||||
},
|
||||
splitLine: {
|
||||
show: 0
|
||||
},
|
||||
axisLabel: {
|
||||
show: 0
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
type: "gauge",
|
||||
center: ["25%", "55%"],
|
||||
radius: "80%",
|
||||
startAngle: 245,
|
||||
endAngle: -115,
|
||||
min: 0,
|
||||
max: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
width: 2,
|
||||
color: [
|
||||
[
|
||||
200 / 100,
|
||||
new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "#52bef0"
|
||||
},
|
||||
{
|
||||
offset: 0.5,
|
||||
color: "#13356b"
|
||||
}
|
||||
])
|
||||
],
|
||||
[1, "rgba(255,255,255,0)"]
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
axisTick: {
|
||||
show: 0
|
||||
},
|
||||
splitLine: {
|
||||
show: 0
|
||||
},
|
||||
axisLabel: {
|
||||
show: 0
|
||||
},
|
||||
pointer: {
|
||||
show: 0
|
||||
},
|
||||
detail: {
|
||||
show: 0
|
||||
}
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
type: "pie",
|
||||
radius: [65, 75],
|
||||
center: ["25%", "55%"],
|
||||
hoverAnimation: true,
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderWidth: 10
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
position: "center"
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: dataList2.value
|
||||
},
|
||||
{
|
||||
type: "pie",
|
||||
radius: ["57", "60"],
|
||||
center: ["25%", "55%"],
|
||||
label: {
|
||||
show: false
|
||||
},
|
||||
|
||||
data: Pie()
|
||||
}
|
||||
]
|
||||
};
|
||||
echartsTest.setOption(option, true);
|
||||
// window.addEventListener("resize", () => {
|
||||
// console.log(666)
|
||||
// echartsTest.resize();
|
||||
// })
|
||||
}
|
||||
//获取质量管理
|
||||
const qualityInfo = async () => {
|
||||
const res: any = await selectQualityStatisticsApi({ projectSn: store.sn });
|
||||
dataList2.value[0].value = res.result.total.rectificationNum;
|
||||
dataList2.value[1].value = res.result.total.totalNum - res.result.total.rectificationNum;
|
||||
questionTotal.value = res.result.total.totalNum;
|
||||
drawEchart2();
|
||||
};
|
||||
|
||||
//将方法暴露给父组件
|
||||
defineExpose({
|
||||
getSafeInfo
|
||||
})
|
||||
onMounted(async () => {
|
||||
await getSafeInfo();
|
||||
await qualityInfo();
|
||||
// window.onresize = function(){
|
||||
// if(echartsTest.value){
|
||||
// echartsTest.value.resize();
|
||||
@ -362,11 +660,172 @@ onMounted(async () => {
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 102.1%;
|
||||
.header{
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20px 20px;
|
||||
border-bottom: 1px solid #0059ff;
|
||||
.hLeft{
|
||||
width: 50%;
|
||||
color: white;
|
||||
}
|
||||
.hRight{
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
.content{
|
||||
padding: 0 20px;
|
||||
height: 100%;
|
||||
.contentTop{
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 25%;
|
||||
.ctHead{
|
||||
background-color: #002f69;
|
||||
padding-bottom: 5px;
|
||||
color: #fff;
|
||||
height: 15%;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
text{
|
||||
font-size: 24px;
|
||||
color: #fc4c4c;
|
||||
}
|
||||
}
|
||||
.ctContent{
|
||||
height: 85%;
|
||||
// background-color: darkred;
|
||||
}
|
||||
}
|
||||
.contentMiddle{
|
||||
width: 100%;
|
||||
height: 25%;
|
||||
.cmHead{
|
||||
background-color: #002f69;
|
||||
padding-bottom: 5px;
|
||||
color: #fff;
|
||||
height: 15%;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
text{
|
||||
font-size: 24px;
|
||||
color: #0db027;
|
||||
}
|
||||
}
|
||||
.cmContent{
|
||||
height: 85%;
|
||||
// background-color: darkred;
|
||||
}
|
||||
}
|
||||
.contentBottom{
|
||||
// width: 100%;
|
||||
height: 42.5%;
|
||||
// background-color: darkred;
|
||||
|
||||
// width: 100%;
|
||||
// background-color: #fff;
|
||||
// padding: 0 20px;
|
||||
position: relative;
|
||||
.cbHeader{
|
||||
width:100%;
|
||||
height: 40px;
|
||||
// background-color: darkred;
|
||||
.cbHeaderInfo{
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.cubeIcon{
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
// background-color: #fff;
|
||||
background: url("@/assets/images/commandScreen/head-cube.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
// margin-left: -5px;
|
||||
margin: 0 3px 0 -5px;
|
||||
}
|
||||
}
|
||||
.cbHeaderLine{
|
||||
height: 4px;
|
||||
width: 100%;
|
||||
// background-color: darkblue;
|
||||
background: url("@/assets/images/commandScreen/head-line.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.cbContent{
|
||||
width: 100%;
|
||||
height: calc(100% - 40px);
|
||||
// background: #fff;
|
||||
.item{
|
||||
// width: 100%;
|
||||
line-height: 130%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
// background-color: green;
|
||||
color: #fff;
|
||||
.itemHead{
|
||||
white-space: nowrap;
|
||||
.itemHeadInner{
|
||||
font-size: 16px;
|
||||
border: 1px solid #f77c7d;
|
||||
box-shadow: 0 0 0 1px #f77c7d;
|
||||
background: rgba(247,124,125, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.itemHeadInner2{
|
||||
font-size: 16px;
|
||||
border: 1px solid #56a8f8;
|
||||
box-shadow: 0 0 0 1px #56a8f8;
|
||||
background: rgba(86,168,248, 0.4);
|
||||
border-radius: 3px;
|
||||
padding: 0 15px;
|
||||
margin: 9px 0;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
.itemContent{
|
||||
margin-left: 10px;
|
||||
font-size: 15px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .h-card .content {
|
||||
height: 80%;
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .h-card {
|
||||
position: relative;
|
||||
::v-deep .el-select .el-input .el-select__caret {
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .el-input__wrapper {
|
||||
width: 85%;
|
||||
height: 0%;
|
||||
background: #0d2956;
|
||||
}
|
||||
::v-deep .el-range-separator {
|
||||
color: #ccc;
|
||||
font-size: 10px;
|
||||
}
|
||||
::v-deep .el-range-input {
|
||||
color: #ccc;
|
||||
font-size: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
155
src/views/commandScreen/commandCenter/rightPage/rightTop.vue
Normal file
155
src/views/commandScreen/commandCenter/rightPage/rightTop.vue
Normal file
@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div class="rightTop">
|
||||
<div class="ctHead">
|
||||
<div>重大隐患超期未整改<text>{{overdueMajorDangerCount}}</text>个，占比<text>{{overdueMajorDangerRate}}%</text></div>
|
||||
</div>
|
||||
<div class="ctContent">
|
||||
<div id="echartsSafe" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Card from "@/components/card.vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import rightTop from "@/views/commandScreen/commandCenter/rightPage/rightTop.vue";
|
||||
// import rightCenter from "@/views/commandScreen/commandCenter/rightCenter.vue";
|
||||
const store = GlobalStore();
|
||||
import { getProjectInspectRecordCountApi } from "@/api/modules/projectOverview";
|
||||
import * as echarts from "echarts";
|
||||
const echartsTest = ref();
|
||||
let questionTotal = ref(0 as any);
|
||||
|
||||
let dateRange = ref([] as any);
|
||||
|
||||
let majorDangerCount = ref(20 as any);
|
||||
let majorDangerRate = ref(50 as any);
|
||||
let overdueMajorDangerCount = ref(20 as any);
|
||||
let overdueMajorDangerRate = ref(50 as any);
|
||||
|
||||
let listData = ref([
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
{header: '重大风险',type: 1,content: '正处于吊装施工重大风险作业阶段，请注意在操作前，应对吊装设备进行安全把控'},
|
||||
{header: '特种作业人员教育',type: 2,content: '1#塔吊报警频次较上周增长60%，塔吊间各个设备之间的衔接进行全面检查，以防止'},
|
||||
])
|
||||
|
||||
let dataList = ref([
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
name: "未整改安全问题",
|
||||
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#EC6266",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 70,
|
||||
show: true,
|
||||
name: "已整改安全问题",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#6375C7",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
}
|
||||
]);
|
||||
function Pie() {
|
||||
let dataArr = [];
|
||||
for (var i = 0; i < 150; i++) {
|
||||
if (i % 2 === 0) {
|
||||
dataArr.push({
|
||||
name: (i + 1).toString(),
|
||||
value: 10,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#7cf4f1",
|
||||
borderWidth: 0,
|
||||
borderColor: "#7f6546"
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
dataArr.push({
|
||||
name: (i + 1).toString(),
|
||||
value: 10,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "rgba(0,0,0,0)",
|
||||
borderWidth: 0,
|
||||
borderColor: "rgba(0,0,0,0)"
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
return dataArr;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//获取安全管理
|
||||
// const safeData = ref(null as any);
|
||||
const getSafeInfo = async () => {
|
||||
const res: any = await getProjectInspectRecordCountApi({ projectSn: store.sn });
|
||||
// console.log("获取安全管理", res);
|
||||
// safeData.value = res.result;
|
||||
dataList.value[0].value = res.result.rectificationNum;
|
||||
dataList.value[1].value = res.result.totalNum - res.result.rectificationNum;
|
||||
questionTotal.value = res.result.totalNum;
|
||||
drawEchart();
|
||||
};
|
||||
//将方法暴露给父组件
|
||||
defineExpose({
|
||||
getSafeInfo
|
||||
})
|
||||
onMounted(async () => {
|
||||
await getSafeInfo();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rightTop {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 25%;
|
||||
.ctHead{
|
||||
background-color: #002f69;
|
||||
padding-bottom: 5px;
|
||||
color: #fff;
|
||||
height: 15%;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
text{
|
||||
font-size: 24px;
|
||||
color: #fc4c4c;
|
||||
}
|
||||
}
|
||||
.ctContent{
|
||||
height: 85%;
|
||||
// background-color: darkred;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user