1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
| <script setup>
| import {onMounted, reactive, ref, watch} from "vue";
| import {useI18n} from "vue-i18n";
| import request from "@/utils/request";
| import {ElMessage} from "element-plus";
| import {changeFilterEvent, filterChanged} from "@/hook";
| const { t } = useI18n()
|
| let props = defineProps({
| processId:null,
| technologyNumber:null
| })
| const xGrid = ref()
|
| const gridOptions = reactive({
| height:'100%',
| loading: false,
| border: "full",//表格加边框
| keepSource: true,//保持源数据
| align: 'center',//文字居中
| stripe:true,//斑马纹
| rowConfig: {isCurrent: true, isHover: true,height: 30, useKey: true},//鼠标移动或选择高亮
| id: 'ProcessCardDetail',
| scrollX:{enabled: true},
| scrollY:{ enabled: true ,gt:0},//开启虚拟滚动
| showOverflow:true,
| columnConfig: {
| resizable: true,
| useKey: true
| },
| filterConfig: { //筛选配置项
| //remote: true
| },
| customConfig: {
| storage: true
| },
| editConfig: {
| trigger: 'click',
| mode: 'row',
| showStatus: true
| },
| /*formConfig: {
| data: {
| width: '',
| height: '',
| quantity: ''
| },
| items: [
| { field: 'width', title: t('order.width')+':', itemRender: { name: 'VxeInput' } },
| { field: 'height', title: t('order.height')+':', itemRender: { name: 'VxeInput' } },
| { field: 'quantity', title: t('order.quantity')+':', itemRender: { name: 'VxeInput' } },
| {
| itemRender: {
| name: 'VxeButtonGroup',
| options: [
| { type: 'submit', content: t('craft.sure'), status: 'primary' },
| { type: 'reset', content: t('product.msg.reset') }
| ]
| }
| }
| ]
| },*/
| columns:[
| {field: 'order_number',width: 70, title: '序号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field:'child_width',width: 150,title: t('order.width'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'child_height',width: 150,title: t('order.height'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'quantity',width: 150, title: t('order.quantity'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'building_number',width: 150, title: t('order.buildingNumber'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'shape',width: 150, title: t('order.shape'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'grossArea',width: 150, title: t('order.grossArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
| {field: 'separation',width: 150, title: t('craft.TrademarkAttribute'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
|
| ],//表头参数
| data:null,//表格数据
| toolbarConfig: {
| buttons: [],
| slots:{
| },
| },
|
| })
|
|
| onMounted(()=>{
|
| })
|
| watch(
|
| () => props.processId,
| (newValue, oldValue) => {
| if (props.processId!=null){
| getWorkOrder()
| }
|
| }
| );
|
|
| watch(() => props.technologyNumber,
| (newValue, oldValue) => {
| if (props.technologyNumber != null) {
| getWorkOrder();
| }
| });
|
|
| const getWorkOrder = () => {
| if ((props.processId != null && props.processId != "") &&
| (props.technologyNumber != null && props.technologyNumber != "")) {
| request.post(`/glassOptimize/getProcessCardDetail/${props.processId}/${props.technologyNumber}`).then((res) => {
| if(res.code==200){
| xGrid.value.loadData(res.data.data)
| }else{
| ElMessage.warning(res.msg)
| }
| })
| }
| }
| </script>
|
| <template>
| <div style="width: 100%;height: 100%">
| <h2>流程卡详情</h2>
| <vxe-grid
| size="small"
| height="100%"
| class="mytable-scrollbar"
| ref="xGrid"
| v-bind="gridOptions"
| v-on="gridEvents"
| >
| <template #num2_filter="{ column, $panel }">
| <div>
| <div v-for="(option, index) in column.filters" :key="index">
| <vxe-select v-model="option.data" :placeholder="$t('processCard.pleaseSelect')" @change="changeFilterEvent($event, option, $panel)">
| <vxe-option value="0" :label="$t('basicData.unchecked')"></vxe-option>
| <vxe-option value="1" :label="$t('basicData.selected')"></vxe-option>
| </vxe-select>
| </div>
| </div>
| </template>
|
| <template #num1_filter="{ column, $panel }">
| <div>
| <div v-for="(option, index) in column.filters" :key="index">
| <input type="type" v-model="option.data" @keyup.enter.native="$panel.confirmFilter()" @input="changeFilterEvent($event, option, $panel)"/>
| </div>
| </div>
| </template>
|
| </vxe-grid>
| </div>
| </template>
|
| <style scoped>
|
| </style>
|
|
