lb #19

Merged
g7hoo merged 80 commits from lb into test 2023-09-11 15:05:16 +08:00
2 changed files with 130 additions and 105 deletions
Showing only changes of commit 72393caee1 - Show all commits

View File

@ -46,6 +46,8 @@ export default {
.app-main {
/* 84 = navbar + tags-view = 50 + 34 */
min-height: calc(100vh - 120px - 8px);
display: flex;
flex-direction: column;
}
.fixed-header + .app-main {

View File

@ -6,36 +6,50 @@
-->
<template>
<div class="equipment-process-amount">
<!-- side bar -->
<div class="side-bar__left"></div>
<div style="flex: 1; display: flex; background: #f2f4f9">
<div
class="app-container"
style="margin-right: 12px; border-radius: 8px; background: #fff">
<!-- side bar -->
<div
class="side-bar__left"
style="width: 240px; padding: 12px; height: 100%">
<el-tree
:data="sidebarContent"
:props="treeProps"
@node-click="handleSidebarItemClick" />
</div>
</div>
<div
class="app-container equipment-process-amount"
style="flex: 1; border-radius: 8px; background: #fff">
<!-- main area -->
<div class="main-content">
<SearchBar
:formConfigs="searchBarFormConfig"
ref="search-bar"
@headBtnClick="handleSearchBarBtnClick" />
<!-- main area -->
<div class="main-content">
<SearchBar
:formConfigs="searchBarFormConfig"
ref="search-bar"
@headBtnClick="handleSearchBarBtnClick" />
<!-- tabs -->
<div class="table" v-if="mode == 'table'">
<base-table
:table-props="tableProps"
:page="queryParams.pageNo"
:limit="queryParams.pageSize"
:table-data="list"
@emitFun="handleEmitFun">
<!-- <method-btn
<!-- tabs -->
<div class="table" v-if="mode == 'table'">
<base-table
:table-props="tableProps"
:page="queryParams.pageNo"
:limit="queryParams.pageSize"
:table-data="list"
@emitFun="handleEmitFun">
<!-- <method-btn
v-if="tableBtn.length"
slot="handleBtn"
label="操作"
:method-list="tableBtn"
@clickBtn="handleTableBtnClick" /> -->
</base-table>
</div>
</base-table>
</div>
<div class="graph" v-else>
<!-- graph -->
<div class="graph" v-else>
<!-- graph -->
</div>
</div>
</div>
</div>
@ -50,33 +64,43 @@ export default {
return {
sidebarContent: [
{
factory: '工厂',
children: [
id: 'fc1',
name: '工厂',
lines: [
{
pl: '产线1',
children: [
name: '产线1',
id: 'pl1',
sections: [
{
ws: '工段1',
name: '工段1',
id: 'pl1ws1',
},
{
ws: '工段2',
name: '工段2',
id: 'pl1ws2',
},
{
ws: '工段3',
name: '工段3',
id: 'pl1ws3',
},
],
},
{
pl: '产线2',
children: [
name: '产线2',
id: 'pl2',
sections: [
{
ws: '工段1',
name: '工段1',
id: 'pl2ws1',
},
{
ws: '工段2',
name: '工段2',
id: 'pl2ws2',
},
{
ws: '工段3',
name: '工段3',
id: 'pl2ws3',
},
],
},
@ -85,16 +109,17 @@ export default {
],
searchBarFormConfig: [
{
type: 'input',
label: '分组名称',
placeholder: '请输入设备分组名称',
param: 'name',
},
{
type: 'input',
label: '分组编码',
placeholder: '请输入设备分组编码',
param: 'codes',
type: 'datePicker',
label: '时间段',
dateType: 'daterange', // datetimerange
format: 'yyyy-MM-dd',
valueFormat: 'yyyy-MM-dd HH:mm:ss',
rangeSeparator: '-',
startPlaceholder: '开始日期',
endPlaceholder: '结束日期',
defaultTime: ['00:00:00', '23:59:59'],
param: 'timeVal',
width: 350,
},
{
type: 'button',
@ -102,79 +127,77 @@ export default {
name: 'search',
color: 'primary',
},
{
type: 'separate',
},
{
type: this.$auth.hasPermi('base:equipment-group:create')
? 'button'
: '',
btnName: '新增',
name: 'add',
plain: true,
color: 'success',
},
// {
// type: this.$auth.hasPermi('base:equipment-group:export') ? 'button' : '',
// btnName: '',
// name: 'export',
// color: 'warning',
// },
],
tableProps: [
// {
// prop: 'createTime',
// label: '',
// fixed: true,
// width: 180,
// filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
// },
{ prop: 'name', label: '产线', align: 'center' },
{ prop: 'code', label: '工段', align: 'center' },
{ prop: 'remark', label: '设备编码', align: 'center' },
{ prop: 'remark', label: '设备名称', align: 'center' },
{ prop: 'remark', label: '加工数量', align: 'center' },
// {
// _action: 'equipment-group-show-alert',
// label: '',
// align: 'center',
// subcomponent: {
// props: ['injectData'],
// render: function (h) {
// const _this = this;
// return h(
// 'el-button',
// {
// props: { type: 'text', size: 'mini' },
// on: {
// click: function () {
// console.log('inejctdata', _this.injectData);
// _this.$emit('emitData', {
// action: _this.injectData._action,
// // value: _this.injectData.id,
// value: _this.injectData,
// });
// },
// },
// },
// ''
// );
// },
// },
// },
{ prop: 'lineName', label: '产线', align: 'center' },
{ prop: 'sectionName', label: '工段', align: 'center' },
{ prop: 'externalCode', label: '设备编码', align: 'center' },
{ prop: 'equipmentName', label: '设备名称', align: 'center' },
{ prop: 'totalQuantity', label: '加工数量', align: 'center' },
],
mode: 'table', // table | graph
queryParams: {
pageNo: 1,
pageSize: 999,
recordTime: [],
equipmentId: null,
lineId: null,
sectionId: null,
productId: null,
},
list: [],
treeProps: {
children: 'children',
label: 'label',
},
};
},
computed: {},
mounted() {
this.getList();
},
methods: {
/** build side bar tree */
buildTree(data) {
data.forEach((factory) => {
this.$set(factory, 'label', factory.name);
delete factory.name;
factory.children = factory.lines;
delete factory.lines;
factory.children.forEach((line) => {
this.$set(line, 'label', line.name);
delete line.name;
line.children = line.sections;
delete line.sections;
line.children.forEach((ws) => {
this.$set(ws, 'label', ws.name);
delete ws.name;
});
});
});
},
async getList() {
this.buildTree(this.sidebarContent);
console.log('sidebar final', this.sidebarContent);
},
handleSidebarItemClick({ label, id }) {
console.log('lable clicked!', label, id);
},
handleEmitFun() {},
handleSearchBarBtnClick() {},
handleSearchBarBtnClick(btn) {
console.log('btn', btn);
this.queryParams.recordTime = btn.timeVal;
this.handleQuery();
},
handleQuery() {
console.log(this.queryParams)
}
},
};
</script>