fix:searchHeader样式修改

This commit is contained in:
shijing 2024-06-19 13:38:18 +08:00
parent 21c1575ebb
commit c5bd0352ec
4 changed files with 519 additions and 392 deletions

View File

@ -1,24 +1,47 @@
<template> <template>
<el-container> <el-container>
<el-header style="height: 50%; padding: 0;"> <el-header style="height: 50%; padding: 0">
<el-container> <el-container>
<el-header> <el-header>
<div class="left-panel"> <div class="left-panel">
<div style="font-size: 14px">仓库</div> <div style="font-size: 14px">仓库</div>
<el-select v-model="query.warehouse" clearable placeholder="所在仓库" @change="handleQuery" <el-select
style="margin-left: 4px"> v-model="query.warehouse"
<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.name" clearable
:value="item.id"></el-option> placeholder="所在仓库"
@change="handleQuery"
style="margin-left: 10px; width: 150px"
>
<el-option
v-for="item in warehouseOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-input v-model="query.search" placeholder="物料名/批次号" clearable <el-input
style="margin-right: 5px;"></el-input> v-model="query.search"
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button> placeholder="物料名/批次号"
clearable
style="margin-right: 5px"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="params"> <scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="params"
>
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column label="批次" prop="batch"> <el-table-column label="批次" prop="batch">
</el-table-column> </el-table-column>
@ -27,7 +50,8 @@
<el-table-column label="规格型号"> <el-table-column label="规格型号">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.material_"> <span v-if="scope.row.material_">
{{ scope.row.material_.specification }} {{ scope.row.material_.model }} {{ scope.row.material_.specification }}
{{ scope.row.material_.model }}
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
@ -63,8 +87,15 @@
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable ref="table_wm" :apiObj="apiObjWm" row-key="id" :params="paramsWm" stripe> <scTable
<el-table-column label="批次" prop="batch"> </el-table-column> ref="table_wm"
:apiObj="apiObjWm"
row-key="id"
:params="paramsWm"
stripe
>
<el-table-column label="批次" prop="batch">
</el-table-column>
<el-table-column label="物料名" prop="material"> <el-table-column label="物料名" prop="material">
<template #default="scope">{{ <template #default="scope">{{
scope.row.material_.name scope.row.material_.name
@ -85,7 +116,10 @@
scope.row.material_.process_name scope.row.material_.process_name
}}</template> }}</template>
</el-table-column> </el-table-column>
<el-table-column label="所在车间" prop="belong_dept_name"> <el-table-column
label="所在车间"
prop="belong_dept_name"
>
</el-table-column> </el-table-column>
<el-table-column label="数量" prop="count" width="80"> <el-table-column label="数量" prop="count" width="80">
</el-table-column> </el-table-column>
@ -108,29 +142,29 @@ export default {
apiObjWm: this.$API.wpm.wmaterial.list, apiObjWm: this.$API.wpm.wmaterial.list,
paramsWm: { count__gte: 1, material__type: 10 }, paramsWm: { count__gte: 1, material__type: 10 },
// processOptions: [], // processOptions: [],
queryWm: {} queryWm: {},
}; };
}, },
mounted() { mounted() {
this.getWarehouse() this.getWarehouse();
// this.getProcessOptions() // this.getProcessOptions()
}, },
methods: { methods: {
getWarehouse() { getWarehouse() {
this.$API.inm.warehouse.list.req({ page: 0 }).then(res => { this.$API.inm.warehouse.list.req({ page: 0 }).then((res) => {
this.warehouseOptions = res this.warehouseOptions = res;
}) });
}, },
getProcessOptions() { getProcessOptions() {
this.$API.mtm.process.list.req({ page: 0 }).then(res => { this.$API.mtm.process.list.req({ page: 0 }).then((res) => {
this.processOptions = res this.processOptions = res;
}) });
}, },
handleQueryWm() { handleQueryWm() {
this.$refs.table_wm.queryData(this.queryWm) this.$refs.table_wm.queryData(this.queryWm);
}, },
handleQuery() { handleQuery() {
this.$refs.table.queryData(this.query) this.$refs.table.queryData(this.query);
}, },
resetQuery() { resetQuery() {
this.query = {}; this.query = {};

View File

@ -1,24 +1,47 @@
<template> <template>
<el-container> <el-container>
<el-header style="height: 50%; padding: 0;"> <el-header style="height: 50%; padding: 0">
<el-container> <el-container>
<el-header> <el-header>
<div class="left-panel"> <div class="left-panel">
<div style="font-size: 14px">仓库</div> <div style="font-size: 14px">仓库</div>
<el-select v-model="query.warehouse" clearable placeholder="所在仓库" @change="handleQuery" <el-select
style="margin-left: 4px"> v-model="query.warehouse"
<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.name" clearable
:value="item.id"></el-option> placeholder="所在仓库"
@change="handleQuery"
style="margin-left: 10px; width: 150px"
>
<el-option
v-for="item in warehouseOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-input v-model="query.search" placeholder="物料名/批次号" clearable <el-input
style="margin-right: 5px;"></el-input> v-model="query.search"
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button> placeholder="物料名/批次号"
clearable
style="margin-right: 5px"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="params"> <scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="params"
>
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column label="批次" prop="batch"> <el-table-column label="批次" prop="batch">
</el-table-column> </el-table-column>
@ -27,7 +50,8 @@
<el-table-column label="规格型号"> <el-table-column label="规格型号">
<template #default="scope"> <template #default="scope">
<span v-if="scope.row.material_"> <span v-if="scope.row.material_">
{{ scope.row.material_.specification }} {{ scope.row.material_.model }} {{ scope.row.material_.specification }}
{{ scope.row.material_.model }}
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
@ -55,16 +79,32 @@
<el-header> <el-header>
<div class="left-panel"> <div class="left-panel">
<span style="font-size: 14px">车间库存</span> <span style="font-size: 14px">车间库存</span>
<el-select v-model="queryWm.material__process" clearable placeholder="已到工序" @change="handleQueryWm" <el-select
style="margin-left: 4px"> v-model="queryWm.material__process"
<el-option v-for="item in processOptions" :key="item.id" :label="item.name" clearable
:value="item.id"></el-option> placeholder="已到工序"
@change="handleQueryWm"
style="margin-left: 10px; width: 150px"
>
<el-option
v-for="item in processOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</div> </div>
</el-header> </el-header>
<el-main> <el-main>
<scTable ref="table_wm" :apiObj="apiObjWm" row-key="id" :params="paramsWm" stripe> <scTable
<el-table-column label="批次" prop="batch"> </el-table-column> ref="table_wm"
:apiObj="apiObjWm"
row-key="id"
:params="paramsWm"
stripe
>
<el-table-column label="批次" prop="batch">
</el-table-column>
<el-table-column label="物料名" prop="material"> <el-table-column label="物料名" prop="material">
<template #default="scope">{{ <template #default="scope">{{
scope.row.material_.name scope.row.material_.name
@ -85,7 +125,10 @@
scope.row.material_.process_name scope.row.material_.process_name
}}</template> }}</template>
</el-table-column> </el-table-column>
<el-table-column label="所在车间" prop="belong_dept_name"> <el-table-column
label="所在车间"
prop="belong_dept_name"
>
</el-table-column> </el-table-column>
<el-table-column label="数量" prop="count" width="80"> <el-table-column label="数量" prop="count" width="80">
</el-table-column> </el-table-column>
@ -108,29 +151,29 @@ export default {
apiObjWm: this.$API.wpm.wmaterial.list, apiObjWm: this.$API.wpm.wmaterial.list,
paramsWm: { count__gte: 1 }, paramsWm: { count__gte: 1 },
processOptions: [], processOptions: [],
queryWm: {} queryWm: {},
}; };
}, },
mounted() { mounted() {
this.getWarehouse() this.getWarehouse();
this.getProcessOptions() this.getProcessOptions();
}, },
methods: { methods: {
getWarehouse() { getWarehouse() {
this.$API.inm.warehouse.list.req({ page: 0 }).then(res => { this.$API.inm.warehouse.list.req({ page: 0 }).then((res) => {
this.warehouseOptions = res this.warehouseOptions = res;
}) });
}, },
getProcessOptions() { getProcessOptions() {
this.$API.mtm.process.list.req({ page: 0 }).then(res => { this.$API.mtm.process.list.req({ page: 0 }).then((res) => {
this.processOptions = res this.processOptions = res;
}) });
}, },
handleQueryWm() { handleQueryWm() {
this.$refs.table_wm.queryData(this.queryWm) this.$refs.table_wm.queryData(this.queryWm);
}, },
handleQuery() { handleQuery() {
this.$refs.table.queryData(this.query) this.$refs.table.queryData(this.query);
}, },
resetQuery() { resetQuery() {
this.query = {}; this.query = {};

View File

@ -2,18 +2,43 @@
<el-container> <el-container>
<el-header> <el-header>
<div class="left-panel"> <div class="left-panel">
<el-select v-model="query.warehouse" clearable placeholder="所在仓库" @change="handleQuery"> <el-select
<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.name" v-model="query.warehouse"
:value="item.id"></el-option> clearable
placeholder="所在仓库"
@change="handleQuery"
style="width: 150px"
>
<el-option
v-for="item in warehouseOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-input v-model="query.search" placeholder="物料名" clearable style="margin-right: 5px;"></el-input> <el-input
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button> v-model="query.search"
placeholder="物料名"
clearable
style="margin-right: 5px"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="params"> <scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="params"
>
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column label="物料批次" prop="batch"> <el-table-column label="物料批次" prop="batch">
</el-table-column> </el-table-column>
@ -42,23 +67,23 @@ export default {
data() { data() {
return { return {
apiObj: this.$API.inm.warehouse.batch, apiObj: this.$API.inm.warehouse.batch,
params: { count__gte: 1, material__type__in: '40, 50, 60, 70' }, params: { count__gte: 1, material__type__in: "40, 50, 60, 70" },
selection: [], selection: [],
query: {}, query: {},
warehouseOptions: [] warehouseOptions: [],
}; };
}, },
mounted() { mounted() {
this.getWarehouse() this.getWarehouse();
}, },
methods: { methods: {
getWarehouse() { getWarehouse() {
this.$API.inm.warehouse.list.req({ page: 0 }).then(res => { this.$API.inm.warehouse.list.req({ page: 0 }).then((res) => {
this.warehouseOptions = res this.warehouseOptions = res;
}) });
}, },
handleQuery() { handleQuery() {
this.$refs.table.queryData(this.query) this.$refs.table.queryData(this.query);
}, },
resetQuery() { resetQuery() {
this.query = {}; this.query = {};

View File

@ -2,18 +2,43 @@
<el-container> <el-container>
<el-header> <el-header>
<div class="left-panel"> <div class="left-panel">
<el-select v-model="query.warehouse" clearable placeholder="所在仓库" @change="handleQuery"> <el-select
<el-option v-for="item in warehouseOptions" :key="item.id" :label="item.name" v-model="query.warehouse"
:value="item.id"></el-option> clearable
placeholder="所在仓库"
@change="handleQuery"
style="width: 150px"
>
<el-option
v-for="item in warehouseOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select> </el-select>
</div> </div>
<div class="right-panel"> <div class="right-panel">
<el-input v-model="query.search" placeholder="物料名" clearable style="margin-right: 5px;"></el-input> <el-input
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button> v-model="query.search"
placeholder="物料名"
clearable
style="margin-right: 5px"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="handleQuery"
></el-button>
</div> </div>
</el-header> </el-header>
<el-main class="nopadding"> <el-main class="nopadding">
<scTable ref="table" :apiObj="apiObj" row-key="id" stripe :params="params"> <scTable
ref="table"
:apiObj="apiObj"
row-key="id"
stripe
:params="params"
>
<el-table-column type="index" width="50" /> <el-table-column type="index" width="50" />
<el-table-column label="物料批次" prop="batch"> <el-table-column label="物料批次" prop="batch">
</el-table-column> </el-table-column>
@ -42,23 +67,23 @@ export default {
data() { data() {
return { return {
apiObj: this.$API.inm.warehouse.batch, apiObj: this.$API.inm.warehouse.batch,
params: { count__gte: 1, material__type__in: '30' }, params: { count__gte: 1, material__type__in: "30" },
selection: [], selection: [],
query: {}, query: {},
warehouseOptions: [] warehouseOptions: [],
}; };
}, },
mounted() { mounted() {
this.getWarehouse() this.getWarehouse();
}, },
methods: { methods: {
getWarehouse() { getWarehouse() {
this.$API.inm.warehouse.list.req({ page: 0 }).then(res => { this.$API.inm.warehouse.list.req({ page: 0 }).then((res) => {
this.warehouseOptions = res this.warehouseOptions = res;
}) });
}, },
handleQuery() { handleQuery() {
this.$refs.table.queryData(this.query) this.$refs.table.queryData(this.query);
}, },
resetQuery() { resetQuery() {
this.query = {}; this.query = {};