2024-10-31 安全教育-api补齐调用
This commit is contained in:
parent
05b94e1b85
commit
39f060abfb
27
src/api/modules/safeEdgeProtection.ts
Normal file
27
src/api/modules/safeEdgeProtection.ts
Normal file
@ -0,0 +1,27 @@
|
||||
import http from "@/api";
|
||||
const BASEURL = import.meta.env.VITE_API_URL;
|
||||
|
||||
// 培训概况
|
||||
export const safecationOverview = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/workerSafeEducationWorker/selectWorkerEducationOverview`, params);
|
||||
};
|
||||
|
||||
// 班前教育人数统计(近七日)
|
||||
export const safecationByWeek = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/workerSafeEducationWorker/selectWorkerEducationByWeek`, params);
|
||||
};
|
||||
|
||||
// 教育类型分析
|
||||
export const safecationByType = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/workerSafeEducationWorker/selectWorkerEducationByType`, params);
|
||||
};
|
||||
|
||||
// 近七日人员培训记录
|
||||
export const safeWorkerPage = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/workerSafeEducationWorker/selectSafeEducationWorkerPage`, params);
|
||||
};
|
||||
|
||||
// 培训统计(近一个月内) 培训人员班组统计(近一个月内)
|
||||
export const safecationByMonth = (params: {}) => {
|
||||
return http.post(BASEURL + `/xmgl/workerSafeEducationWorker/selectWorkerEducationByMonth`, params);
|
||||
};
|
||||
@ -4,19 +4,19 @@
|
||||
<div class="total-bg">
|
||||
<div class="worker-total">
|
||||
<div class="text">工人总数</div>
|
||||
<div class="number">4098</div>
|
||||
<div class="number">{{ByMonthdata.workerNum || "0"}}</div>
|
||||
</div>
|
||||
<div class="train-num">
|
||||
<div class="text">培训人数</div>
|
||||
<div class="number">3827</div>
|
||||
<div class="number">{{ByMonthdata.educationNum || "0"}}</div>
|
||||
</div>
|
||||
<div class="pass-num">
|
||||
<div class="text">合格人数</div>
|
||||
<div class="number">2098</div>
|
||||
<div class="number">{{ByMonthdata.passNum || "0"}}</div>
|
||||
</div>
|
||||
<div class="unqualified-num">
|
||||
<div class="text">不合格人数</div>
|
||||
<div class="number">1729</div>
|
||||
<div class="number">{{ByMonthdata.unPassNum || "0"}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -26,6 +26,28 @@
|
||||
<script setup lang="ts">
|
||||
import Card from "@/components/card.vue";
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
|
||||
// api
|
||||
import { safecationByMonth } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
// sn
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
onMounted(() => {
|
||||
getlist();
|
||||
});
|
||||
|
||||
const ByMonthdata = ref({});
|
||||
|
||||
const getlist = async () => {
|
||||
const res: any = await safecationByMonth({
|
||||
projectSn: store.sn
|
||||
});
|
||||
console.log("训统计(近一个月内) 培训人员班组统计(近一个月内", res);
|
||||
// overviewdata.value = res.result;
|
||||
ByMonthdata.value = res.result.workerStat;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@ -8,10 +8,17 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import Card from "@/components/card.vue";
|
||||
import { onMounted } from "vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
import symbolIcon from "@/assets/images/lineSymbol.png";
|
||||
|
||||
// api
|
||||
import { safecationByMonth } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
// sn
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
function draw() {
|
||||
let chartDom = document.getElementById("educationBottomRight");
|
||||
if (chartDom) {
|
||||
@ -42,7 +49,8 @@ function draw() {
|
||||
},
|
||||
xAxis: {
|
||||
show: true,
|
||||
data: ["外墙施工人员", "机电安装工", "司机", "油漆工", "木工", "园林工"],
|
||||
// data: ["外墙施工人员", "机电安装工", "司机", "油漆工", "木工", "园林工"],
|
||||
data: xdata.value,
|
||||
triggerEvent: true,
|
||||
axisTick: {
|
||||
show: false,
|
||||
@ -67,6 +75,26 @@ function draw() {
|
||||
}
|
||||
}
|
||||
},
|
||||
dataZoom: {
|
||||
type: "slider", // 滑动条类型
|
||||
show: xdata.value.length > 7 ? true : false, // 是否显示滑动条,在这里可以根据自己的需求做判断,超过时显示进度条
|
||||
startValue: 0, // 展示区域内容的起始数值
|
||||
endValue: 6, // 展示区域内容的结束数值
|
||||
height: 6, // 滑动条组件高度
|
||||
bottom: 0, // 距离图表区域下边的距离
|
||||
showDetail: false, // 拖拽时是否显示详情
|
||||
showDataShadow: false, // 是否在组件中显示数据阴影
|
||||
fillerColor: "#2493f4", // 平移条的填充颜色
|
||||
borderColor: "transparent", // 边框颜色
|
||||
zoomLock: true, // 锁定视图
|
||||
brushSelect: false, // 不可缩放 滑动条默认是有手柄可以进行展示的内容区域缩放的,不太美观
|
||||
// 通过该属性可以只滑动,不显示缩放功能
|
||||
handleStyle: {
|
||||
// 手柄样式
|
||||
opacity: 0,
|
||||
// borderRadius: 20
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
triggerEvent: true,
|
||||
nameTextStyle: {
|
||||
@ -133,7 +161,8 @@ function draw() {
|
||||
}
|
||||
}
|
||||
},
|
||||
data: [100, 200, 300, 100, 20, 60, 120],
|
||||
// data: [100, 200, 300, 100, 20, 60, 120],
|
||||
data: servedata.value,
|
||||
z: 10
|
||||
},
|
||||
{
|
||||
@ -147,16 +176,33 @@ function draw() {
|
||||
// color: "rgba(11,47,68,.8)"
|
||||
}
|
||||
},
|
||||
data: [100, 200, 300, 100, 20, 60, 120],
|
||||
// data: [100, 200, 300, 100, 20, 60, 120],
|
||||
data: servedata.value,
|
||||
z: 9
|
||||
}
|
||||
]
|
||||
};
|
||||
echartsTest.setOption(option);
|
||||
}
|
||||
onMounted(() => {
|
||||
draw();
|
||||
|
||||
onMounted(async () => {
|
||||
await getTypelist();
|
||||
await draw();
|
||||
});
|
||||
|
||||
const xdata = ref([]);
|
||||
const servedata = ref([]);
|
||||
|
||||
const getTypelist = async () => {
|
||||
const res: any = await safecationByMonth({
|
||||
projectSn: store.sn
|
||||
});
|
||||
console.log("教育类型分析", res);
|
||||
if (res.result) {
|
||||
xdata.value = res.result.teamStat.map(obj => obj.name);
|
||||
servedata.value = res.result.teamStat.map(obj => obj.num);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@ -10,12 +10,18 @@
|
||||
import { onMounted, ref } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
import Card from "@/components/card.vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
// const store = GlobalStore();
|
||||
// const airType = ref(1);
|
||||
// let gasName = ref(1 as any);
|
||||
let selectDay = ref(1 as any);
|
||||
|
||||
// api
|
||||
import { safecationByType } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
// sn
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
// let noiseList = ref([
|
||||
// {
|
||||
// value: 1,
|
||||
@ -54,78 +60,78 @@ let dayList = ref([
|
||||
}
|
||||
]);
|
||||
let dataList = ref([
|
||||
{
|
||||
value: 37,
|
||||
show: true,
|
||||
name: "入场安全教育",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#82FBEA",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 46,
|
||||
show: true,
|
||||
name: "日常安全教育",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#EEA959",
|
||||
borderWidth: 20
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
name: "每日安全交底",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#4CC4F8"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 30,
|
||||
show: true,
|
||||
name: "VR安全教育",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#E0D838"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 8,
|
||||
show: true,
|
||||
name: "班前教育",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#EC6266"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 32,
|
||||
show: true,
|
||||
name: "日常教育(日常违规教育)",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#6375C7"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
value: 15,
|
||||
show: true,
|
||||
name: "每日交底(专项方案交底)",
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#81F279"
|
||||
}
|
||||
}
|
||||
}
|
||||
// {
|
||||
// value: 37,
|
||||
// show: true,
|
||||
// name: "入场安全教育",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#82FBEA",
|
||||
// borderWidth: 20
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 46,
|
||||
// show: true,
|
||||
// name: "日常安全教育",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#EEA959",
|
||||
// borderWidth: 20
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 30,
|
||||
// show: true,
|
||||
// name: "每日安全交底",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#4CC4F8"
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 30,
|
||||
// show: true,
|
||||
// name: "VR安全教育",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#E0D838"
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 8,
|
||||
// show: true,
|
||||
// name: "班前教育",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#EC6266"
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 32,
|
||||
// show: true,
|
||||
// name: "日常教育(日常违规教育)",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#6375C7"
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// value: 15,
|
||||
// show: true,
|
||||
// name: "每日交底(专项方案交底)",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: "#81F279"
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
]);
|
||||
function Pie() {
|
||||
let dataArr = [];
|
||||
@ -159,8 +165,9 @@ function Pie() {
|
||||
return dataArr;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
drawEchart();
|
||||
onMounted(async () => {
|
||||
await getTypelist();
|
||||
await drawEchart();
|
||||
});
|
||||
|
||||
function drawEchart() {
|
||||
@ -201,13 +208,13 @@ function drawEchart() {
|
||||
subtextStyle: {
|
||||
color: "#ccc",
|
||||
fontSize: 14,
|
||||
fontWeight: "normal",
|
||||
fontWeight: "normal"
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
selectedMode: false, // 取消图例上的点击事件
|
||||
icon: "rect",
|
||||
type: "plain",
|
||||
type: "scroll", // 设置为滚动类型
|
||||
orient: "vertical",
|
||||
left: "52%",
|
||||
top: "8%",
|
||||
@ -249,6 +256,7 @@ function drawEchart() {
|
||||
}
|
||||
}
|
||||
},
|
||||
color:['#82FBEA','#EEA959','#4CC4F8','#E0D838','#EC6266','#6375C7','#81F279'],
|
||||
series: [
|
||||
// 外侧光线
|
||||
{
|
||||
@ -394,6 +402,22 @@ function drawEchart() {
|
||||
};
|
||||
echartsTest.setOption(option, true);
|
||||
}
|
||||
|
||||
const getTypelist = async () => {
|
||||
const res: any = await safecationByType({
|
||||
projectSn: store.sn
|
||||
});
|
||||
console.log("教育类型分析", res);
|
||||
if (res.result) {
|
||||
dataList.value = res.result.map(item => {
|
||||
return {
|
||||
value:item.num,
|
||||
name:item.type,
|
||||
show: true,
|
||||
}
|
||||
})
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -8,10 +8,17 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import Card from "@/components/card.vue";
|
||||
import { onMounted } from "vue";
|
||||
import { onMounted, ref } from "vue";
|
||||
import * as echarts from "echarts";
|
||||
import symbolIcon from "@/assets/images/lineSymbol.png";
|
||||
|
||||
// api
|
||||
import { safecationByWeek } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
// sn
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
function draw() {
|
||||
let chartDom = document.getElementById("educationCenterTop");
|
||||
if (chartDom) {
|
||||
@ -42,7 +49,8 @@ function draw() {
|
||||
},
|
||||
xAxis: {
|
||||
show: true,
|
||||
data: ["8.30", "8.31", "9.1", "9.2", "9.4", "9.5", "9.6"],
|
||||
// data: ["8.30", "8.31", "9.1", "9.2", "9.4", "9.5", "9.6"],
|
||||
data: xdata.value,
|
||||
triggerEvent: true,
|
||||
axisTick: {
|
||||
show: false,
|
||||
@ -132,7 +140,8 @@ function draw() {
|
||||
}
|
||||
}
|
||||
},
|
||||
data: [100, 200, 300, 100, 20, 60, 120],
|
||||
// data: [100, 200, 300, 100, 20, 60, 120],
|
||||
data: servedata.value,
|
||||
z: 10
|
||||
},
|
||||
{
|
||||
@ -146,15 +155,33 @@ function draw() {
|
||||
// color: "rgba(11,47,68,.8)"
|
||||
}
|
||||
},
|
||||
data: [100, 200, 300, 100, 20, 60, 120],
|
||||
data: servedata.value,
|
||||
z: 9
|
||||
}
|
||||
]
|
||||
};
|
||||
echartsTest.setOption(option);
|
||||
}
|
||||
onMounted(() => {
|
||||
draw();
|
||||
|
||||
const xdata = ref([]);
|
||||
const servedata = ref([]);
|
||||
|
||||
const getctlist = async () => {
|
||||
const res: any = await safecationByWeek({
|
||||
projectSn: store.sn
|
||||
});
|
||||
console.log("班前教育人数统计", res);
|
||||
if (res.result) {
|
||||
xdata.value = res.result.map(obj => obj.time);
|
||||
servedata.value = res.result.map(obj => obj.num);
|
||||
console.log("xdata.value", xdata.value);
|
||||
console.log("servedata.value", servedata.value);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
await getctlist();
|
||||
await draw();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<div class="trainee-number">
|
||||
<div class="text-detail">
|
||||
培训总人数:
|
||||
<span>200</span>
|
||||
<span>{{overviewdata.educationNum || '0'}}</span>
|
||||
</div>
|
||||
<div class="icon-detail">
|
||||
<img :src="detailIcon1" />
|
||||
@ -13,7 +13,7 @@
|
||||
<div class="pass-number">
|
||||
<div class="text-detail">
|
||||
合格人数:
|
||||
<span>120</span>
|
||||
<span>{{overviewdata.educationPass || '0'}}</span>
|
||||
</div>
|
||||
<div class="icon-detail">
|
||||
<img :src="detailIcon2" />
|
||||
@ -22,8 +22,8 @@
|
||||
<div class="trainee-record">
|
||||
<div class="text-detail">
|
||||
最新培训记录:
|
||||
<span>20</span>
|
||||
<span style="font-size: 12px; margin-top: 1%">min</span>
|
||||
<span>{{overviewdata.educationNewRecord || '0'}}</span>
|
||||
<!-- <span style="font-size: 12px; margin-top: 1%"></span> -->
|
||||
</div>
|
||||
<div class="icon-detail">
|
||||
<img :src="detailIcon3" />
|
||||
@ -40,6 +40,13 @@
|
||||
import Card from "@/components/card.vue";
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
|
||||
// api
|
||||
import { safecationOverview } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
// sn
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
import detailIcon1 from "@/assets/images/safeEducation/icon1.png";
|
||||
import detailIcon2 from "@/assets/images/safeEducation/icon2.png";
|
||||
import detailIcon3 from "@/assets/images/safeEducation/icon3.png";
|
||||
@ -72,6 +79,20 @@ const list = reactive([
|
||||
color: "#EC6266"
|
||||
}
|
||||
]);
|
||||
|
||||
onMounted(() => {
|
||||
getlist();
|
||||
});
|
||||
|
||||
const overviewdata = ref({});
|
||||
|
||||
const getlist = async () => {
|
||||
const res: any = await safecationOverview({
|
||||
projectSn: store.sn
|
||||
});
|
||||
// console.log("培训概况", res);
|
||||
overviewdata.value = res.result
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@ -174,7 +195,8 @@ const list = reactive([
|
||||
right: -3%;
|
||||
top: 10%;
|
||||
.text-detail {
|
||||
height: 15%;
|
||||
// white-space: nowrap;
|
||||
// height: 15%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@ -183,6 +205,8 @@ const list = reactive([
|
||||
background-size: 100% 100%;
|
||||
color: #ffffff;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
span {
|
||||
font-size: 16px;
|
||||
font-family: OPPOSans-Heavy, OPPOSans;
|
||||
|
||||
@ -11,20 +11,21 @@
|
||||
<div>是否合格</div>
|
||||
<div>培训得分</div>
|
||||
</div>
|
||||
<el-scrollbar class="list-box">
|
||||
<el-scrollbar class="list-box" @scroll="handleScroll" ref="refScrollbarer">
|
||||
<div v-for="(item, index) in list" class="list-style" :key="item.id">
|
||||
<div>{{ index + 1 }}</div>
|
||||
<div>{{ item.personName }}</div>
|
||||
<div>{{ item.personGrade }}</div>
|
||||
<div>{{ item.personAge }}</div>
|
||||
<div>{{ item.teamGroup }}</div>
|
||||
<div :style="{ color: item.passType == 1 ? '#EC6266' : '#FFFFFF' }">
|
||||
{{ item.passType == 0 ? "合格" : "不合格" }}
|
||||
<div>{{ item.workerName }}</div>
|
||||
<div>{{ item.sex == 1 ? '男' : '女' }}</div>
|
||||
<div>{{ item.age }}</div>
|
||||
<div>{{ item.teamName }}</div>
|
||||
<div :style="{ color: item.isQualified != 1 ? '#EC6266' : '#FFFFFF' }">
|
||||
{{ item.isQualified
|
||||
== 1 ? "合格" : "不合格" }}
|
||||
</div>
|
||||
<div>{{ item.trainScore }}</div>
|
||||
<div>{{ item.score }}</div>
|
||||
</div>
|
||||
<div class="not-data" v-if="list.length == 0">
|
||||
<img src="@/assets/images/noData.png" alt="" />
|
||||
<img src="@/assets/images/noData.png" alt />
|
||||
<p>暂无数据</p>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
@ -35,160 +36,93 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import Card from "@/components/card.vue";
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
import { reactive, ref, onMounted, nextTick } from "vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
const store = GlobalStore();
|
||||
|
||||
import { safeWorkerPage } from "@/api/modules/safeEdgeProtection";
|
||||
|
||||
let showDialog = ref(false as any);
|
||||
let rangeTime = ref("" as any);
|
||||
const list = reactive([
|
||||
{
|
||||
id: 1,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 1,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 1,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 1,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
|
||||
{
|
||||
id: 8,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
personName: "梁雷",
|
||||
personGrade: "女",
|
||||
personAge: "54",
|
||||
teamGroup: "木工班组",
|
||||
passType: 0,
|
||||
trainScore: 78
|
||||
}
|
||||
const list = ref([
|
||||
// {
|
||||
// id: 1,
|
||||
// personName: "梁雷",
|
||||
// personGrade: "女",
|
||||
// personAge: "54",
|
||||
// teamGroup: "木工班组",
|
||||
// passType: 0,
|
||||
// trainScore: 78
|
||||
// },
|
||||
]);
|
||||
|
||||
onMounted(async () => {});
|
||||
onMounted(async () => {
|
||||
getProgressListData();
|
||||
});
|
||||
|
||||
const refScrollbarer = ref(null as any); // 绑定到滚动的盒子上
|
||||
const moreScroll = ref(true as any);
|
||||
|
||||
const pagInfo = ref({
|
||||
pageNo: 1, //页数
|
||||
pageSize: 30, //条数
|
||||
total: 0 //总条数
|
||||
});
|
||||
|
||||
// 智能安全帽--查询报警信息
|
||||
function getProgressListData() {
|
||||
let data = {
|
||||
pageNo: pagInfo.value.pageNo,
|
||||
pageSize: pagInfo.value.pageSize,
|
||||
projectSn: store.sn,
|
||||
videoType: 1
|
||||
};
|
||||
safeWorkerPage(data).then(res => {
|
||||
moreScroll.value = false;
|
||||
if (res.code == 200 && res.result.records.length > 0) {
|
||||
console.log("========近七日人员培训记录======", res.result.records);
|
||||
list.value = list.value.concat(res.result.records);
|
||||
// listData.value = res.result.records
|
||||
// console.log("listData.value=============", listData.value);
|
||||
|
||||
pagInfo.value.total = res.result.total;
|
||||
nextTick(() => {
|
||||
moreScroll.value = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 新智能安全帽-分页
|
||||
function handleScroll(event) {
|
||||
// console.log("event", event);
|
||||
|
||||
refScrollbarer.value.wrapRef.addEventListener("scroll", (e: any) => {
|
||||
const scrollTop = e.target.scrollTop;
|
||||
const scrollHeight = e.target.scrollHeight;
|
||||
const clientHeight = e.target.clientHeight;
|
||||
|
||||
// console.log("event", event);
|
||||
|
||||
// 向上加载更多
|
||||
if (scrollTop >= scrollHeight - clientHeight - 1) {
|
||||
if (moreScroll.value) {
|
||||
console.log("===================加载第二页===================");
|
||||
pagInfo.value.pageNo += 1;
|
||||
console.log("pagInfo.value.pageNo", pagInfo.value.pageNo);
|
||||
moreScroll.value = false;
|
||||
getProgressListData();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// const { scrollTop, scrollHeight, clientHeight } = event.target;
|
||||
// // 判断是否滚动到底部
|
||||
// if (scrollTop + clientHeight >= scrollHeight) {
|
||||
// // 触发滚动到底部的事件
|
||||
// console.log("===================加载第二页===================");
|
||||
// }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -269,6 +203,9 @@ onMounted(async () => {});
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
width: 14%;
|
||||
white-space: nowrap; /* 强制文本在一行内显示 */
|
||||
overflow: hidden; /* 超出部分隐藏 */
|
||||
text-overflow: ellipsis; /* 超出部分显示省略号 */
|
||||
}
|
||||
}
|
||||
.list-style:hover {
|
||||
@ -278,9 +215,10 @@ onMounted(async () => {});
|
||||
}
|
||||
}
|
||||
.not-data {
|
||||
top: 73%;
|
||||
width: 12%;
|
||||
left: 44%;
|
||||
top: 50%;
|
||||
// width: 12%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
img {
|
||||
width: 40%;
|
||||
@ -293,3 +231,5 @@ onMounted(async () => {});
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user