<template>
|
<div class="app-container">
|
<el-form
|
class="responsive-form"
|
:model="queryParams"
|
ref="queryRef"
|
:inline="true"
|
v-show="showSearch"
|
label-position="left"
|
>
|
<el-row type="flex" justify="left">
|
<el-col :span="locale === 'zh' ?7 :9">
|
<el-form-item
|
:label-width="locale === 'zh' ? '90px' : '130px'"
|
:label="$t('plan.query.requireTraceID')"
|
prop="requireTrackId"
|
>
|
<el-input
|
:style="{ width: locale === 'zh' ? '180px' : '230px' }"
|
v-model="queryParams.requireTrackId"
|
:placeholder="`${$t('common.common.placeholder')}${$t('plan.query.requireTraceID')}`"
|
clearable
|
@keyup.enter="handleQuery"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="locale === 'zh' ? 7: 9">
|
<el-form-item :label-width="locale === 'zh' ? '48px' : '100px'" :label="$t('plan.query.itemNumber')" prop="bomLineCode">
|
<el-input
|
:style="{ width: locale === 'zh' ? '180px' : '210px' }"
|
v-model="queryParams.bomLineCode"
|
:placeholder="`${$t('common.common.placeholder')}${$t(
|
'plan.query.itemNumber'
|
)}`"
|
clearable
|
@keyup.enter="handleQuery"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="locale === 'zh' ? 10:6" style="text-align: right">
|
<el-form-item class="column-with-margin">
|
<el-button type="primary" icon="Search" @click="handleQuery">{{
|
$t("common.common.query")
|
}}</el-button>
|
<el-button icon="Refresh" @click="resetQuery">{{
|
$t("common.common.reset")
|
}}</el-button>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button
|
type="warning"
|
plain
|
icon="Download"
|
@click="handleExport"
|
v-hasPermi="['Aps:ApsPlateStandardRequire:supplyGapListExport']"
|
>{{ $t("common.common.export") }}</el-button
|
>
|
</el-col>
|
<right-toolbar
|
v-model:showSearch="showSearch"
|
@queryTable="getList"
|
></right-toolbar>
|
</el-row>
|
<HxlhTable
|
style="width: 100%"
|
:columns="columns"
|
:data="gapList"
|
:loading="loading"
|
:height="height"
|
ref="tableRef"
|
:page="page"
|
@changePageNo="changePageNo"
|
@changePageSize="changePageSize"
|
@on-checkbox="handleCheckboxChange"
|
class="auto-height-grid"
|
>
|
</HxlhTable>
|
</div>
|
</template>
|
|
<script setup name="SheetMetalSupplyGap">
|
import HxlhTable from "@/components/HxlhTable";
|
import {
|
supplyGapList
|
} from "@/api/basicData/sheetMetalConfig/sheetMetalConfig";
|
import { listAll_plant } from "@/api/basicData/plant";
|
import { useI18n } from "vue-i18n"; //要在js中使用国际化
|
const { t, locale } = useI18n();
|
const { proxy } = getCurrentInstance();
|
const tableRef = ref();
|
const gapList = ref([]);
|
const loading = ref(true);
|
const showSearch = ref(true);
|
const ids = ref([]);
|
const single = ref(true);
|
const multiple = ref(true);
|
const total = ref(0);
|
const title = ref("");
|
const data = reactive({
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
bomLineCode: null,
|
requireTrackId: null
|
},
|
});
|
const { queryParams } = toRefs(data);
|
const plantList = ref([]);
|
const height = ref(document.documentElement.clientHeight - 220 + "px;");
|
// 表格配置-列表
|
const columns = ref([]);
|
// 分页属性
|
const page = ref({
|
total: 0,
|
current: 1,
|
size: 10,
|
});
|
watch(
|
locale,
|
(newLocale) => {
|
columns.value = [
|
{
|
title: t("plan.table.requireID"),
|
field: "id",
|
width: "180",
|
align: "center",
|
},
|
{
|
title: t("plan.table.requireTraceID"),
|
field: "requireTrackId",
|
width: "180",
|
align: "center",
|
},
|
{
|
title: t("plan.table.itemNumber"),
|
field: "bomLineCode",
|
width: "auto",
|
align: "center",
|
},
|
// {
|
// title: t("plan.table.bomLowCode"),
|
// field: "bomLineLevel",
|
// width: 200,
|
// align: "center",
|
// },
|
// {
|
// title: t("plan.table.matchState"),
|
// field: "matchState",
|
// width: 200,
|
// align: "center",
|
// },
|
// {
|
// title: t("plan.table.matchPattern"),
|
// field: "matchMode",
|
// width: 200,
|
// align: "center",
|
// },
|
{
|
title: t("plan.table.unmatchedDemandQuantity"),
|
field: "unmatchedDemandAmount",
|
width: "auto",
|
align: "center",
|
},
|
{
|
title: t("plan.table.planStartDay"),
|
field: "startDate",
|
width: 162,
|
align: "center",
|
},
|
{
|
title: t("plan.table.planEndDayDate"),
|
field: "completeDate",
|
width: 162,
|
align: "center",
|
},
|
{
|
title: t("plan.table.requirementDate"),
|
field: "demandDate",
|
width: 162,
|
align: "center",
|
},
|
{
|
title: t("plan.table.applicableFactories"),
|
field: "orgCode",
|
width: "auto",
|
align: "center",
|
formatter: ({ cellValue, row, column }) => {
|
if (cellValue) {
|
for (let i = 0; i < plantList.value.length; i++) {
|
if (cellValue === plantList.value[i].plantCode) {
|
return plantList.value[i].plantName;
|
}
|
}
|
}
|
},
|
},
|
{
|
title: t("plan.table.productionBase"),
|
field: "productionBase",
|
width: "auto",
|
align: "center",
|
},
|
];
|
},
|
{ immediate: true, deep: true }
|
);
|
/** 查询日历管理列表 */
|
function getList() {
|
loading.value = true;
|
supplyGapList(queryParams.value).then((response) => {
|
gapList.value = response.rows;
|
page.value.total = response.total;
|
loading.value = false;
|
}).catch(()=>{
|
loading.value = false;
|
});
|
listAll_plant({}).then(response=>{
|
plantList.value = response.data;
|
})
|
}
|
|
/** 搜索按钮操作 */
|
function handleQuery() {
|
queryParams.value.pageNum = 1;
|
page.value.current = 1
|
getList();
|
}
|
|
/** 重置按钮操作 */
|
function resetQuery() {
|
proxy.resetForm("queryRef");
|
handleQuery();
|
}
|
/** 导出按钮操作 */
|
function handleExport() {
|
proxy.download(
|
"aps/ApsPlateStandardRequire/supplyGapListExport",
|
{
|
...queryParams.value,
|
},
|
`supplyGapListExport_${new Date().getTime()}.xlsx`
|
);
|
}
|
function changePageNo(currentPage) {
|
queryParams.value.pageNum = currentPage;
|
page.value.current = currentPage;
|
getList();
|
}
|
function changePageSize(pageSize) {
|
page.value.current = 1;
|
queryParams.value.pageNum = 1;
|
queryParams.value.pageSize = pageSize;
|
getList();
|
}
|
onMounted(() => {
|
getList();
|
});
|
</script>
|
<style lang="scss" scoped>
|
.column-with-margin {
|
margin-right: 0px;
|
}
|
.title_bar_line {
|
display: flex;
|
justify-content: flex-start;
|
align-items: center;
|
color: #333;
|
margin-bottom: 10px;
|
.line_short {
|
width: 5%;
|
height: 1px;
|
margin-right: 20px;
|
border-top: 1px solid #ddd;
|
}
|
.line_long {
|
width: 60%;
|
height: 1px;
|
margin-left: 20px;
|
border-top: 1px solid #ddd;
|
}
|
}
|
.week_flex {
|
display: flex;
|
justify-content: flex-start;
|
align-content: center;
|
color: #606266;
|
font-weight: 700;
|
margin-left: 20px;
|
&.mt20 {
|
margin-top: 20px;
|
margin-left: 0 !important;
|
}
|
.week_flex_item {
|
&:nth-child(1) {
|
margin-top: 5px;
|
}
|
&:nth-child(2) {
|
margin-left: 20px;
|
}
|
}
|
}
|
.factory_use_item {
|
margin-top: 10px;
|
}
|
.mart5 {
|
margin-top: 5px;
|
}
|
.custom-height {
|
height: 200px; /* 或者使用 min-height */
|
}
|
.auto-height-grid .xe-body .xe-body--row {
|
height: auto; /* 或者使用 min-height */
|
}
|
</style>
|
