Commit c5d2b0f7 by ningjihai

物料分类

parent 4a57302c
...@@ -143,6 +143,32 @@ aside { ...@@ -143,6 +143,32 @@ aside {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: 200px; min-height: 200px;
}
.page-container-noback{
display: flex;
flex-direction: column;
flex: 1;
border-radius: 4px;
box-sizing: border-box;
display: flex;
flex-direction: column;
min-height: 200px;
}
.flex-container{
display: flex;
border-radius: 4px;
}
.shadow {
box-shadow: 2px 2px 4px rgba(30, 92, 235, 0.1);
}
.flex1{
flex: 1;
}
.card-container {
background-color: #fff;
border-radius: 4px;
box-sizing: border-box;
} }
.table-container{ .table-container{
flex: 1; flex: 1;
......
:root {
--container-pd: 10px;
--shadow: 2px 2px 4px rgba(30, 92, 235, 0.1); // 阴影
}
// base color // base color
$blue:#324157; $blue:#324157;
$light-blue:#3A71A8; $light-blue:#3A71A8;
......
<template> <template>
<div class="app-container" style="overflow: hidden;"> <div class="app-container">
<splitpanes class="default-theme" style="height: 100%;"> <PageTitle>
<!-- 树结构:左侧面板 --> <template #buttons>
<pane size="16" style="height: 100%; overflow: auto;">
<el-button
type="primary"
plain
icon="el-icon-plus"
@click="handleAdd"
v-hasPermi="['inventory:materials_category:add']"
>新增</el-button>
<el-button
type="info"
plain
icon="el-icon-sort"
@click="toggleExpandAll"
>展开/折叠</el-button>
<el-button
type="warning"
plain
icon="el-icon-download"
@click="handleExport"
v-hasPermi="['inventory:materials_category:export']"
>导出</el-button>
</template>
</PageTitle>
<div class="page-container-noback flex1">
<div class="flex-container flex1" style="min-height: 200px;">
<div class="card-container shadow" style="overflow: auto;min-width: 16%;">
<TreeComponent <TreeComponent
:tree-data="categoryOptions" :tree-data="categoryOptions"
:tree-props="defaultProps" :tree-props="defaultProps"
...@@ -15,19 +44,15 @@ ...@@ -15,19 +44,15 @@
@node-click="handleTreeClick" @node-click="handleTreeClick"
style="height: 100%;" style="height: 100%;"
/> />
</pane> </div>
<div class="card-container shadow flex1 right-card flex-container" style="flex-direction: column;padding: 20px;min-height: 200px;">
<!-- 物料分类管理:右侧面板 --> <page-wrapper-search
<pane size="84" style="height: 100%; overflow: auto;">
<div style="padding: 10px; height: 100%; display: flex; flex-direction: column;">
<!-- 搜索表单 -->
<el-form
:model="queryParams" :model="queryParams"
ref="queryRef" ref="queryForm"
:inline="true" size="small"
v-show="showSearch" @search="handleQuery"
label-width="128px" @reset="resetQuery"
style="margin-bottom: 10px;"
> >
<el-form-item label="物料分类编码" prop="categoryCode"> <el-form-item label="物料分类编码" prop="categoryCode">
<el-input <el-input
...@@ -45,70 +70,20 @@ ...@@ -45,70 +70,20 @@
@keyup.enter="handleQuery" @keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item> </page-wrapper-search>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 操作按钮 -->
<el-row :gutter="10" class="mb8" style="margin-bottom: 10px;">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
@click="handleAdd"
v-hasPermi="['inventory:materials_category:add']"
>新增</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['inventory:materials_category:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['inventory:materials_category:remove']"
>删除</el-button>
</el-col> -->
<el-col :span="1.5">
<el-button
type="info"
plain
icon="el-icon-sort"
@click="toggleExpandAll"
>展开/折叠</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
@click="handleExport"
v-hasPermi="['inventory:materials_category:export']"
>导出</el-button>
</el-col>
<right-toolbar v-model="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<!-- 树形数据表格 --> <!-- 树形数据表格 -->
<div style="flex: 1; overflow: auto;"> <div style="flex: 1;min-height: 200px;">
<el-table <el-table
ref="treeTable" ref="treeTable"
v-loading="loading" v-loading="loading"
:data="currentTreeNodeData" :data="currentTreeNodeData"
height="100%"
row-key="id" row-key="id"
:default-expand-all="isExpandAll" :default-expand-all="isExpandAll"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
...@@ -118,21 +93,22 @@ ...@@ -118,21 +93,22 @@
label="物料分类名称" label="物料分类名称"
align="center" align="center"
prop="categoryName" prop="categoryName"
min-width="200"
fixed="left"
/> />
<el-table-column label="物料分类编码" align="center" prop="categoryCode" width="200" /> <el-table-column label="物料分类编码" align="center" prop="categoryCode" />
<el-table-column label="排序" align="center" prop="sortNo" width="100" /> <el-table-column label="排序" align="center" prop="sortNo" width="80" />
<el-table-column label="创建时间" align="center" prop="createTime" width="200"> <el-table-column label="创建时间" align="center" prop="createTime">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="修改时间" align="center" prop="updateTime" width="200"> <el-table-column label="修改时间" align="center" prop="updateTime">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250" fixed="right">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
size="mini" size="mini"
...@@ -162,9 +138,13 @@ ...@@ -162,9 +138,13 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
</div> </div>
</pane> </div>
</splitpanes> </div>
<!-- 添加/修改对话框 --> <!-- 添加/修改对话框 -->
<el-dialog <el-dialog
...@@ -485,7 +465,7 @@ export default { ...@@ -485,7 +465,7 @@ export default {
/** 重置搜索条件 */ /** 重置搜索条件 */
resetQuery() { resetQuery() {
this.$refs["queryRef"].resetFields(); // this.$refs["queryRef"].resetFields();
this.queryParams = { this.queryParams = {
pageNum: 1, pageNum: 1,
pageSize: 1000, pageSize: 1000,
...@@ -641,17 +621,8 @@ export default { ...@@ -641,17 +621,8 @@ export default {
} }
</script> </script>
<style scoped> <style lang="scss" scoped>
.app-container { .right-card {
height: 100%; margin-left: var(--container-pd);
}
.mb8 {
margin-bottom: 8px;
}
.el-table {
max-height: 100%;
overflow-y: auto;
} }
</style> </style>
\ No newline at end of file
...@@ -260,7 +260,7 @@ export default { ...@@ -260,7 +260,7 @@ export default {
}, },
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.queryParams = {
dictId: undefined, dictId: undefined,
dictName: undefined, dictName: undefined,
dictType: undefined, dictType: undefined,
...@@ -276,8 +276,16 @@ export default { ...@@ -276,8 +276,16 @@ export default {
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetQuery() { resetQuery() {
console.log(123)
this.dateRange = [] this.dateRange = []
this.resetForm("queryForm") this.queryParams = {
dictId: undefined,
dictName: undefined,
dictType: undefined,
status: "0",
remark: undefined
}
this.resetForm("queryParams")
this.handleQuery() this.handleQuery()
}, },
/** 新增按钮操作 */ /** 新增按钮操作 */
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论