|
|
@@ -1,14 +1,19 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div class="commonTitle">待完成工单[{{ ordersSum }}]</div>
|
|
|
+ <div class="commonTitle">
|
|
|
+ {{ activeName == "ok" ? "已完成工单" : "待完成工单" }}[{{ ordersSum }}]
|
|
|
+ </div>
|
|
|
<el-tabs v-model="activeName" class="demo-tabs" type="card" @tab-click="handleClick">
|
|
|
<el-tab-pane label="未完成" name="false" />
|
|
|
<el-tab-pane label="已完成" name="ok" />
|
|
|
</el-tabs>
|
|
|
- <el-scrollbar class="barHeight">
|
|
|
- <Order v-for="(item, index) in selectOrder" :key="index" @click="setSlectIndex(item)"
|
|
|
- :hoverStatus="item.index == selectIndex ? true : false" :item="item" />
|
|
|
- <Empty v-if="selectOrder.length < 1" />
|
|
|
+ <el-scrollbar class="barHeight" ref="wrapRef" @scroll="handleScroll">
|
|
|
+ <Order v-for="(item, index) in ordersDataArray" :key="index" @click="setSlectIndex(index)"
|
|
|
+ :hoverStatus="index == selectIndex ? true : false" :item="item" />
|
|
|
+ <Empty v-if="ordersDataArray.length < 1" />
|
|
|
+ <div class="describeText notice" v-if="ordersQuery.pageNo == ordersQuery.totalPages">
|
|
|
+ 已经到底啦~
|
|
|
+ </div>
|
|
|
</el-scrollbar>
|
|
|
<Empty v-if="ordersDataArray.length < 1" />
|
|
|
</div>
|
|
|
@@ -17,32 +22,40 @@
|
|
|
import Order from "@/views/process/components/order.vue";
|
|
|
import { useProcessStore } from "@/store";
|
|
|
import { useDictionaryStore } from "@/store";
|
|
|
+import { getOrders } from "@/api/process";
|
|
|
const dictS = useDictionaryStore();
|
|
|
const store = useProcessStore();
|
|
|
const selectSeqIndex = inject("selectSeqIndex");
|
|
|
-const props = defineProps<{
|
|
|
- ordersSum?: number;
|
|
|
-}>();
|
|
|
+const ordersSum = ref(0);
|
|
|
const emit = defineEmits(["getindex"]);
|
|
|
const ordersDataArray = inject("ordersDataArray");
|
|
|
-const selectOrder = computed(() => {
|
|
|
- let array = [];
|
|
|
- if (activeName.value == "ok") {
|
|
|
- array = ordersDataArray.value.filter((item) => item.workOrderState == "6");
|
|
|
- } else {
|
|
|
- array = ordersDataArray.value.filter((item) => item.workOrderState != "6");
|
|
|
- }
|
|
|
- return array;
|
|
|
+//获取未完成订单的参数
|
|
|
+const ordersQuery = ref({
|
|
|
+ orders: [],
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize: 5,
|
|
|
+ queryComplete: 0,
|
|
|
+ totalPages: 1,
|
|
|
});
|
|
|
+const wrapRef = ref(null);
|
|
|
+//获取未完成订单Data
|
|
|
+const getOrdersData = async () => {
|
|
|
+ const { code, data } = await getOrders(ordersQuery.value);
|
|
|
+ if (code == "200") {
|
|
|
+ ordersDataArray.value.push(...data.records);
|
|
|
+ ordersSum.value = data.totalCount;
|
|
|
+ ordersQuery.value.totalPages = data.totalPages;
|
|
|
+ }
|
|
|
+};
|
|
|
const activeName = ref("false");
|
|
|
//这里是存放控制当前选择工序的index
|
|
|
const selectIndex = ref(null);
|
|
|
-const setSlectIndex = (item: object) => {
|
|
|
- if (item == null) {
|
|
|
+const setSlectIndex = (index: number) => {
|
|
|
+ if (index == null) {
|
|
|
selectIndex.value = null;
|
|
|
return;
|
|
|
}
|
|
|
- selectIndex.value = item.index;
|
|
|
+ selectIndex.value = index;
|
|
|
store.odersData.productLineId =
|
|
|
ordersDataArray.value[selectIndex.value].productLineId;
|
|
|
store.odersData.workOrderCode =
|
|
|
@@ -65,14 +78,45 @@ const handleClick = (tab: TabsPaneContext, event: Event) => {
|
|
|
store.processInfo.materialName = "";
|
|
|
store.processInfo.materialModel = "";
|
|
|
};
|
|
|
-// watch(ordersDataArray, () => {
|
|
|
-// if (ordersDataArray.value.length > 0) setSlectIndex(0);
|
|
|
-// });
|
|
|
+//滚动事件
|
|
|
+const handleScroll = (obj: obj) => {
|
|
|
+ //当发生滚动触底时
|
|
|
+ if (
|
|
|
+ wrapRef.value.wrapRef.scrollHeight ==
|
|
|
+ Math.ceil(obj.scrollTop) + wrapRef.value.wrapRef.clientHeight
|
|
|
+ ) {
|
|
|
+ if (ordersQuery.value.pageNo < ordersQuery.value.totalPages) {
|
|
|
+ ordersQuery.value.pageNo = ordersQuery.value.pageNo + 1;
|
|
|
+ getOrdersData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+watch(
|
|
|
+ () => activeName.value,
|
|
|
+ (val) => {
|
|
|
+ if (val == "ok") {
|
|
|
+ ordersQuery.value.queryComplete = 1;
|
|
|
+ ordersQuery.value.pageNo = 1;
|
|
|
+ } else {
|
|
|
+ ordersQuery.value.queryComplete = 0;
|
|
|
+ ordersQuery.value.pageNo = 1;
|
|
|
+ }
|
|
|
+ ordersDataArray.value = [];
|
|
|
+ getOrdersData();
|
|
|
+ }
|
|
|
+);
|
|
|
+onMounted(() => {
|
|
|
+ getOrdersData();
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.barHeight {
|
|
|
height: calc(100vh - 265px);
|
|
|
+
|
|
|
+ .notice {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
:deep(.el-tabs--card > .el-tabs__header .el-tabs__nav) {
|
dy