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;">
<TreeComponent <el-button
:tree-data="categoryOptions" type="primary"
:tree-props="defaultProps" plain
:node-key="nodeKey" icon="el-icon-plus"
:show-search="true" @click="handleAdd"
search-placeholder="请输入分类名称" v-hasPermi="['inventory:materials_category:add']"
:default-expand-all="true" >新增</el-button>
:highlight-current="true"
:loading="loadingTree" <el-button
@node-click="handleTreeClick" type="info"
style="height: 100%;" plain
/> icon="el-icon-sort"
</pane> @click="toggleExpandAll"
>展开/折叠</el-button>
<!-- 物料分类管理:右侧面板 -->
<pane size="84" style="height: 100%; overflow: auto;"> <el-button
<div style="padding: 10px; height: 100%; display: flex; flex-direction: column;"> type="warning"
<!-- 搜索表单 --> plain
<el-form 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
:tree-data="categoryOptions"
:tree-props="defaultProps"
:node-key="nodeKey"
:show-search="true"
search-placeholder="请输入分类名称"
:default-expand-all="true"
:highlight-current="true"
:loading="loadingTree"
@node-click="handleTreeClick"
style="height: 100%;"
/>
</div>
<div class="card-container shadow flex1 right-card flex-container" style="flex-direction: column;padding: 20px;min-height: 200px;">
<page-wrapper-search
: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
v-model="queryParams.categoryCode" v-model="queryParams.categoryCode"
placeholder="请输入物料分类编码" placeholder="请输入物料分类编码"
...@@ -45,126 +70,81 @@ ...@@ -45,126 +70,81 @@
@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"> <div style="flex: 1;min-height: 200px;">
<el-button <el-table
type="primary" ref="treeTable"
plain v-loading="loading"
icon="el-icon-plus" :data="currentTreeNodeData"
@click="handleAdd" height="100%"
v-hasPermi="['inventory:materials_category:add']" row-key="id"
>新增</el-button> :default-expand-all="isExpandAll"
</el-col> :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
<!-- <el-col :span="1.5"> >
<el-button <!-- <el-table-column type="selection" width="55" align="center"/> -->
type="success" <el-table-column
plain label="物料分类名称"
icon="el-icon-edit" align="center"
:disabled="single" prop="categoryName"
@click="handleUpdate"
v-hasPermi="['inventory:materials_category:edit']" fixed="left"
>修改</el-button> />
</el-col> <el-table-column label="物料分类编码" align="center" prop="categoryCode" />
<el-col :span="1.5"> <el-table-column label="排序" align="center" prop="sortNo" width="80" />
<el-button <el-table-column label="创建时间" align="center" prop="createTime">
type="danger" <template slot-scope="scope">
plain <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
icon="el-icon-delete" </template>
:disabled="multiple" </el-table-column>
@click="handleDelete" <el-table-column label="修改时间" align="center" prop="updateTime">
v-hasPermi="['inventory:materials_category:remove']" <template slot-scope="scope">
>删除</el-button> <span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</el-col> --> </template>
<el-col :span="1.5"> </el-table-column>
<el-button <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250" fixed="right">
type="info" <template slot-scope="scope">
plain <el-button
icon="el-icon-sort" size="mini"
@click="toggleExpandAll" link
>展开/折叠</el-button> type="text"
</el-col> icon="el-icon-plus"
<el-col :span="1.5"> @click="handleAdd(scope.row.id)"
<el-button v-hasPermi="['inventory:materials_category:add']"
type="warning" >新增下级</el-button>
plain <el-button
icon="el-icon-download" size="mini"
@click="handleExport" link
v-hasPermi="['inventory:materials_category:export']" type="text"
>导出</el-button> icon="el-icon-edit"
</el-col> @click="handleUpdate(scope.row)"
<right-toolbar v-model="showSearch" @queryTable="getList"></right-toolbar> v-hasPermi="['inventory:materials_category:edit']"
</el-row> >修改</el-button>
<el-button
<!-- 树形数据表格 --> size="mini"
<div style="flex: 1; overflow: auto;"> link
<el-table type="text"
ref="treeTable" icon="el-icon-delete"
v-loading="loading" @click="handleDelete(scope.row)"
:data="currentTreeNodeData" v-hasPermi="['inventory:materials_category:remove']"
>删除</el-button>
row-key="id" </template>
:default-expand-all="isExpandAll" </el-table-column>
:tree-props="{children: 'children', hasChildren: 'hasChildren'}" </el-table>
> </div>
<!-- <el-table-column type="selection" width="55" align="center"/> -->
<el-table-column
label="物料分类名称"
align="center"
prop="categoryName"
min-width="200"
/>
<el-table-column label="物料分类编码" align="center" prop="categoryCode" width="200" />
<el-table-column label="排序" align="center" prop="sortNo" width="100" />
<el-table-column label="创建时间" align="center" prop="createTime" width="200">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="修改时间" align="center" prop="updateTime" width="200">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250">
<template slot-scope="scope">
<el-button
size="mini"
link
type="text"
icon="el-icon-plus"
@click="handleAdd(scope.row.id)"
v-hasPermi="['inventory:materials_category:add']"
>新增下级</el-button>
<el-button
size="mini"
link
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['inventory:materials_category:edit']"
>修改</el-button>
<el-button
size="mini"
link
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['inventory:materials_category:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
</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 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论