update 报表管理

This commit is contained in:
lb 2023-03-06 14:08:19 +08:00
parent 96861954b2
commit b3b7e4a31d
4 changed files with 344 additions and 96 deletions

View File

@ -300,6 +300,47 @@ export default {
}); });
}); });
} }
case "change-category": {
return this.$http.put(this.urls.base, data).then(({ data: res }) => {
if (res.code === 0) {
this.$message({
message: "修改成功",
type: "success",
duration: 1500,
onClose: () => {
this.getList();
},
});
} else {
this.$message({
message: `${res.code}: ${res.msg}`,
type: "error",
duration: 1500,
});
}
});
}
case "preview": {
console.log("[PREVIEW] data", data);
// report preview
return this.$router.push({
name: "pms-reportPreview",
query: {
name: data,
},
});
}
case "design": {
console.log("[DESIGN] data", data);
// report design
return this.$router.push({
name: "pms-reportDesign",
query: {
name: data,
},
});
break;
}
} }
}, },

View File

@ -0,0 +1,181 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import switchBtn from "@/components/noTemplateComponents/switchBtn";
import request from "@/utils/request";
import { timeFilter } from '@/utils/filters'
// 报表分类小组件
const CategoryList = {
name: 'CategoryList',
props: {
injectData: {
type: Object,
required: true,
default: () => ({})
}
},
data() {
return { list: [], calcMaxHeight, pickedId: null }
},
mounted() {
console.log(this.injectData)
if (categoryOptions.length === 0) {
// 获取并缓存 categoryOptions
axios.get('/pms/reportSheetCategory/list').then(({ data: res }) => {
if (res.code === 0) {
console.log('[CategoryList小组件]', res.data)
categoryOptions = res.data
} else {
categoryOptions.splice(0)
}
})
} else {
this.list = categoryOptions
}
this.pickedId = this.injectData[this.injectData.head.prop]
},
methods: {
// destroy dialog
handleDestroyDialog() {
setTimeout(() => {
this.addOrUpdateVisible = false
}, /** after dialog animated */ 200);
},
handleChange(id) {
this.pickedId = id
this.$emit('emit-data', {
type: 'change-category',
data: { id: this.injectData.id, fileName: this.injectData.fileName, name: this.injectData.name, url: this.injectData.url, categoryId: id }
})
}
},
render: function (h) {
const childOptions = []
this.injectData.head.options?.forEach(item => {
console.log('【报表分类】', item.value)
childOptions.push(h('el-option', { props: { label: item.label, value: item.value } }, null))
})
return h('el-select', { props: { value: this.pickedId }, on: { change: this.handleChange } }, childOptions)
}
}
export default async function () {
const categoryList = (await this.$http.get('/pms/reportSheetCategory/list'))?.data?.data
if (Array.isArray(categoryList)) {
console.log('category ====> ', categoryList)
const tableProps = [
{ type: 'index', label: '序号' },
{ prop: "createTime", label: "添加时间", width: 180, filter: timeFilter },
{ prop: "fileName", label: "报表名称" },
{ prop: "category", label: "报表分类", subcomponent: CategoryList, options: categoryList },
{
prop: "operations",
name: "操作",
fixed: "right",
width: 120,
subcomponent: TableOperaionComponent,
options: ["edit", { name: "delete", emitFull: true, permission: "pms:productionLine:delete" }],
},
];
const headFormFields = [
{
prop: 'name',
label: "报表名称",
input: true,
default: { value: "" },
bind: {
placeholder: '请输入报表名称'
}
},
{
button: {
type: "primary",
name: "查询",
},
},
{
button: {
type: "primary",
name: "新增",
permission: "pms:productionLine:save"
},
bind: {
plain: true,
}
},
];
const dialogJustFormConfigs = {
form: {
rows: [
[
{
input: true,
label: "产线名称",
prop: "name",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入产线名称" },
},
{
input: true,
label: "产线编码",
prop: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入产线编码" },
},
{
select: true,
label: "所属工厂",
prop: "factoryId",
fetchData: () => this.$http.get("/pms/factory/page", { params: { limit: 999, page: 1 } }),
option: [],
rules: { required: true, message: "必填项不能为空", trigger: "change" },
},
],
// [
// {
// input: true,
// label: "产线TT值",
// prop: "tvalue",
// rules: [
// { required: true, message: "必填项不能为空", trigger: "blur" },
// { type: "number", message: "数字", trigger: "blur", transform: (val) => Number(val) },
// ],
// elparams: { placeholder: "设定TT值每小时下片数量" },
// },
// ],
[{ textarea: true, label: "描述信息", prop: "description", elparams: { placeholder: "描述信息" } }],
[{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }],
],
operations: [
{ name: "add", label: "保存", type: "primary", permission: "pms:productionLine:save", showOnEdit: false },
{ name: "update", label: "更新", type: "primary", permission: "pms:productionLine:update", showOnEdit: true },
{ name: "reset", label: "重置", type: "warning", showAlways: true },
// { name: 'cancel', label: '取消', showAlways: true },
],
},
};
return {
dialogConfigs: dialogJustFormConfigs,
tableConfig: {
table: null, column: tableProps
},
headFormConfigs: {
rules: null,
fields: headFormFields
},
urls: {
base: "/pms/reportSheet",
page: "/pms/reportSheet/page",
// subase: '/pms/blenderStepParam',
// subpage: '/pms/blenderStepParam/page',
// more...
}
}
}
};

View File

@ -1,39 +1,81 @@
import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent"; import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import switchBtn from "@/components/noTemplateComponents/switchBtn"; import switchBtn from "@/components/noTemplateComponents/switchBtn";
import request from "@/utils/request"; import request from "@/utils/request";
import { timeFilter } from '@/utils/filters' import { timeFilter } from "@/utils/filters";
// 报表分类小组件
const CategoryList = {
name: "CategoryList",
props: {
injectData: {
type: Object,
required: true,
default: () => ({}),
},
},
data() {
return { pickedId: null };
},
mounted() {
// console.log(this.injectData)
this.pickedId = this.injectData[this.injectData.head.prop];
},
methods: {
handleChange(id) {
this.pickedId = id;
this.$emit("emit-data", {
type: "change-category",
data: { id: this.injectData.id, fileName: this.injectData.fileName, name: this.injectData.name, url: this.injectData.url, category: id },
});
},
},
render: function (h) {
const childOptions = [];
this.injectData.head.options?.forEach((item) => {
// console.log('【报表分类】', item.value)
childOptions.push(h("el-option", { props: { label: item.label, value: item.value } }, null));
});
return h("el-select", { props: { value: this.pickedId }, on: { change: this.handleChange } }, childOptions);
},
};
export async function fetchCategoryList() {
const categoryList = (await this.$http.get("/pms/reportSheetCategory/list"))?.data?.data;
if (Array.isArray(categoryList)) {
return categoryList;
}
}
export default function () { export default function () {
const tableProps = [ const tableProps = [
{ type: 'index', label: '序号' }, { type: "index", label: "序号" },
{ prop: "createTime", label: "添加时间", filter: timeFilter }, { prop: "createTime", label: "添加时间", width: 180, filter: timeFilter },
{ prop: "name", label: "报表名称" }, { prop: "fileName", label: "报表名称" },
{ prop: "code", label: "报表分类" }, { prop: "category", label: "报表分类", subcomponent: CategoryList, options: [] },
// { prop: "factory", label: "所属工厂" },
// { prop: "status", label: "产线状态", subcomponent: switchBtn }, // subcomponent
// TODO: 2023.2.3 产线状态切换功能不生效
// { prop: "tvalue", label: "每小时下片数量" },
// { prop: "description", label: "描述" },
// { prop: "remark", label: "备注" },
{ {
prop: "operations", prop: "operations",
name: "操作", name: "操作",
fixed: "right", fixed: "right",
width: 120, width: 240,
subcomponent: TableOperaionComponent, subcomponent: TableOperaionComponent,
options: ["edit", { name: "delete", emitFull: true, permission: "pms:productionLine:delete" }], options: [
{ name: "preview", permission: "pms:reportSheet:preview" },
{ name: "design", permission: "pms:reportSheet:design" },
"edit",
{ name: "delete", emitFull: true, permission: "pms:reportSheet:delete" },
],
}, },
]; ];
const headFormFields = [ const headFormFields = [
{ {
prop: 'key', prop: "name",
label: "产线名称/编码", label: "报表名称",
input: true, input: true,
default: { value: "" }, default: { value: "" },
bind: { bind: {
placeholder: '请输入产线名称或编码' placeholder: "请输入报表名称",
} },
}, },
{ {
button: { button: {
@ -41,88 +83,53 @@ export default function () {
name: "查询", name: "查询",
}, },
}, },
{ // {
button: { // button: {
type: "primary", // type: "primary",
name: "新增", // name: "新增",
permission: "pms:productionLine:save" // permission: "pms:productionLine:save"
}, // },
bind: { // bind: {
plain: true, // plain: true,
} // }
}, // },
]; ];
/**
* dialog config 有两个版本一个适用于 DialogWithMenu 组件另一个适用于 DialogJustForm 组件
* 适用于 DialogWithMenu 组件的配置示例详见 blenderStep/config.js
* 此为后者的配置:
*/
const dialogJustFormConfigs = { const dialogJustFormConfigs = {
form: { form: {
rows: [ rows: [
[ [
{ {
input: true, input: true,
label: "产线名称", label: "报表名称",
prop: "name", prop: "fileName",
rules: { required: true, message: "必填项不能为空", trigger: "blur" }, rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入产线名称" }, elparams: { placeholder: "请输入报表名称" },
},
{
input: true,
label: "产线编码",
prop: "code",
rules: { required: true, message: "必填项不能为空", trigger: "blur" },
elparams: { placeholder: "请输入产线编码" },
},
{
select: true,
label: "所属工厂",
prop: "factoryId",
fetchData: () => this.$http.get("/pms/factory/page", { params: { limit: 999, page: 1 } }),
option: [],
rules: { required: true, message: "必填项不能为空", trigger: "change" },
}, },
], ],
// [
// {
// input: true,
// label: "产线TT值",
// prop: "tvalue",
// rules: [
// { required: true, message: "必填项不能为空", trigger: "blur" },
// { type: "number", message: "数字", trigger: "blur", transform: (val) => Number(val) },
// ],
// elparams: { placeholder: "设定TT值每小时下片数量" },
// },
// ],
[{ textarea: true, label: "描述信息", prop: "description", elparams: { placeholder: "描述信息" } }],
[{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }],
], ],
operations: [ operations: [
{ name: "add", label: "保存", type: "primary", permission: "pms:productionLine:save", showOnEdit: false }, { name: "add", label: "保存", type: "primary", permission: "pms:reportSheet:save", showOnEdit: false },
{ name: "update", label: "更新", type: "primary", permission: "pms:productionLine:update", showOnEdit: true }, { name: "update", label: "修改", type: "primary", permission: "pms:reportSheet:update", showOnEdit: true },
{ name: "reset", label: "重置", type: "warning", showAlways: true }, // { name: "reset", label: "重置", type: "warning", showAlways: true },
// { name: 'cancel', label: '取消', showAlways: true }, // { name: 'cancel', label: '取消', showAlways: true },
], ],
}, },
}; };
// 备注:弹窗弹出的时间和网速有关......
return { return {
dialogConfigs: dialogJustFormConfigs, dialogConfigs: dialogJustFormConfigs,
tableConfig: { tableConfig: {
table: null, // 此处可省略el-table 上的配置项 table: null,
column: tableProps, // el-column-item 上的配置项 column: tableProps,
}, },
headFormConfigs: { headFormConfigs: {
rules: null, // 名称是由 BaseSearchForm.vue 组件固定的 rules: null,
fields: headFormFields, // 名称是由 BaseSearchForm.vue 组件固定的 fields: headFormFields,
}, },
urls: { urls: {
base: "/pms/productionLine", base: "/pms/reportSheet",
page: "/pms/productionLine/page", page: "/pms/reportSheet/page",
// subase: '/pms/blenderStepParam', // subase: '/pms/blenderStepParam',
// subpage: '/pms/blenderStepParam/page', // subpage: '/pms/blenderStepParam/page',
// more... // more...

View File

@ -1,31 +1,50 @@
<template> <template>
<ListViewWithHead :table-config="tableConfig" :head-config="headFormConfigs" :dialog-configs="dialogConfigs" /> <ListViewWithHead :table-config="tableConfig" :head-config="headFormConfigs" :dialog-configs="dialogConfigs" />
</template> </template>
<script> <script>
import initConfig from './config'; import initConfig, { fetchCategoryList } from "./config";
import ListViewWithHead from '@/views/atomViews/ListViewWithHead.vue'; import ListViewWithHead from "@/views/atomViews/ListViewWithHead.vue";
export default { export default {
name: 'ReportSheetView', name: "ReportSheetView",
components: { ListViewWithHead }, components: { ListViewWithHead },
provide() { provide() {
return { return {
urls: this.allUrls urls: this.allUrls,
} };
}, },
data() { data() {
const { tableConfig, headFormConfigs, urls, dialogConfigs } = initConfig.call(this); const { tableConfig, headFormConfigs, urls: allUrls, dialogConfigs } = initConfig.call(this);
return { return {
tableConfig, tableConfig,
headFormConfigs, headFormConfigs,
allUrls: urls, allUrls,
dialogConfigs, dialogConfigs,
}; };
}, },
created() {}, created() {},
mounted() {}, mounted() {
methods: {}, // initConfig.call(this).then(({ tableConfig, headFormConfigs, urls, dialogConfigs }) => {
// this.tableConfig = tableConfig;
// this.headFormConfigs = headFormConfigs;
// this.allUrls = urls;
// this.dialogConfigs = dialogConfigs
// });
fetchCategoryList.call(this).then((categoryList) => {
console.log("[fetchCategoryList() then...]");
if ("column" in this.tableConfig) {
const categoryProp = this.tableConfig.column.find((item) => item.prop === "category");
this.$set(
categoryProp,
"options",
categoryList.map((item) => ({ label: item.name, value: item.id }))
);
console.log("[报表, 设置options成功..]", categoryProp);
}
});
},
methods: {},
}; };
</script> </script>