<template>
|
<view>
|
<wd-row>
|
<wd-col :span="21">
|
<wd-search
|
v-model="searchKeyword"
|
placeholder="请输入"
|
placeholder-left
|
hide-cancel
|
@search="handleSearch"
|
@clear="handleClear"
|
></wd-search>
|
</wd-col>
|
<wd-col :span="3">
|
<view class="scan_box" @click="openScan">
|
<wd-icon name="scan" size="24px" color="#0D867F"></wd-icon>
|
</view>
|
</wd-col>
|
</wd-row>
|
<wd-tabs v-model="tab" auto-line-width>
|
<wd-tab :title="`待生产(${total.wait})`" class="tab_bg">
|
<ProductList
|
ref="waitRef"
|
:key="`wait-${searchKey}`"
|
:api="ManageApi.getProductList"
|
state="待完成"
|
:search="searchKeyword"
|
@ok="changeWait"
|
/>
|
</wd-tab>
|
<wd-tab :title="`已生产(${total.already})`" class="tab_bg">
|
<ProductList
|
ref="alreadyRef"
|
:key="`already-${searchKey}`"
|
:api="ManageApi.getProductList"
|
state="已完成"
|
:search="searchKeyword"
|
@ok="changeAlready"
|
/>
|
</wd-tab>
|
</wd-tabs>
|
<Scan ref="scanRef" emitName="scan" />
|
<wd-toast />
|
</view>
|
</template>
|
|
<script lang="ts" setup>
|
import ManageApi from "@/api/product/manage";
|
import { ref } from "vue";
|
import ProductList from "./list/index.vue";
|
import Scan from "@/components/scan/index.vue";
|
import { useUserStore } from "@/store/modules/user";
|
import reportApi from "@/api/work/report";
|
import { useToast } from "wot-design-uni";
|
|
const scanRef = ref();
|
const userStore = useUserStore();
|
const userInfo: any = computed(() => userStore.userInfo);
|
const toast = useToast();
|
|
const waitRef = ref();
|
const alreadyRef = ref();
|
const tab = ref<number>(0);
|
const searchKeyword = ref("");
|
const searchKey = ref(0);
|
const total = reactive({
|
wait: 0,
|
already: 0,
|
});
|
|
const changeWait = (num: number) => {
|
total.wait = num;
|
};
|
|
const changeAlready = (num: number) => {
|
total.already = num;
|
};
|
|
// 获取统计数据
|
const getStatistics = async () => {
|
try {
|
const params: any = {};
|
if (searchKeyword.value) {
|
params.search = searchKeyword.value;
|
}
|
const { code, data } = await ManageApi.getProductStatistics(params);
|
if (code === 200 && data) {
|
total.wait = data["待完成"] || 0;
|
total.already = data["已完成"] || 0;
|
}
|
} catch (error) {
|
console.error("获取统计数据失败:", error);
|
}
|
};
|
|
const handleSearch = () => {
|
searchKey.value++;
|
// 搜索时更新统计数据
|
getStatistics();
|
};
|
|
const handleClear = () => {
|
searchKeyword.value = "";
|
handleSearch();
|
};
|
|
const openScan = () => {
|
scanRef.value.triggerScan();
|
};
|
|
const getScanCode = async () => {
|
console.log("生产管理扫码回调");
|
const { code } = await reportApi.sendWorkTime({
|
userName: userInfo.value.userName,
|
});
|
if (code == 200) {
|
toast.success("扫码成功");
|
}
|
};
|
|
// 确保先移除再添加监听
|
const setupScanListener = () => {
|
uni.$off("scan", getScanCode); // 先移除旧的
|
uni.$on("scan", getScanCode); // 再添加新的
|
};
|
|
onMounted(() => {
|
// 开启广播监听事件
|
setupScanListener();
|
// 获取统计数据
|
getStatistics();
|
console.log("显示1");
|
});
|
onUnmounted(() => {
|
// 开启广播监听事件
|
uni.$off("scan", getScanCode);
|
console.log("离开1");
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep .wd-search__block {
|
border-radius: unset;
|
}
|
.scan_box {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 38px;
|
height: 38px;
|
padding: 6px;
|
background: #fff;
|
}
|
::v-deep .wd-tabs__line {
|
background: #0d867f;
|
}
|
::v-deep .wd-tabs__nav {
|
border-bottom: 1px #dddddd solid;
|
}
|
.tab_bg {
|
background: #f3f9f8;
|
}
|
|
.icon_box {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 20px;
|
height: 20px;
|
background: #e7f4ec99;
|
border-radius: 50%;
|
}
|
|
.statistics_box {
|
margin: 15px;
|
}
|
</style>
|
