<template>
|
<div class="app-container">
|
<el-form :inline="true" :model="queryParams" class="search-form">
|
<el-form-item label="搜索">
|
<el-input
|
v-model="queryParams.searchText"
|
placeholder="请输入关键词"
|
clearable
|
:style="{ width: '100%' }"
|
/>
|
</el-form-item>
|
<el-form-item label="供应商名称">
|
<el-input
|
v-model="queryParams.supplierName"
|
placeholder="请输入"
|
clearable
|
:style="{ width: '100%' }"
|
/>
|
</el-form-item>
|
<el-form-item label="统一人识别号">
|
<el-input
|
v-model="queryParams.identifyNumber"
|
placeholder="请输入"
|
clearable
|
:style="{ width: '100%' }"
|
/>
|
</el-form-item>
|
<el-form-item label="经营地址">
|
<el-input
|
v-model="queryParams.address"
|
placeholder="请输入"
|
clearable
|
:style="{ width: '100%' }"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="handleQuery">查询</el-button>
|
<el-button @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
<el-card>
|
<!-- 标签页 -->
|
<el-tabs v-model="activeTab" class="info-tabs">
|
<el-tab-pane
|
v-for="tab in tabs"
|
:key="tab.name"
|
:label="tab.label"
|
:name="tab.name"
|
/>
|
</el-tabs>
|
<!-- 操作按钮区 -->
|
<el-space>
|
<el-button type="primary" :icon="Plus" @click="handleAdd">新建</el-button>
|
<el-button type="danger" :icon="Delete" @click="handleDelete">删除</el-button>
|
<el-button type="info" :icon="Download" @click="handleExport">导出</el-button>
|
</el-space>
|
</el-card>
|
</div>
|
</template>
|
|
<script setup>
|
import {ref, reactive} from "vue";
|
import {Delete, Download, Plus} from "@element-plus/icons-vue";
|
|
const activeTab = ref("out");
|
// 标签页数据
|
const tabs = reactive([
|
{ name: "out", label: "销售出库" },
|
]);
|
const tableLoading = ref(false);
|
// 查询参数
|
const queryParams = reactive({
|
searchText: "",
|
supplierName: "",
|
identifyNumber: "",
|
address: "",
|
})
|
|
// 点击查询
|
const handleQuery = () => {
|
tableLoading.value = true;
|
setTimeout(() => {
|
tableLoading.value = false;
|
}, 500);
|
}
|
// 重置查询
|
const resetQuery = () => {
|
Object.keys(queryParams).forEach((key) => {
|
if (key !== "pageNum" && key !== "pageSize") {
|
queryParams[key] = "";
|
}
|
});
|
handleQuery();
|
};
|
// 新增出库
|
const handleAdd = () => {
|
|
};
|
// 删除出库
|
const handleDelete = () => {
|
|
};
|
// 导出出库
|
const handleExport = () => {
|
|
};
|
</script>
|
|
<style scoped>
|
|
</style>
|
