湖里大屏(首页):出勤统计接口对接

This commit is contained in:
骆乐 2022-08-09 13:58:24 +08:00
parent 79a4f6a138
commit e5b3e465b9

View File

@ -6,9 +6,9 @@
<div class="point"></div> <div class="point"></div>
<span class="smallTit">工种出勤统计</span> <span class="smallTit">工种出勤统计</span>
<div class="box"> <div class="box">
<div class="outBox" v-for="(item,index) in dataList" :key="index"> <div class="outBox" v-for="(item,index) in workerTypeList" :key="index">
<span class="name">{{item.name}}</span> <span class="name">{{item.typeName}}</span>
<p class="num">{{item.num}}</p> <p class="num">{{item.workerNum}}</p>
</div> </div>
</div> </div>
</div> </div>
@ -30,6 +30,7 @@
<script> <script>
import Card from "../components/Card.vue"; import Card from "../components/Card.vue";
import JBarChart from '../jChart/bar/JBarChart.vue' import JBarChart from '../jChart/bar/JBarChart.vue'
import { selectProjectWorkerTypeTotalListApi,} from "@/assets/js/api/dataBoard.js";
export default { export default {
components: { Card,JBarChart }, components: { Card,JBarChart },
props: { props: {
@ -40,22 +41,26 @@ export default {
}, },
data() { data() {
return { return {
dataList: [ workerTypeList: [],
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" },
{ name: "钢筋工", num: "679" }
],
xData: ['中建一局', '中建一局', '中建一局', '中建一局','中建一局', '中建一局', '中建一局', '中建一局'], xData: ['中建一局', '中建一局', '中建一局', '中建一局','中建一局', '中建一局', '中建一局', '中建一局'],
series: [{ data: [170, 180,90,70,60,50,50,50,] }, { data: [220,280,190,180,300,200,200,200,] }], series: [{ data: [170, 180,90,70,60,50,50,50,] }, { data: [220,280,190,180,300,200,200,200,] }],
color: ['#5be2f6', '#5281f7'], color: ['#5be2f6', '#5281f7'],
grid: ['10%', '5%', '15%', '5%'] grid: ['10%', '5%', '15%', '5%']
}; };
},
created(){
this.getWokerType();
},
methods:{
//
getWokerType() {
selectProjectWorkerTypeTotalListApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
console.log(res);
this.workerTypeList = res.result;
});
},
} }
}; };
</script> </script>
@ -79,22 +84,25 @@ export default {
.box { .box {
display: flex; display: flex;
flex-flow: wrap; flex-flow: wrap;
justify-content: center; justify-content: left;
align-items: center; align-items: center;
width: 95%; width: 95%;
height: 40%; height: 170px;
margin-left: 6%; margin-left: 3%;
margin-top: 2%; margin-top: 2%;
} overflow: auto;
.outBox { .outBox {
width: 33%; width: 33%;
height: 33%; height: 33%;
margin-bottom: 10px; margin-bottom: 10px;
.name { .name {
display: inline-block;
height: 50px; height: 50px;
width: 50%; width: 35%;
line-height: 40px; line-height: 40px;
margin-right: 35px; margin-right: 35px;
text-align: right;
} }
.num { .num {
display: inline-block; display: inline-block;
@ -107,6 +115,7 @@ export default {
background-size: 100%; background-size: 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
}
} }
.botBox { .botBox {
margin-top: 20px; margin-top: 20px;
@ -130,6 +139,9 @@ export default {
} }
} }
} }
::-webkit-scrollbar {
width:3px;
}
.mychart { .mychart {
width: 100%; width: 100%;
height: 40%; height: 40%;