http冲突
@ -40,8 +40,10 @@ if (process.env.NODE_ENV == 'development') {
|
||||
// axios.defaults.baseURL = 'http://124.71.178.44:100/' // 河南
|
||||
// tag: 本地
|
||||
// axios.defaults.baseURL = 'http://192.168.34.174:6023/' // 老大本地
|
||||
axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1
|
||||
// axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1
|
||||
// axios.defaults.baseURL = 'http://192.168.34.216:6023/' // 邱平毅本地
|
||||
// axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1
|
||||
axios.defaults.baseURL = 'http://192.168.34.216:6025/' // 邱平毅本地
|
||||
// axios.defaults.baseURL = 'http://192.168.34.231:6023/'; //杨思瑞本地
|
||||
// axios.defaults.baseURL = 'http://47.97.202.104:6023/';
|
||||
// axios.defaults.baseURL = 'http://139.9.66.234:8/';
|
||||
|
||||
@ -45,8 +45,8 @@ export default new Vuex.Store({
|
||||
// UPLOADURL:'http://10.0.1.43:6023/upload/image',//测试
|
||||
// FILEURL:'http://10.0.1.43:6023/image/',//测试
|
||||
BASEURL: baseUrl ? baseUrl : window.location.protocol + '//' + window.location.host + '/', //
|
||||
UPLOADURL: window.location.protocol + '//' + window.location.host + '/upload/image', //
|
||||
FILEURL: window.location.protocol + '//' + window.location.host + '/image/', //测试 // tag: 本地测试接口
|
||||
// UPLOADURL: window.location.protocol + '//' + window.location.host + '/upload/image', //
|
||||
// FILEURL: window.location.protocol + '//' + window.location.host + '/image/', //测试 // tag: 本地测试接口
|
||||
/* 2022-05-16 */
|
||||
// tag: 部署河南项目时,需要打开这两行代码
|
||||
// UPLOADURL: 'http://124.71.178.44:100/upload/image',
|
||||
@ -56,8 +56,8 @@ export default new Vuex.Store({
|
||||
// UPLOADURL: 'http://192.168.34.125:6023/upload/image',
|
||||
// FILEURL: 'http://192.168.34.125:6023/image/',
|
||||
// 邱平毅的
|
||||
// UPLOADURL: 'http://192.168.34.216:6023/upload/image',
|
||||
// FILEURL: 'http://192.168.34.216:6023/image/',
|
||||
UPLOADURL: 'http://192.168.34.216:6023/upload/image',
|
||||
FILEURL: 'http://192.168.34.216:6023/image/',
|
||||
|
||||
// UPLOADURL:'http://'+"61.190.32.219:9050"+'/upload/image',//正式
|
||||
// FILEURL:'http://'+"61.190.32.219:9050"+'/image/',//正式
|
||||
|
||||
BIN
src/views/projectAdmin/zjsj/assets/images/common/bg-ihover.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/bg-intro.png
Normal file
|
After Width: | Height: | Size: 18 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/bg_time.png
Normal file
|
After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 26 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/bgc_other.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/icon_hs.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/icon_jt.png
Normal file
|
After Width: | Height: | Size: 317 B |
BIN
src/views/projectAdmin/zjsj/assets/images/common/icon_zg.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/num_bg.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
src/views/projectAdmin/zjsj/assets/images/common/num_skyblue.png
Normal file
|
After Width: | Height: | Size: 4.1 KiB |
@ -1,14 +1,165 @@
|
||||
<template>
|
||||
<Card title="质安管理时间轴">
|
||||
质安管理时间轴
|
||||
<div class="timeline">
|
||||
<el-timeline>
|
||||
<el-timeline-item v-for="(item,index) in contentList" :key="index" :timestamp="item.time" placement="top">
|
||||
<div class="point"></div><span class="mintit"> 监督巡检 </span>
|
||||
<div class="contentBox">
|
||||
<p>
|
||||
<span>是否发现问题</span>
|
||||
<a style="color:#55aeb7">{{item.question == 1 ? '是' : '否' }}</a>
|
||||
</p>
|
||||
<p>
|
||||
<span>巡检单位</span>
|
||||
<a style="color:#bc5935">{{item.utils}}</a>
|
||||
</p>
|
||||
<p>
|
||||
<span>监督员</span>
|
||||
<a>{{item.safe}}</a>
|
||||
</p>
|
||||
<p>
|
||||
<span>抽查类型</span>
|
||||
<a style="color:#c4c7cc">{{item.type}}</a>
|
||||
</p>
|
||||
<p>
|
||||
<span>检查部位</span>
|
||||
<a style="color:#c4c7cc">{{item.position}}</a>
|
||||
</p>
|
||||
<p>
|
||||
<span>是否下发整改</span>
|
||||
<a style="color:#c4c7cc">{{item.change}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import Card from "../components/Card.vue";
|
||||
export default {
|
||||
components: { Card }
|
||||
}
|
||||
components: { Card },
|
||||
data() {
|
||||
return {
|
||||
contentList: [
|
||||
{
|
||||
time: "2022-06-14",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-07-28",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-08-11",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-08-14",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-08-14",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-08-14",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
},
|
||||
{
|
||||
time: "2022-08-14",
|
||||
question: 1,
|
||||
utils: "中国建筑第四工程局有限公司",
|
||||
safe: "张三、李四",
|
||||
type: "安全",
|
||||
position: "主体结构",
|
||||
change: "是"
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.timeline {
|
||||
margin-top: 3%;
|
||||
height: 98%;
|
||||
width: 97%;
|
||||
overflow: auto;
|
||||
|
||||
.point{
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
margin-right: 5px;
|
||||
background-color: #e2e4e6;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
.mintit{
|
||||
display: inline-block;
|
||||
margin-bottom: 10px;
|
||||
font-size: 16px;
|
||||
color: #c4c7cc;
|
||||
}
|
||||
.contentBox {
|
||||
// background-color: rosybrown;
|
||||
p{
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-content: left;
|
||||
margin-top: 6px;
|
||||
span {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
::v-deep .el-timeline-item__tail {
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
height: 100%;
|
||||
border-left: 3px solid #274b5f;
|
||||
}
|
||||
::v-deep .el-timeline-item__content {
|
||||
color: #888e98;
|
||||
}
|
||||
::v-deep .el-timeline {
|
||||
margin: 3px;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
color: #19394d;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,14 +1,222 @@
|
||||
<template>
|
||||
<Card title="质量检测">
|
||||
质量检测
|
||||
<div class="contentBox">
|
||||
<div class="topBox">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<div class="point"></div>
|
||||
<span class="mintit">监测报告统计</span>
|
||||
<div class="rowInfo">
|
||||
<span>总分数</span>
|
||||
<span>252份</span>
|
||||
<span>合格</span>
|
||||
<span style="color:#6ee4f0;">9243份</span>
|
||||
</div>
|
||||
<div class="rowInfo2">
|
||||
<span>其他</span>
|
||||
<span>252份</span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="row">
|
||||
<p>99.89%</p>
|
||||
<p>合格率</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="titleRow">
|
||||
<span>建材类型</span>
|
||||
<span>检测报告数</span>
|
||||
<span>合格数</span>
|
||||
<span>合格率</span>
|
||||
</div>
|
||||
<div class="contentBtn">
|
||||
<template>
|
||||
<el-table :data="tableData" :show-header="false" style="width: 100%">
|
||||
<el-table-column prop="date" label="建材类型" width="150"></el-table-column>
|
||||
<el-table-column prop="name" label="检测报告数" width="120"></el-table-column>
|
||||
<el-table-column prop="address" label="合格数"></el-table-column>
|
||||
<el-table-column prop="rale" style="color:red" label="合格率">
|
||||
<template slot-scope="scope">
|
||||
<span class="raleRow"
|
||||
>{{ scope.row.rale }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import Card from "../components/Card.vue";
|
||||
export default {
|
||||
components: { Card }
|
||||
}
|
||||
components: { Card },
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "钢筋原材试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗渗试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "钢筋原材试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗渗试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "钢筋原材试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗渗试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
},
|
||||
{
|
||||
date: "混泥土抗压试验",
|
||||
name: "6430",
|
||||
address: "5934",
|
||||
rale: "99.88%"
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.contentBox {
|
||||
color: white;
|
||||
margin-top: 2%;
|
||||
margin-left: 1%;
|
||||
.topBox {
|
||||
.point {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background-color: #dddfe2;
|
||||
display: inline-block;
|
||||
margin-right: 2%;
|
||||
}
|
||||
.mintit {
|
||||
font-size: 20px;
|
||||
color: #dddfe2;
|
||||
}
|
||||
.top {
|
||||
display: flex;
|
||||
margin-top: 4%;
|
||||
height: 30%;
|
||||
.left {
|
||||
width: 70%;
|
||||
.rowInfo,
|
||||
.rowInfo2 {
|
||||
display: flex;
|
||||
margin-top: 3%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
color: #c4c7cc;
|
||||
background-image: url(../assets/images/common/bg-intro.png);
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
margin-bottom: 3%;
|
||||
span {
|
||||
flex: 1;
|
||||
margin-left: 8%;
|
||||
}
|
||||
}
|
||||
.rowInfo2 {
|
||||
background-image: url(../assets/images/common/bgc_other.png);
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 25%;
|
||||
background-image: url(../assets/images/common/bgc_bluechart.png);
|
||||
background-size: 100%;
|
||||
.row {
|
||||
font-size: 12px;
|
||||
color: #c4c7cc;
|
||||
margin-left: 32%;
|
||||
margin-top: 38%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.titleRow{
|
||||
margin-top: 5%;
|
||||
color: #5ec2c8;
|
||||
display: flex;
|
||||
span{
|
||||
flex: 1;
|
||||
margin-left: 5%;
|
||||
}
|
||||
}
|
||||
.contentBtn {
|
||||
margin-top: 1%;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.raleRow{
|
||||
color: #5ec2c8 !important;
|
||||
font-weight:bold;
|
||||
|
||||
}
|
||||
::v-deep .el-table {
|
||||
color: #7f8691;
|
||||
}
|
||||
::v-deep .el-table td{
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,14 +1,186 @@
|
||||
<template>
|
||||
<Card title="混泥土浇筑">
|
||||
混泥土浇筑
|
||||
<div class="contentBox">
|
||||
<div class="point"></div>
|
||||
<span class="mintit">混凝土浇筑统计</span>
|
||||
<div class="rowInfo">
|
||||
<span class="point"></span>
|
||||
<span>混凝土浇筑重量</span>
|
||||
<span style="color:#5ec2c8;">58974㎡</span>
|
||||
</div>
|
||||
<div class="checkChart" ref="checkChart"></div>
|
||||
<div class="midTit">
|
||||
<div class="point"></div>
|
||||
<span class="mintit">混凝土浇筑记录</span>
|
||||
</div>
|
||||
<el-timeline class="timeline">
|
||||
<el-timeline-item timestamp="2022-07-28" placement="top">
|
||||
<el-card>
|
||||
<span>2022-07-28</span>
|
||||
<p>C栋2号楼十一层</p>
|
||||
<span class="area">43㎡</span>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item timestamp="2022-07-28" placement="top">
|
||||
<el-card>
|
||||
<span>2022-07-28</span>
|
||||
<p>C栋2号楼十一层</p>
|
||||
<span class="area">56㎡</span>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item timestamp="2022-07-28" placement="top">
|
||||
<el-card>
|
||||
<span>2022-07-28</span>
|
||||
<p>C栋2号楼十一层</p>
|
||||
<span class="area">39㎡</span>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item timestamp="2022-07-28" placement="top">
|
||||
<el-card>
|
||||
<span>2022-07-28</span>
|
||||
<p>C栋2号楼十一层</p>
|
||||
<span class="area">78㎡</span>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import Card from "../components/Card.vue";
|
||||
import echarts from "echarts4";
|
||||
export default {
|
||||
components: { Card }
|
||||
}
|
||||
components: { Card },
|
||||
mounted() {
|
||||
this.createChart();
|
||||
},
|
||||
methods: {
|
||||
createChart() {
|
||||
const checkChart = echarts.init(this.$refs.checkChart);
|
||||
const option = {
|
||||
grid: {
|
||||
x: "9%", //x 偏移量
|
||||
y: "10%", // y 偏移量
|
||||
width: "86%", // 宽度
|
||||
height: "60%" // 高度
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
data: ["2022-1", "2022-3", "2022-6", "2022-8"],
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#9ea3ab"
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
splitNumber: 4,
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#777f8a"
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#9ea3ab"
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [4500, 5100, 2000, 6200],
|
||||
type: "line",
|
||||
smooth: true,
|
||||
color: "#f56c35"
|
||||
// areaStyle: {
|
||||
// color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
// { offset: 0, color: "rgba(213, 97, 52,0.5)" },
|
||||
// { offset: 1, color: "rgba(213, 97, 52,0.3)" }
|
||||
// ])
|
||||
// }
|
||||
}
|
||||
]
|
||||
};
|
||||
checkChart.setOption(option);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.contentBox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #c4c7cc;
|
||||
margin-top: 2%;
|
||||
margin-left: 1%;
|
||||
.point {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background-color: #c4c7cc;
|
||||
display: inline-block;
|
||||
margin-right: 2%;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.mintit {
|
||||
font-size: 16px;
|
||||
color: #c4c7cc;
|
||||
}
|
||||
.rowInfo {
|
||||
margin-top: 3%;
|
||||
margin-bottom: 3%;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #c4c7cc;
|
||||
background-image: url(../assets/images/common/bg-intro.png);
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
span {
|
||||
margin-left: 5%;
|
||||
}
|
||||
}
|
||||
.midTit {
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
.checkChart {
|
||||
width: 95%;
|
||||
height: 21%;
|
||||
}
|
||||
.timeline {
|
||||
height: 30%;
|
||||
}
|
||||
}
|
||||
::v-deep .el-card {
|
||||
border: none;
|
||||
background-color: #182337;
|
||||
background-image: url(../assets/images/common/bg_time.png);
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
span {
|
||||
color: #63cfd4;
|
||||
font-weight: bold;
|
||||
}
|
||||
p {
|
||||
margin-top: 20px;
|
||||
color: white;
|
||||
}
|
||||
.area {
|
||||
float: right;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
::v-deep .el-timeline-item__tail {
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
height: 100%;
|
||||
border-left: 3px solid #274b5f;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -38,10 +38,10 @@ export default {
|
||||
height: 33%;
|
||||
}
|
||||
.middle {
|
||||
height: 30%;
|
||||
height: 45%;
|
||||
}
|
||||
.bottom {
|
||||
height: 37%;
|
||||
height: 22%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,14 +1,100 @@
|
||||
<template>
|
||||
<Card title="疫情防控">
|
||||
疫情防控
|
||||
<div class="contentBox">
|
||||
<div class="contentTop">
|
||||
<div class="img">
|
||||
<img src="../assets/images/common/num_skyblue.png" />
|
||||
</div>
|
||||
<div class="contentBtn">
|
||||
<p class="num1">6250</p>
|
||||
<p class="text">在场总人数</p>
|
||||
</div>
|
||||
<div class="img">
|
||||
<img src="../assets/images/common/icon_hs.png" />
|
||||
</div>
|
||||
<div class="contentBtn">
|
||||
<p class="num2">5649</p>
|
||||
<p class="text">核酸人数</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentbut">
|
||||
<div class="lw">
|
||||
<p>劳务人数</p>
|
||||
<p class="number">366</p>
|
||||
</div>
|
||||
<div class="cq">
|
||||
<p>出勤人数</p>
|
||||
<p class="number">236</p>
|
||||
</div>
|
||||
<div class="tc">
|
||||
<p>退场人数</p>
|
||||
<p class="number">128</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import Card from "../components/Card.vue";
|
||||
export default {
|
||||
components: { Card }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.contentBox {
|
||||
margin-top: 20px;
|
||||
.contentTop {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.img,
|
||||
.contentBtn {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.img {
|
||||
img {
|
||||
height: 56px;
|
||||
width: 56px;
|
||||
}
|
||||
}
|
||||
.contentBtn {
|
||||
margin-right: 40px;
|
||||
.num1 {
|
||||
color: #53a9b1;
|
||||
}
|
||||
.num2 {
|
||||
color: #f56c35;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-top: 5px;
|
||||
color: #a4a9b0;
|
||||
}
|
||||
}
|
||||
.contentbut {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #a4a9b0;
|
||||
.lw,
|
||||
.cq,
|
||||
.tc {
|
||||
width: 88px;
|
||||
text-align: center;
|
||||
margin-right: 55px;
|
||||
.number {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background-image: url(../assets/images/common/num_bg.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
color: #6ee4f0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,14 +1,253 @@
|
||||
<template>
|
||||
<Card title="监督巡查">
|
||||
监督巡查
|
||||
<div class="contentBox">
|
||||
<div>监督员</div>
|
||||
<div class="person">
|
||||
<span>李四</span>
|
||||
<span>张三毛</span>
|
||||
<span>王明</span>
|
||||
<span>吴老五</span>
|
||||
</div>
|
||||
|
||||
<div class="contentTop">
|
||||
<div class="img">
|
||||
<img src="../assets/images/common/num_skyblue.png" />
|
||||
</div>
|
||||
<div class="contentBtn">
|
||||
<p class="num1">68</p>
|
||||
<p class="text">下发整改通知书</p>
|
||||
</div>
|
||||
<div class="img">
|
||||
<img src="../assets/images/common/icon_zg.png" />
|
||||
</div>
|
||||
<div class="contentBtn">
|
||||
<p class="num2">312</p>
|
||||
<p class="text">累计监督签到人数</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rowInfo">
|
||||
<span>
|
||||
下发整改通知书
|
||||
<span style="font-size:20px;color:#e1e2e4">36</span> 份
|
||||
</span>
|
||||
<span>
|
||||
<img class="image" src="../assets/images/common/icon_jt.png" />
|
||||
</span>
|
||||
<span>
|
||||
已整改
|
||||
<span style="font-size:20px;color:#66d4d9">18</span>
|
||||
</span>
|
||||
<span>
|
||||
未整改
|
||||
<span style="font-size:20px;color:#f89872">18</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="echarts">
|
||||
<div class="checkChart" ref="checkChart"></div>
|
||||
<div class="right">
|
||||
<div class="one">
|
||||
<div class="point"></div>
|
||||
<div class="checkNum">
|
||||
<span>监督检查</span>
|
||||
<p>(数)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="two">
|
||||
<div class="point point2"></div>
|
||||
<div class="checkNum">
|
||||
<span>下发整改</span>
|
||||
<p>(份)</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Card from '../components/Card.vue'
|
||||
import Card from "../components/Card.vue";
|
||||
import echarts from "echarts4";
|
||||
export default {
|
||||
components: { Card }
|
||||
}
|
||||
components: { Card },
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
mounted() {
|
||||
this.createChart();
|
||||
},
|
||||
methods: {
|
||||
createChart() {
|
||||
const checkChart = echarts.init(this.$refs.checkChart);
|
||||
const option = {
|
||||
grid: {
|
||||
x: "8%",//x 偏移量
|
||||
y: "10%", // y 偏移量
|
||||
width: "86%", // 宽度
|
||||
height: "60%"// 高度
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
data: ["2022-1", "2022-3", "2022-6", "2022-8"],
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#9ea3ab"
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
splitNumber: 4,
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#777f8a"
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#9ea3ab"
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [3.5, 4.5, 3.5, 4],
|
||||
type: "line",
|
||||
smooth: true,
|
||||
color: "#f56c35",
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{ offset: 0, color: "rgba(213, 97, 52,0.5)" },
|
||||
{ offset: 1, color: "rgba(213, 97, 52,0.3)" }
|
||||
])
|
||||
}
|
||||
},
|
||||
{
|
||||
data: [0.5, 2.5, 1.8, 1.2],
|
||||
type: "line",
|
||||
smooth: true,
|
||||
color: "#51a4ac",
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
||||
{ offset: 0, color: "rgba(53, 98, 111,0.5)" },
|
||||
{ offset: 1, color: "rgba(53, 98, 111,0.3)" }
|
||||
])
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
checkChart.setOption(option);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.contentBox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin-top: 20px;
|
||||
margin-left: 10px;
|
||||
color: #bec1c7;
|
||||
.person {
|
||||
span {
|
||||
margin: 5px 5px 10px 0px;
|
||||
display: inline-block;
|
||||
width: 88px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
background-image: url(../assets/images/common/num_bg.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
color: #6ee4f0;
|
||||
}
|
||||
}
|
||||
|
||||
.contentTop {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 15px;
|
||||
.img,
|
||||
.contentBtn {
|
||||
margin-right: 20px;
|
||||
font-size: 16px;
|
||||
.num1 {
|
||||
color: #53a9b1;
|
||||
font-size: 20px;
|
||||
}
|
||||
.num2 {
|
||||
color: #f56c35;
|
||||
font-size: 20px;
|
||||
}
|
||||
.text {
|
||||
margin-top: 5px;
|
||||
color: #a4a9b0;
|
||||
}
|
||||
}
|
||||
.img {
|
||||
img {
|
||||
height: 56px;
|
||||
width: 56px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.rowInfo {
|
||||
color: #69717d;
|
||||
span {
|
||||
margin-left: 10px;
|
||||
display: inline-block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
.image {
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.echarts {
|
||||
width: 100%;
|
||||
height: 55%;
|
||||
display: flex;
|
||||
.checkChart {
|
||||
width: 70%;
|
||||
height: 100%;
|
||||
}
|
||||
.right {
|
||||
width: 30%;
|
||||
margin-top: 12%;
|
||||
margin-left: 3%;
|
||||
font-size: 12px;
|
||||
color: #9ea3ab;
|
||||
.one,
|
||||
.two {
|
||||
margin-bottom: 10%;
|
||||
.point {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
margin-right: 5%;
|
||||
margin-bottom: 5%;
|
||||
display: inline-block;
|
||||
background-color: #f56c35;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.checkNum {
|
||||
display: inline-block;
|
||||
margin-bottom: 5%;
|
||||
}
|
||||
}
|
||||
.two {
|
||||
.point2 {
|
||||
background-color: #66d4d9;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,33 @@
|
||||
<template>
|
||||
<Card title="基本信息">
|
||||
基本信息
|
||||
<div>
|
||||
<div class="contentBox">
|
||||
<p class="row">
|
||||
<span>项目位置</span>
|
||||
<a>建宁路与热河交叉路口</a>
|
||||
</p>
|
||||
<p class="row">
|
||||
<span>用地面积</span>
|
||||
<a>112768.21㎡</a>
|
||||
</p>
|
||||
<p class="row">
|
||||
<span>建设单位</span>
|
||||
<a>中建四局发展(广州天河)有限公司</a>
|
||||
</p>
|
||||
<p class="row">
|
||||
<span>设计单位</span>
|
||||
<a>中国建筑第四工程局有限公司</a>
|
||||
</p>
|
||||
<p class="row">
|
||||
<span>勘察单位</span>
|
||||
<a>贵州中建建筑科研设计院有限公司</a>
|
||||
</p>
|
||||
<p class="row">
|
||||
<span>监理单位</span>
|
||||
<a>广州宏元建设工程咨询有限公司</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</template>
|
||||
|
||||
@ -11,4 +38,49 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
<style lang="less" scoped>
|
||||
.contentBox {
|
||||
margin-top: 3%;
|
||||
margin-left: 2%;
|
||||
.row{
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
display: flex;
|
||||
justify-content: left;
|
||||
align-content: left;
|
||||
margin-top: 3px;
|
||||
background-image: url(../assets/images/common/bg-intro.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
span {
|
||||
margin-left: 10%;
|
||||
color: white;
|
||||
width: 25%;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
||||
a{
|
||||
color:#c4c7cc;
|
||||
}
|
||||
}
|
||||
.row:active,.row:hover{
|
||||
height: 55px;
|
||||
line-height: 55px;
|
||||
background-image: url(../assets/images/common/bg-ihover.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
a{
|
||||
color:#bc5935;
|
||||
}
|
||||
span::before{
|
||||
content: '';
|
||||
top: 30%;
|
||||
left: -30%;
|
||||
position: absolute;
|
||||
border: 8px solid transparent;
|
||||
border-left: 8px solid white;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||