Mes
/
middle-admin-ant
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

料品管理

This commit is contained in:
xielue 2023-05-10 18:39:06 +08:00
parent 73f70b5b4b
commit 90b7511e46
6 changed files with 1182 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/application/mk/basic-pages/list.vue
View File

@ -3,7 +3,7 @@
<a-row type="flex">
<a-col :flex="$mk.config.ui.searchFlex">
<!-- 搜索区 -->
<vxe-form :data="options.searchFormData" :items="options.searchFormItems" titleColon @submit="onSearch">
<vxe-form :data="options.searchFormData" :items="options.searchFormItems" titleColon @submit="onSearch2()">
<template #date="{}">
<a-form-item label="创建时间" :style="{ display: 'inline-block', width: 120 }">
</a-form-item>
@ -54,7 +54,10 @@ export default {
},
data() {
return {};
return {
bindSearchData:null
};
},
@ -133,10 +136,10 @@ export default {
getSearchParms() { // 获取搜索参数
var rules = []; // 定义搜索参数
let findMode = k => { // 查找搜索模式
for (let i in this.searchRules) { // 遍历搜索规则
if (this.searchRules[i].key == k) return this.searchRules[i].mode; // 如果找到了就返回搜索模式
for (let i in this.options.searchRules) { // 遍历搜索规则
if (this.options.searchRules[i].key == k) return this.options.searchRules[i].mode; // 如果找到了就返回搜索模式
}
return "equal"; // 如果没有找到就返回等于
return "="; // 如果没有找到就返回等于
};
for (let key in this.options.searchFormData) { // 遍历搜索表单数据
@ -153,6 +156,25 @@ export default {
});
}
}
if(this.bindSearchData){
for (let key in this.bindSearchData) { // 遍历搜索表单数据
let value = this.bindSearchData[key]; // 获取值
if (value) { // 如果有值
let mode = findMode(key); // 获取搜索模式
if (mode == "like") { // 如果是模糊搜索
value = "%" + value + "%"; // 如果是模糊搜索就在两边加上%
}
rules.push({ // 添加搜索参数
column: key, // 字段名
mode: mode, // 搜索模式
value: value // 值
});
}
}
}
return rules; // 返回搜索参数
},
// 获取选中行
@ -215,7 +237,7 @@ export default {
useBigInt: true
}).then(() => { // 成功
this.$mk.success("删除成功"); // 提示成功
this.onSearch(); // 重新加载数据
this.$refs.xGrid.commitProxy('query') // 提交搜索
}).catch((a) => { // 失败
this.$mk.error(a.data.msg); // 提示错误信息
});
@ -224,11 +246,14 @@ export default {
},
// 搜索
onSearch() {
onSearch2() {
this.$refs.xGrid.commitProxy('query') // 提交搜索
},
onSearch(arg) {
this.bindSearchData = arg;
this.$refs.xGrid.commitProxy('query') // 提交搜索
},
},
// 监听属性
watch: {

358
src/pages/Middle/Mes/MesMaterials/MesMaterials/Edit.vue
View File

@ -1,5 +1,29 @@
<template>
<basic-page-edit :desc="desc" :dataId="getDataId()" :options="pageOptions"></basic-page-edit>
<div class="page-body">
<vxe-form :data="options.formOptions.data" ref="xForm" :title-width="options.formOptions.titleWidth"
:title-align="options.formOptions.titleAlign" :rules="options.formOptions.rules" :items="options.formOptions.items"
titleColon>
<template #sort_id="{}">
<vxe-pulldown style="width:100%" ref="pulldownParent" transfer>
<template #default>
<vxe-input v-model="sortName" suffix-icon="vxe-icon-search" placeholder="选择分类" @keyup="pulldownKeyupEvent"
@focus="pulldownFocusEvent" @suffix-click="pulldownSuffixClick"></vxe-input>
</template>
<template #dropdown>
<div class="my-dropdown">
<vxe-grid ref="gridParent" v-bind="gridParentOptions" @cell-click="pulldownCellClickEvent">
</vxe-grid>
</div>
</template>
</vxe-pulldown>
</template>
</vxe-form>
<div class="footerbar">
<a-button type="primary" @click="ok">确定</a-button>
<a-button @click="cancel">取消</a-button>
</div>
</div>
</template>
<script>
@ -20,10 +44,68 @@ export default {
},
data() {
return {
pageOptions: {}
let pageData = {
actions: {
list: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/list`,
},
sortName: '',
gridParentOptions: {
height: 400,
id: 'datagrid_router_parent_1',
proxyConfig: {
sort: true, // 启用排序代理，当点击排序时会自动触发 query 行为
filter: true, // 启用筛选代理，当点击筛选时会自动触发 query 行为
props: {
result: 'MesMaterialsSort', // 配置响应结果列表字段
total: 'total' // 配置响应结果总页数字段
},
// 接收Promise
ajax: {
// 当点击工具栏查询按钮或者手动提交指令 query或reload 时会被触发
query: (options) => {
const { page, sorts } = options;
var params = {};
params.page = page.currentPage;
params.limit = page.pageSize;
params.order_bys = [];
params.search_rules = [];
if (sorts) {
sorts.forEach((v) => {
params.order_bys.push({
column: v.property,
order: v.order
})
});
}
return this.loadParentGrid({ params });
}
}
},
sortConfig: {
},
treeConfig: {
transform: true,
expandAll: true,
rowField: 'id',
parentField: 'parent_id'
},
checkboxConfig: {
reserve: true,
highlight: true
},
columns: [
{ field: 'name', sortable: true, title: '分类名', showHeaderOverflow: true, treeNode: true },
{ field: 'code', sortable: true, title: '编号', showHeaderOverflow: true }
]
},
options: {}
};
pageData.gridParentOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridParentOptions);
return pageData;
},
computed: {
@ -36,14 +118,21 @@ export default {
created() {
this.optionsInit();
this.dataInit();
this.dataInit();
},
// 函数
methods: {
loadParentGrid({ params }) {
params.start_time = 0;
params.end_time = 0;
return this.$mk.getPagedData({ url: this.actions.list, data: params });
},
optionsInit() {
// 页面数据变量
var pageData = {
@ -58,23 +147,23 @@ export default {
uploadDefaultImg: null,
detailDataFieldName: "mes_materials",
detailDataFieldName: "mes_materials",
actions: {
// =============================== 接口地址 自动生成 Start ===============================
MesMaterialsList: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/list`, // 料品列表
MesMaterialsDetail: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detail`, // 料品详情
MesMaterialsCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/create`, // 创建料品
MesMaterialsUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/update`, // 更新料品
MesMaterialsDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detele`, // 删除料品
MesMaterialsBatchDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchDelete`, // 批量删除料品
MesMaterialsBatchUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchUpdate`, // 批量更新料品
MesMaterialsBatchCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchCreate`, // 批量创建料品
MesMaterialsExportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/export/excel`, // 导出料品数据到EXCEL
MesMaterialsImportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/import/excel`, // 批量导入EXCEL料品数据
actions: {
// =============================== 接口地址 自动生成 Start ===============================
MesMaterialsList: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/list`, // 料品列表
MesMaterialsDetail: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detail`, // 料品详情
MesMaterialsCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/create`, // 创建料品
MesMaterialsUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/update`, // 更新料品
MesMaterialsDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detele`, // 删除料品
MesMaterialsBatchDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchDelete`, // 批量删除料品
MesMaterialsBatchUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchUpdate`, // 批量更新料品
MesMaterialsBatchCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchCreate`, // 批量创建料品
MesMaterialsExportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/export/excel`, // 导出料品数据到EXCEL
MesMaterialsImportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/import/excel`, // 批量导入EXCEL料品数据
// =============================== 接口地址 自动生成 End ===============================
},
// =============================== 接口地址 自动生成 End ===============================
},
keyName: 'id',
// 是否编辑模式
@ -82,54 +171,46 @@ export default {
// 表单数据
formOptions: {
data: {
// =============================== 表单数据 自动生成 Start ===============================
id: 0,
code: "",
warehouse_id: 0,
warehouse_position_id: 0,
product_id: 0,
unit_id: 0,
level: 0,
quantity: 0,
create_uid: 0,
update_uid: 0,
create_time: new Date(2100, 1, 1).getTime() / 10000,
update_time: new Date(2100, 1, 1).getTime() / 10000,
// =============================== 表单数据 自动生成 End ===============================
},
// 标题宽度
titleWidth: 150,
// 标题对齐方式
titleAlign: 'right',
// 表单校验规则
rules: {
// =============================== 表单校验 自动生成 Start ===============================
// 表单校验规则
rules: {
// =============================== 表单校验 自动生成 Start ===============================
code: [
{ required: true, message: '请输入编码' }
]
code: [
{ required: true, message: '请输入编号' }
],
name: [
{ required: true, message: '请输入名称' }
]
// =============================== 表单校验 自动生成 End ===============================
// =============================== 表单校验 自动生成 End ===============================
},
// 表单项
items: [
{ field: 'code', title: '编号', span: 12, itemRender: { name: '$input' } },
{ field: 'name', title: '名称', span: 12, itemRender: { name: '$input' } },
{ title: '分类', span: 12, slots: { default: 'sort_id' } },
{ field: 'spec', title: '规格型号', span: 12, itemRender: { name: '$input' } },
{ field: 'size', title: '尺寸', span: 12, itemRender: { name: '$input' } },
{ field: 'color', title: '颜色', span: 12, itemRender: { name: '$input' } },
{ field: 'face', title: '花面', span: 12, itemRender: { name: '$input' } },
{ field: 'molding', title: '成型方式', span: 12, itemRender: { name: '$input' } },
{ field: 'production_type', title: '布产方式', span: 12, itemRender: { name: '$input' } },
{ field: 'theoretical_load', title: '理论装车量', span: 12, itemRender: { name: '$input' } },
{ field: 'soil', title: '土质', span: 12, itemRender: { name: '$input' } },
{ field: 'unit', title: '单位', span: 12, itemRender: { name: '$input' } },
]
},
// 表单项
items: [
// =============================== 表单项 自动生成 Start ===============================
{ field: 'code', title: '编码', span: 12, itemRender: { name: '$input' } },
//{ field: 'warehouse_id', title: '仓库id', span: 12, itemRender: { name: '$input' } },
//{ field: 'warehouse_position_id', title: '仓位id', span: 12, itemRender: { name: '$input' } },
//{ field: 'product_id', title: '商品ID', span: 12, itemRender: { name: '$input' } },
//{ field: 'unit_id', title: '单位ID', span: 12, itemRender: { name: '$input' } },
{ field: 'level', title: '等级', span: 12, itemRender: { name: '$input',props:{type:"number"} } },
{ field: 'quantity', title: '数量', span: 12, itemRender: { name: '$input' ,props:{type:"number"} } },
// =============================== 表单项 自动生成 End ===============================
]
},
// 新增模式表单项
// 新增模式表单项
addModeItems: [
],
@ -137,14 +218,18 @@ export default {
};
pageData.actions.get = pageData.actions.MesMaterialsDetail;
pageData.actions.create = pageData.actions.MesMaterialsCreate;
pageData.actions.update = pageData.actions.MesMaterialsUpdate;
pageData.formOptions.items.forEach(item => {
// 合并表单数据及配置
pageData.formOptions.data[item.field] = '';
})
pageData.actions.get = pageData.actions.MesMaterialsDetail;
pageData.actions.create = pageData.actions.MesMaterialsCreate;
pageData.actions.update = pageData.actions.MesMaterialsUpdate;
// 合并表单数据及配置
pageData.formOptions = Object.assign({}, this.$mk.config.defaults.formOptions, pageData.formOptions);
this.pageOptions = pageData;
this.options = pageData;
},
dataInit() {
@ -154,7 +239,7 @@ export default {
if (dataId) {
const json = `{"id":${dataId}}`;
this.$mk.post({
url: this.pageOptions.actions.get,
url: this.options.actions.get,
loading: "加载中...",
data: json,
config: {
@ -164,7 +249,7 @@ export default {
}
}).then(a => {
let detailDataFieldName = this.pageOptions.detailDataFieldName;
let detailDataFieldName = this.options.detailDataFieldName;
if (a.data[detailDataFieldName].create_time) {
a.data[detailDataFieldName].create_time = new Date(a.data[detailDataFieldName].create_time * 1000);
@ -172,21 +257,25 @@ export default {
if (a.data[detailDataFieldName].update_time) {
a.data[detailDataFieldName].update_time = new Date(a.data[detailDataFieldName].update_time * 1000);
}
if(a.data[detailDataFieldName].mes_materials_sort){
this.sortName = a.data[detailDataFieldName].mes_materials_sort.name;
}
this.options.formOptions.data = a.data[detailDataFieldName];
this.pageOptions.formOptions.data = a.data[detailDataFieldName];
this.$forceUpdate()
}).catch((a) => {
this.$mk.error(a.data.msg);
});
this.pageOptions.isEdit = true;
this.options.isEdit = true;
this.$forceUpdate()
} else {
// 如果没有id参数，说明是新增模式
this.addModeItems.forEach(item => {
this.pageOptions.formOptions.items.push(item);
this.options.formOptions.items.push(item);
})
}
@ -202,7 +291,100 @@ export default {
dataId = 0;
}
return dataId;
}
},
// 返回
back() {
this.isEdit = this.options.isEdit;
// 如果是新增模式，关闭当前页面
if (!this.isEdit) {
this.$closePage({
closeRoute: this.options.addPageUrl
});
} else {
this.$closePage({
closeRoute: this.options.editPageUrl
});
}
// 打开列表页面
this.$openPage(this.options.listPageUrl)
},
// 保存
ok() {
let save = () => {
this.isEdit = this.options.isEdit;
// 如果是新增模式，提交新增接口 如果是编辑模式，提交编辑接口
let action = !this.isEdit ? this.options.actions.create : this.options.actions.update;
// 如果是新增模式，提交的数据中加入id 如果是编辑模式，提交的数据中不加入id
let postdata = Object.assign({}, this.options.formOptions.data);
// 如果是编辑模式
if (this.isEdit) {
// postdata = { MesUnit: postdata }
}
// 格式化提交的数据
this.$mk.formatFormData({ data: postdata, rules: this.options.formOptions.items });
// 提交数据
this.$mk.post({
url: action,
loading: "保存中...",
data: postdata,
useBigInt: true,
}).then(() => { // 成功回调
this.$mk.success("保存成功");
if (!this.isEdit) { // 如果是新增模式，关闭当前页面
this.back();
}
}).catch((a) => { // 失败回调
this.$mk.error(a.data.msg); // 显示错误信息
});
};
// 验证表单
this.$mk.validateForm({ form: this.$refs.xForm }).then(() => { // 验证表单
save(); // 提交保存
}).catch(count => { // 验证失败
this.$mk.error(`存在${count}项错误，请检查`);
});
},
// 取消 返回
cancel() {
this.back();
},
pulldownFocusEvent() {
this.$refs.pulldownParent.showPanel()
},
pulldownKeyupEvent() {
},
pulldownSuffixClick() {
this.$refs.pulldownParent.togglePanel()
},
pulldownCellClickEvent({ row }) {
if(row.children && row.children.length){
return;
}
this.options.formOptions.data.sort_id = row.id;
this.sortName = row.name;
this.$refs.pulldownParent.hidePanel()
},
},
// 监听属性
watch: {
@ -211,4 +393,34 @@ export default {
};
</script>
<style scoped lang="less">
.page-body {
padding: 30px;
background: @base-bg-color;
}
.formtabs .ant-tabs-tabpane {
/* background: white; */
padding: 12px;
}
.gridPanel {
height: calc(100vh - 600px);
}
.footerbar {
padding-left: 10px;
}
.imagePanel {
cursor: pointer;
padding: 10px;
width: 100px;
img {
width: 80px;
height: 80px;
}
}
</style>

91
src/pages/Middle/Mes/MesMaterials/MesMaterials/List.vue
View File

@ -6,8 +6,8 @@
import BASE_URL from '@/services/mes/api.js';
export default {
i18n: require("./i18n"),
export default {
i18n: require("./i18n"),
props: {
},
@ -22,7 +22,7 @@ export default {
desc() {
return this.$t("pageDesc");
}
},
},
// 创建完成
@ -42,24 +42,24 @@ export default {
addPageUrl: "/MesMaterials/MesMaterialsAdd",
editPageUrl: "/MesMaterials/MesMaterialsUpdate/",
// 接口动作
actions: { // Api 接口地址
// =============================== 接口地址 自动生成 Start ===============================
MesMaterialsList: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/list`, // 料品列表
MesMaterialsDetail: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detail`, // 料品详情
MesMaterialsCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/create`, // 创建料品
MesMaterialsUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/update`, // 更新料品
MesMaterialsDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detele`, // 删除料品
MesMaterialsBatchDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchDelete`, // 批量删除料品
MesMaterialsBatchUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchUpdate`, // 批量更新料品
MesMaterialsBatchCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchCreate`, // 批量创建料品
MesMaterialsExportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/export/excel`, // 导出料品数据到EXCEL
MesMaterialsImportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/import/excel`, // 批量导入EXCEL料品数据
// 接口动作
actions: { // Api 接口地址
// =============================== 接口地址 自动生成 Start ===============================
MesMaterialsList: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/list`, // 料品列表
MesMaterialsDetail: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detail`, // 料品详情
MesMaterialsCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/create`, // 创建料品
MesMaterialsUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/update`, // 更新料品
MesMaterialsDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detele`, // 删除料品
MesMaterialsBatchDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchDelete`, // 批量删除料品
MesMaterialsBatchUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchUpdate`, // 批量更新料品
MesMaterialsBatchCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchCreate`, // 批量创建料品
MesMaterialsExportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/export/excel`, // 导出料品数据到EXCEL
MesMaterialsImportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/import/excel`, // 批量导入EXCEL料品数据
// =============================== 接口地址 自动生成 End ===============================
},
// =============================== 接口地址 自动生成 End ===============================
},
start_time: 0, // 开始时间
start_time: 0, // 开始时间
end_time: 0, // 结束时间
@ -93,37 +93,44 @@ export default {
stripe: true, // 启用斑马纹
id: 'datagrid_1', // 表格唯一标识
columns: [
{ type: 'checkbox', width: 50 }, // 多选框
{ type: 'seq', width: 30 }, // 序号
columns: [
{ type: 'checkbox', width: 50 }, // 多选框
{ type: 'seq', width: 30 }, // 序号
{ title: '操作', slots: { default: 'op' }, width: 120 },
{ title: '操作', slots: { default: 'op' }, width: 120 },
// =============================== 表格列 自动生成 Start ===============================
{ field: 'code', sortable: true, title: '编码', width: 250 }, // 编码
//{ field: 'warehouse_id', sortable: true, title: '仓库id', width: 250 }, // 仓库id
//{ field: 'warehouse_position_id', sortable: true, title: '仓位id', width: 250 }, // 仓位id
//{ field: 'product_id', sortable: true, title: '商品ID', width: 250 }, // 商品ID
//{ field: 'unit_id', sortable: true, title: '单位ID', width: 250 }, // 单位ID
{ field: 'level', sortable: true, title: '等级', width: 250 }, // 等级
{ field: 'quantity', sortable: true, title: '数量', width: 250 }, // 数量
//{ field: 'create_uid', sortable: true, title: '创建人', width: 80 }, // 创建人
//{ field: 'update_uid', sortable: true, title: '更新人', width: 80 }, // 更新人
{ field: 'create_time', formatter: 'formatDate', width: 160, sortable: true, title: '创建时间', showHeaderOverflow: true }, // 创建时间
{ field: 'update_time', formatter: 'formatDate', width: 160, sortable: true, title: '更新时间', showHeaderOverflow: true }, // 更新时间
// =============================== 表格列 自动生成 Start ===============================
// =============================== 表格列 自动生成 Start ===============================
{ field: 'code', sortable: true, title: '编码', width: 250 }, // 编码
{ field: 'name', sortable: true, title: '名称', width: 250 },
]
}
{ field: 'spec', title: '规格型号' },
{ field: 'size', title: '尺寸' },
{ field: 'color', title: '颜色' },
{ field: 'face', title: '花面', },
{ field: 'molding', title: '成型方式' },
{ field: 'production_type', title: '布产方式' },
{ field: 'theoretical_load', title: '理论装车量' },
{ field: 'soil', title: '土质' },
{ field: 'unit', title: '单位' },
{ field: 'create_time', formatter: 'formatDate', width: 160, sortable: true, title: '创建时间', showHeaderOverflow: true }, // 创建时间
{ field: 'update_time', formatter: 'formatDate', width: 160, sortable: true, title: '更新时间', showHeaderOverflow: true }, // 更新时间
// =============================== 表格列 自动生成 Start ===============================
]
}
};
pageData.actions.getList = pageData.actions.MesMaterialsList;
pageData.actions.delete = pageData.actions.MesMaterialsBatchDelete;
pageData.gridOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridOptions); // 合并表格数据
pageData.actions.getList = pageData.actions.MesMaterialsList;
pageData.actions.delete = pageData.actions.MesMaterialsBatchDelete;
pageData.gridOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridOptions); // 合并表格数据
this.pageOptions = pageData;

543
src/pages/Middle/Mes/MesMaterials/MesMaterials/index.vue Normal file
View File

@ -0,0 +1,543 @@
<template>
<div class="page-body">
<a-row type="flex">
<a-col flex="200px">
<div class="treepanel" :style="'height:' + tableHeight + 'px'">
<div class="treepanel-header">
<a @click.stop="treeAdd(row)" title="新增">
<a-icon type="plus-circle" />
</a>
<a @click.stop="treeEdit(row)" title="编辑">
<a-icon type="edit" />
</a>
<a @click.stop="treeDelete(row)" title="删除">
<a-icon type="delete" />
</a>
</div>
<div class="treepanel-content">
<a-tree v-if="!treeLoading" show-line :tree-data="treeData" :default-expand-all="true" :block-node="true"
@select="onTreeSelect" :default-selected-keys="selectedKeys">
<a-icon slot="switcherIcon" type="down" />
</a-tree>
</div>
</div>
</a-col>
<a-col flex="auto">
<basic-page-list ref="listPage" :options="pageOptions"></basic-page-list>
</a-col>
</a-row>
</div>
</template>
<script>
import BASE_URL from '@/services/mes/api.js';
let childrenFieldName = 'children';
import { toArrayTree } from "xe-utils"
export default {
props: {
pageMode: {
type: String,
default: "edit"
},
dataId: {
}
},
data() {
// 页面数据变量
var pageData = {
pageOptions: {},
modelName: "",
actions: {
treedata: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/list`,
delete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/batchDelete`,
listdata: `${BASE_URL.BASE_URL}/MesEnum/v1/mes/enum/value/list`,
save: `${BASE_URL.BASE_URL}/MesEnum/v1/mes/enum/value/batchHandle`,
},
tipTimes: 0,
detailsData: [
],
sourceDetailsData: [
],
treeData: [],
treeLoading: true,
deletedDetailsData: [
],
selectedKeys: [],
selectedKey: null,
tableHeight: 500
};
return pageData;
},
created() {
this.optionsInit();
this.$nextTick(() => {
this.tableHeight = this.$mk.getWindowSize().height - 320;
this.treeInit();
});
},
// 函数
methods: {
optionsInit() {
// 页面数据
var pageData = { // 页面数据变量
keyName: 'id', // 主键字段名
listFieldName: 'MesMaterials',
addPageUrl: "/MesMaterials/MesMaterialsAdd",
editPageUrl: "/MesMaterials/MesMaterialsUpdate/",
// 接口动作
actions: { // Api 接口地址
// =============================== 接口地址 自动生成 Start ===============================
MesMaterialsList: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/list`, // 料品列表
MesMaterialsDetail: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detail`, // 料品详情
MesMaterialsCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/create`, // 创建料品
MesMaterialsUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/update`, // 更新料品
MesMaterialsDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/detele`, // 删除料品
MesMaterialsBatchDelete: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchDelete`, // 批量删除料品
MesMaterialsBatchUpdate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchUpdate`, // 批量更新料品
MesMaterialsBatchCreate: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/batchCreate`, // 批量创建料品
MesMaterialsExportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/export/excel`, // 导出料品数据到EXCEL
MesMaterialsImportExcel: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/import/excel`, // 批量导入EXCEL料品数据
// =============================== 接口地址 自动生成 End ===============================
},
start_time: 0, // 开始时间
end_time: 0, // 结束时间
//搜索区
searchFormData: {
title: '',
desc: '',
},
// 搜索区配置
searchRules: [
{ key: "name", mode: "like" },
{ key: "sort_id", mode: "in" },
],
//搜索区
searchFormItems: [ // 子项
{ field: 'name', title: '料品名', span: 5, itemRender: { name: '$input', props: { placeholder: '请输入料品名' } } },
{ span: 8, slots: { default: 'date' } }, // 自定义列
{
align: 'right', span: 4, itemRender: { // 按钮列
name: '$buttons', children: [{ props: { type: 'submit', content: '搜索', status: 'primary' } }, // 搜索按钮
{ props: { type: 'reset', content: '重置' } }]
}
}
],
//数据区
gridOptions: { // 表格配置
height: '100%', // 表格高度 100% 会自动撑满父容器
stripe: true, // 启用斑马纹
id: 'datagrid_1', // 表格唯一标识
columns: [
{ type: 'checkbox', width: 50 }, // 多选框
{ type: 'seq', width: 30 }, // 序号
{ title: '操作', slots: { default: 'op' }, width: 120 },
// =============================== 表格列 自动生成 Start ===============================
{ field: 'code', sortable: true, title: '编码', width: 250 }, // 编码
{ field: 'name', sortable: true, title: '名称', width: 250 },
{ field: 'spec', title: '规格型号' },
{ field: 'size', title: '尺寸' },
{ field: 'color', title: '颜色' },
{ field: 'face', title: '花面', },
{ field: 'molding', title: '成型方式' },
{ field: 'production_type', title: '布产方式' },
{ field: 'theoretical_load', title: '理论装车量' },
{ field: 'soil', title: '土质' },
{ field: 'unit', title: '单位' },
{ field: 'create_time', formatter: 'formatDate', width: 160, sortable: true, title: '创建时间', showHeaderOverflow: true }, // 创建时间
{ field: 'update_time', formatter: 'formatDate', width: 160, sortable: true, title: '更新时间', showHeaderOverflow: true }, // 更新时间
// =============================== 表格列 自动生成 Start ===============================
]
}
};
pageData.actions.getList = pageData.actions.MesMaterialsList;
pageData.actions.delete = pageData.actions.MesMaterialsBatchDelete;
pageData.gridOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridOptions); // 合并表格数据
this.pageOptions = pageData;
},
treeInit() {
this.treeLoading = true;
this.$mk.post({
url: this.actions.treedata,
loading: "加载中...",
data: {
"page": 1,
"limit": 10000,
"end_time": 0,
"start_time": 0,
"order_bys": [
],
"search_rules": [
]
}
}).then(r => {
let treedata = {
title: "料品分类",
key: "root"
};
let at = toArrayTree(r.data.MesMaterialsSort, { parentKey: "parent_id" });
console.log(at);
treedata[childrenFieldName] = at;
function formatTreedata(d) {
if (d.id) {
d.key = d.id.toString();
} else {
d.key = "root";
}
if (d.name) {
d.title = d.name;
}
if (d[childrenFieldName] && d[childrenFieldName].length) {
d[childrenFieldName].forEach(item => formatTreedata(item))
}
}
treedata[childrenFieldName].forEach(item => formatTreedata(item))
this.treeData = [treedata];
this.treeLoading = false;
});
},
treeAdd() {
this.$mk.dialog.open({
page: () => import("./treeEdit"),
title: "新增-枚举分类",
dataId: 0,
callback: ({ success }) => {
success && this.treeInit();
}
})
},
treeEdit() {
if (!this.selectedKey || this.selectedKey == "root") {
this.$mk.error("请先选择枚举分类");
return;
}
let node = this.findTreeNode(this.selectedKey);
this.$mk.dialog.open({
page: () => import("./treeEdit"),
title: "编辑-枚举分类",
dataId: node.id,
callback: ({ success }) => {
success && this.treeInit();
}
})
},
treeDelete() {
if (!this.selectedKey || this.selectedKey == "root") {
this.$mk.error("请先选择料品分类");
return;
}
let node = this.findTreeNode(this.selectedKey);
let ids = [
node.id
]; // 定义id数组
if (!ids.length) { // 如果没有选中行
this.$mk.error("请选择行"); // 提示
return;
}
this.$mk.confirm('您确定要删除吗？').then(type => { // 确认删除
if (type == 'confirm') { // 如果确认删除
this.$mk.post({
url: this.actions.delete, // 请求删除数据地址
loading: "删除中...", // 加载提示
data: {
ids: ids // 传递id数组
},
useBigInt: true
}).then(() => { // 成功
this.$mk.success("删除成功"); // 提示成功
this.treeInit(); // 重新加载数据
}).catch((a) => { // 失败
this.$mk.error(a.data.msg); // 提示错误信息
});
}
});
},
getDataId() {
let dataId = this.dataId;
if (this.$route.params.id) {
dataId = this.$route.params.id;
}
return dataId;
},
onTreeSelect(selectedKeys) {
if (selectedKeys && selectedKeys[0]) {
this.selectedKey = selectedKeys[0];
this.loadData(selectedKeys[0]);
}
},
findTreeNode(key) {
var find = (items) => {
for (let i = 0; i < items.length; i++) {
if (items[i].key == key) {
return items[i];
}
if (items[i][childrenFieldName] && items[i][childrenFieldName].length) {
var xx = find(items[i][childrenFieldName]);
if (xx) {
return xx;
}
}
}
};
return find(this.treeData);
},
reloadData() {
if (this.selectedKey) {
this.loadData(this.selectedKey);
}
},
getAllChildrenIds(items) {
let ids = [];
let eachItems = (arr) => {
arr.forEach(item => {
if (item.children && item.children.length) {
eachItems(item.children);
} else {
ids.push(item.id);
}
})
};
eachItems(items);
return ids;
},
loadData(key) {
if (key && key != "root") {
var node = this.findTreeNode(key);
if (node.children && node.children.length) {
var ids = this.getAllChildrenIds(node.children);
this.$refs.listPage.onSearch({
sort_id: [node.id, ...ids].join(',')
})
} else {
this.$refs.listPage.onSearch({
sort_id: node.id
})
}
}else{
this.$refs.listPage.onSearch(null);
}
},
findSourceInfo(idStr) {
for (var i = 0; i < this.sourceDetailsData.length; i++) {
let o = this.sourceDetailsData[i];
if (o.id.toString() == idStr) {
return o;
}
}
},
ok() {
let save = () => {
if (!this.selectedKey || this.selectedKey == "root") {
this.$mk.error("请先选择枚举分类");
return;
}
let node = this.findTreeNode(this.selectedKey);
let ds = JSON.parse(JSON.stringify(this.detailsData));
var postdata = {
insertList: [],
updateList: [],
deleteList: this.deletedDetailsData
};
ds.forEach(item => {
delete item._X_ROW_KEY;
item.enum_id = node.id;
if (item.id && item.id != "0") {
let source = this.findSourceInfo(item.id);
item.id = source.id;
postdata.updateList.push(item);
} else {
postdata.insertList.push(item);
}
})
this.$mk.post({
url: this.actions.save,
loading: "保存中...",
data: postdata,
useBigInt: true
}).then(a => {
if (a.code == "200") {
this.$mk.success("保存成功");
this.reloadData();
} else {
this.$mk.error(a.message);
}
}).catch((a) => {
this.$mk.error(a.data.msg);
});
};
save();
},
back() {
},
cancel() {
this.back();
},
pageAdd(row) {
const $table = this.$refs.xTable
const record = {
}
if (row) {
this.detailsData.splice($table.getRowSeq(row), 0, record);
} else {
this.detailsData.push(record)
}
},
pageDelete(row) {
const $table = this.$refs.xTable;
if (row.id) {
this.deletedDetailsData.push(row.id)
}
this.detailsData.splice($table.getRowSeq(row) - 1, 1);
},
},
// 监听属性
watch: {
}
};
</script>
<style>
.page-body {
background: white;
padding: 8px;
}
.treepanel {
width: calc(100% - 10px);
margin-right: 10px;
border: 1px solid #ccc;
}
.treepanel-content {
padding: 7px;
}
.treepanel-header {
width: 100%;
background: #F8F8F9;
border-bottom: 1px solid #ccc;
height: 32px;
line-height: 32px;
margin: 0;
font-size: 14px;
color: #606266;
}
.treepanel-header .anticon {
margin-left: 5px;
cursor: pointer;
}
.toolbarbtns .ant-btn {
margin-right: 10px;
}
.toolbarbtns {
margin-bottom: 5px;
}
</style>

271
src/pages/Middle/Mes/MesMaterials/MesMaterials/treeEdit.vue Normal file
View File

@ -0,0 +1,271 @@
<template>
<div class="page-body">
<vxe-form :data="formOptions.data" ref="xForm" :title-width="formOptions.titleWidth"
:title-align="formOptions.titleAlign" :rules="formOptions.rules" :items="formOptions.items" titleColon>
<template #parent_id="{}">
<vxe-pulldown style="width:100%" ref="pulldownParent" transfer>
<template #default>
<vxe-input v-model="parentName" suffix-icon="vxe-icon-search" placeholder="选择上级分类" @keyup="pulldownKeyupEvent"
@focus="pulldownFocusEvent" @suffix-click="pulldownSuffixClick"></vxe-input>
</template>
<template #dropdown>
<div class="my-dropdown">
<vxe-grid ref="gridParent" v-bind="gridParentOptions" @cell-click="pulldownCellClickEvent">
</vxe-grid>
</div>
</template>
</vxe-pulldown>
</template>
</vxe-form>
<div class="footerbar">
<a-button type="primary" @click="ok">确定</a-button>
<a-button @click="cancel">取消</a-button>
</div>
</div>
</template>
<script>
import BASE_URL from '@/services/base/api.js';
export default {
props: {
dataId: {
}
},
data() {
// 页面数据变量
var pageData = {
actions: {
create: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/create`,
update: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/update`,
get: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/detail`,
list: `${BASE_URL.BASE_URL}/MesMaterials/v1/mes/materials/sort/list`,
},
parentName: '',
gridParentOptions: {
height: 400,
id: 'datagrid_router_parent_1',
proxyConfig: {
sort: true, // 启用排序代理，当点击排序时会自动触发 query 行为
filter: true, // 启用筛选代理，当点击筛选时会自动触发 query 行为
props: {
result: 'MesMaterialsSort', // 配置响应结果列表字段
total: 'total' // 配置响应结果总页数字段
},
// 接收Promise
ajax: {
// 当点击工具栏查询按钮或者手动提交指令 query或reload 时会被触发
query: (options) => {
const { page, sorts } = options;
var params = {};
params.page = page.currentPage;
params.limit = page.pageSize;
params.order_bys = [];
params.search_rules = [];
if (sorts) {
sorts.forEach((v) => {
params.order_bys.push({
column: v.property,
order: v.order
})
});
}
return this.loadParentGrid({ params });
}
}
},
sortConfig: {
},
treeConfig: {
transform: true,
expandAll: true,
rowField: 'id',
parentField: 'parent_id'
},
checkboxConfig: {
reserve: true,
highlight: true
},
columns: [
{ field: 'name', sortable: true, title: '分类名', showHeaderOverflow: true, treeNode: true },
{ field: 'code', sortable: true, title: '编号', showHeaderOverflow: true }
]
},
formOptions: {
data: {
"name": "",
"code": "",
parent_id: "0"
},
titleWidth: 150,
titleAlign: 'right',
rules: {
name: [
{ required: true, message: '请输入名称' }
]
},
items: [
{ field: 'name', title: '名称', span: 24, itemRender: { name: '$input', props: { placeholder: '请输入名称' } } },
{ field: 'code', title: '编号', span: 24, itemRender: { name: '$input', props: { placeholder: '请输入编号' } } },
{ title: '上级分类', span: 24, slots: { default: 'parent_id' } },
]
}
};
pageData.gridParentOptions = Object.assign({}, this.$mk.config.defaults.gridOptions, pageData.gridParentOptions);
pageData.formOptions = Object.assign({}, this.$mk.config.defaults.formOptions, pageData.formOptions);
return pageData;
},
created() {
if (this.dataId) {
this.$mk.post({
url: this.actions.get,
loading: "加载中...",
data: {
id: this.dataId
},
useBigInt: true
}).then(a => {
this.formOptions.data = a.data.mes_materials_sort;
this.parentNameInit() ;
}).catch((a) => {
this.$mk.error(a.data.msg);
});
}
},
// 函数
methods: {
parentNameInit() {
this.treeLoading = true;
this.$mk.post({
url: this.actions.list,
data: {
"page": 1,
"limit": 10000,
"end_time": 0,
"start_time": 0,
"order_bys": [
],
"search_rules": [
]
}
}).then(r => {
if(r.data.MesMaterialsSort){
r.data.MesMaterialsSort.forEach(item=>{
if(this.formOptions.data.parent_id && item.id.toString() == this.formOptions.data.parent_id.toString()){
this.parentName = item.name;
}
})
}
});
},
loadParentGrid({ params }) {
params.start_time = 0;
params.end_time = 0;
return this.$mk.getPagedData({ url: this.actions.list, data: params });
},
loadData() {
},
ok() {
let save = () => {
let action = !this.dataId ? this.actions.create : this.actions.update;
let postdata = Object.assign({ id: this.dataId }, this.formOptions.data);
if(postdata.parent_id == "0"){
postdata.parent_id = 0;
}
if(typeof(postdata.parent_id) == "string"){
postdata.parent_id = parseInt(postdata.parent_id)
}
this.$mk.post({
url: action,
loading: "保存中...",
data: postdata,
useBigInt: true
}).then(() => {
this.$mk.success("保存成功");
this.$emit("callback", { success: true });
}).catch((a) => {
this.$mk.error(a.data.msg);
});
};
this.$refs.xForm.validate((a) => {
let count = 0;
if (a) {
for (let name in a) {
a[name];
count++;
}
}
if (count > 0) {
this.$mk.error(`存在${count}项错误，请检查`);
}
else {
save();
}
});
},
cancel() {
this.$emit("callback", {});
},
pulldownFocusEvent() {
this.$refs.pulldownParent.showPanel()
},
pulldownKeyupEvent() {
},
pulldownSuffixClick() {
this.$refs.pulldownParent.togglePanel()
},
pulldownCellClickEvent({ row }) {
this.formOptions.data.parent_id = row.id;
this.parentName = row.name;
this.$refs.pulldownParent.hidePanel()
},
},
// 监听属性
watch: {
}
};
</script>
<style></style>

2
src/router/Middle/Mes/MesMaterials/router.map.js
View File

@ -33,7 +33,7 @@ routerMap[FunName + 'List']= {
meta:{
page:{ cacheAble:false}
},
component: () => import(`@/pages/Middle/Mes/MesMaterials/MesMaterials/List`),
component: () => import(`@/pages/Middle/Mes/MesMaterials/MesMaterials/index`),
authority: {
permission: [],
}