<template>
|
<view>
|
<wd-row>
|
<wd-col :span="21">
|
<wd-search placeholder-left hide-cancel></wd-search>
|
</wd-col>
|
<wd-col :span="3">
|
<view class="scan_box">
|
<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"
|
:api="ManageApi.getProductList"
|
state="待完成"
|
@ok="changeWait"
|
/>
|
</wd-tab>
|
<wd-tab :title="`已生产(${total.already})`" class="tab_bg">
|
<ProductList
|
ref="alreadyRef"
|
:api="ManageApi.getProductList"
|
state="已完成"
|
@ok="changeAlready"
|
/>
|
</wd-tab>
|
</wd-tabs>
|
</view>
|
</template>
|
|
<script lang="ts" setup>
|
import ManageApi from "@/api/product/manage";
|
import { ref } from "vue";
|
import ProductList from "./list/index.vue";
|
|
const waitRef = ref();
|
const alreadyRef = ref();
|
const tab = ref<number>(0);
|
const total = reactive({
|
wait: 0,
|
already: 0,
|
});
|
|
const changeWait = (num: number) => {
|
total.wait = num;
|
};
|
|
const changeAlready = (num: number) => {
|
total.already = num;
|
};
|
</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>
|
