料品管理

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

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: {

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>
@ -21,9 +45,67 @@ 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: {
// queryreload
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: {
@ -43,7 +125,14 @@ export default {
methods: {
loadParentGrid({ params }) {
params.start_time = 0;
params.end_time = 0;
return this.$mk.getPagedData({ url: this.actions.list, data: params });
},
optionsInit() {
//
var pageData = {
@ -82,22 +171,6 @@ 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,
@ -109,24 +182,32 @@ export default {
// =============================== Start ===============================
code: [
{ required: true, message: '请输入编码' }
{ required: true, message: '请输入编号' }
],
name: [
{ required: true, message: '请输入名称' }
]
// =============================== End ===============================
},
//
items: [
// =============================== Start ===============================
{ 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' } },
{ 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 ===============================
]
},
//
@ -137,6 +218,10 @@ export default {
};
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;
@ -144,7 +229,7 @@ export default {
//
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.pageOptions.formOptions.data = a.data[detailDataFieldName];
this.options.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: {
@ -212,3 +394,33 @@ 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>

View File

@ -102,14 +102,21 @@ export default {
// =============================== 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: '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 }, //

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>

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: {
// queryreload
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>

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: [],
}