schangxiang@126.com
2024-12-04 d333a3cfd7882071fc3b9e357a8882e1e3f325d5
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
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
<template>
  <div class="validateQiTaoOutput-container">
    <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> 
      <el-form :model="queryParamsValidateQiTaoOutput" ref="queryForm" labelWidth="90">
        <el-row>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
            <el-form-item label="关键字">
              <el-input v-model="queryParamsValidateQiTaoOutput.searchKey" clearable="" placeholder="包装号,生产单号,批次号,订单号,销售合同单号,第几包,经销店名称,产品名称,客户名称,自提or发货,包装部件总数量,包装面积,创建人,修改人"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="包装号">
              <el-input v-model="queryParamsValidateQiTaoOutput.packageCode" clearable="" placeholder="请输入包装号"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="生产单号">
              <el-input v-model="queryParamsValidateQiTaoOutput.info5" clearable="" placeholder="请输入生产单号"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="批次号">
              <el-input v-model="queryParamsValidateQiTaoOutput.planNo" clearable="" placeholder="请输入批次号"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="订单号">
              <el-input v-model="queryParamsValidateQiTaoOutput.orderId" clearable="" placeholder="请输入订单号"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="所在区域">
              <el-select clearable="" v-model="queryParamsValidateQiTaoOutput.areaCode" placeholder="请选择所在区域">
                <el-option v-for="(item,index) in getEnumAreaCodeData_Index" :key="index" :value="item.value" :label="`${item.describe}`" />
                
              </el-select>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="板料状态">
              <el-select clearable="" v-model="queryParamsValidateQiTaoOutput.upiStatus" placeholder="请选择板料状态">
                <el-option v-for="(item,index) in getEnumUpiStatusData_Index" :key="index" :value="item.value" :label="`${item.describe}`" />
                
              </el-select>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="纸箱长">
              <el-input v-model="queryParamsValidateQiTaoOutput.info1" clearable="" placeholder="请输入纸箱长"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="纸箱宽">
              <el-input v-model="queryParamsValidateQiTaoOutput.info2" clearable="" placeholder="请输入纸箱宽"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="纸箱高">
              <el-input v-model="queryParamsValidateQiTaoOutput.info3" clearable="" placeholder="请输入纸箱高"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="销售合同单号">
              <el-input v-model="queryParamsValidateQiTaoOutput.info4" clearable="" placeholder="请输入销售合同单号"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="第几包">
              <el-input v-model="queryParamsValidateQiTaoOutput.info6" clearable="" placeholder="请输入第几包"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="经销店名称">
              <el-input v-model="queryParamsValidateQiTaoOutput.info7" clearable="" placeholder="请输入经销店名称"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="产品名称">
              <el-input v-model="queryParamsValidateQiTaoOutput.info8" clearable="" placeholder="请输入产品名称"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="客户名称">
              <el-input v-model="queryParamsValidateQiTaoOutput.info10" clearable="" placeholder="请输入客户名称"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="自提or发货">
              <el-input v-model="queryParamsValidateQiTaoOutput.info11" clearable="" placeholder="请输入自提or发货"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="包装部件总数量">
              <el-input v-model="queryParamsValidateQiTaoOutput.info12" clearable="" placeholder="请输入包装部件总数量"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="showAdvanceQueryUIValidateQiTaoOutput">
            <el-form-item label="包装面积">
              <el-input v-model="queryParamsValidateQiTaoOutput.info13" clearable="" placeholder="请输入包装面积"/>
              
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6" class="mb10">
            <el-form-item>
              <el-button-group style="display: flex; align-items: center;">
                <el-button type="primary"  icon="ele-Search" @click="handleQueryValidateQiTaoOutput" v-auth="'validateQiTaoOutput:page'" :disabled="disabled_btnValidateQiTaoOutput"> 查询 </el-button>
                      <el-button icon="ele-Refresh" @click="resetValidateQiTaoOutput"> 重置 </el-button>
                        <el-button icon="ele-ZoomIn" @click="changeAdvanceQueryUIValidateQiTaoOutput" v-if="!showAdvanceQueryUIValidateQiTaoOutput" style="margin-left:5px;"> 高级查询 </el-button>
                        <el-button icon="ele-ZoomOut" @click="changeAdvanceQueryUIValidateQiTaoOutput" v-if="showAdvanceQueryUIValidateQiTaoOutput" style="margin-left:5px;"> 隐藏 </el-button>
                <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="openAddValidateQiTaoOutput" v-auth="'validateQiTaoOutput:add'"> 新增 </el-button>
                <el-button type="primary" style="margin-left:5px;" icon="ele-Download" @click="handleExportExcelValidateQiTaoOutput"  v-auth="'validateQiTaoOutput:exportExcel'" > 导出 </el-button>
              </el-button-group>
            </el-form-item>
            
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card class="full-table" shadow="hover" style="margin-top: 5px">
      <el-table
                ref="tableRefValidateQiTaoOutput"
                :data="tableDataValidateQiTaoOutput"
                style="width: 100%"
                v-loading="loadingValidateQiTaoOutput"
                tooltip-effect="light"
                                row-key="id"
                @sort-change="sortChangeValidateQiTaoOutput"
                border="">
        <el-table-column type="index" label="序号" width="55" align="center"/>
        <el-table-column prop="packageCode" label="包装号"  show-overflow-tooltip="" />
        <el-table-column prop="info5" label="生产单号"  show-overflow-tooltip="" />
        <el-table-column prop="planNo" label="批次号"  show-overflow-tooltip="" />
        <el-table-column prop="orderId" label="订单号"  show-overflow-tooltip="" />
          <el-table-column prop="areaCode" label="所在区域"  show-overflow-tooltip="" >
            <template #default="scope">
              <el-tag>{{ getEnumDesc(scope.row.areaCode, getEnumAreaCodeData_Index)}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column prop="upiStatus" label="板料状态"  show-overflow-tooltip="" >
            <template #default="scope">
              <el-tag>{{ getEnumDesc(scope.row.upiStatus, getEnumUpiStatusData_Index)}}</el-tag>
            </template>
          </el-table-column>
        <el-table-column prop="info1" label="纸箱长"  show-overflow-tooltip="" />
        <el-table-column prop="info2" label="纸箱宽"  show-overflow-tooltip="" />
        <el-table-column prop="info3" label="纸箱高"  show-overflow-tooltip="" />
        <el-table-column prop="info4" label="销售合同单号"  show-overflow-tooltip="" />
        <el-table-column prop="info6" label="第几包"  show-overflow-tooltip="" />
        <el-table-column prop="info7" label="经销店名称"  show-overflow-tooltip="" />
        <el-table-column prop="info8" label="产品名称"  show-overflow-tooltip="" />
        <el-table-column prop="info10" label="客户名称"  show-overflow-tooltip="" />
        <el-table-column prop="info11" label="自提or发货"  show-overflow-tooltip="" />
        <el-table-column prop="info12" label="包装部件总数量"  show-overflow-tooltip="" />
        <el-table-column prop="info13" label="包装面积"  show-overflow-tooltip="" />
         <el-table-column prop="createTime" label="创建时间" width="130" :formatter="formatDate_T_Time"  show-overflow-tooltip="" />
         <el-table-column prop="updateTime" label="修改时间" width="130" :formatter="formatDate_T_Time"  show-overflow-tooltip="" />
        <el-table-column prop="createUserName" label="创建人"  show-overflow-tooltip="" />
        <el-table-column prop="updateUserName" label="修改人"  show-overflow-tooltip="" />
        <el-table-column label="操作" width="140" align="center" fixed="right" show-overflow-tooltip="" v-if="auth('validateQiTaoOutput:update') || auth('validateQiTaoOutput:delete')">
          <template #default="scope">
            <el-button icon="ele-Edit" size="small" text="" type="primary" @click="openEditValidateQiTaoOutput(scope.row)" v-auth="'validateQiTaoOutput:update'"> 编辑 </el-button>
            <el-button icon="ele-Delete" size="small" text="" type="primary" @click="delValidateQiTaoOutput(scope.row)" v-auth="'validateQiTaoOutput:delete'"> 删除 </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
                v-model:currentPage="tableParamsValidateQiTaoOutput.page"
                v-model:page-size="tableParamsValidateQiTaoOutput.pageSize"
                :total="tableParamsValidateQiTaoOutput.total"
                :page-sizes="[10, 20, 50, 100, 200, 500]"
                small=""
                background=""
                @size-change="handleSizeChangeValidateQiTaoOutput"
                @current-change="handleCurrentChangeValidateQiTaoOutput"
                layout="total, sizes, prev, pager, next, jumper"
    />
      <printDialogValidateQiTaoOutput
        ref="printDialogRefValidateQiTaoOutput"
        :title="printValidateQiTaoOutputTitle"
        @reloadTable="handleQueryValidateQiTaoOutput" />
      <editDialogValidateQiTaoOutput
        ref="editDialogRefValidateQiTaoOutput"
        :title="editValidateQiTaoOutputTitle"
        @reloadTable="handleQueryValidateQiTaoOutput"
      />
    </el-card>
  </div>
</template>
 
<script lang="ts" setup="" name="validateQiTaoOutput">
  import { ref,onMounted } from "vue";
  import { ElMessageBox, ElMessage } from "element-plus";
  import { auth } from '/@/utils/authFunction';
  import { getDictDataItem as di, getDictDataList as dl } from '/@/utils/dict-utils';
  import { formatDate,formatDate_T_Date,formatDate_T_Time,defaultTimeRange } from '/@/utils/formatTime';
  import { exportPageExcel } from '/@/utils/exportPageExcel' //引入导出方法
 
 
  import printDialogValidateQiTaoOutput from '/@/views/system/print/component/hiprint/preview.vue'
  import editDialogValidateQiTaoOutput from '/@/views/main/WmsOrder/validateQiTaoOutput/component/editDialog.vue'
  import { pageValidateQiTaoOutput, deleteValidateQiTaoOutput,importExcelValidateQiTaoOutput,downloadExcelTemplateValidateQiTaoOutput } from '/@/api/main/WmsOrder/validateQiTaoOutput';
    import { getAPI } from '/@/utils/axios-utils';
    import { SysEnumApi } from '/@/api-services/api';
  import commonFunction from '/@/utils/commonFunction';
 
  const getEnumAreaCodeData_Index = ref<any>([]);
  const getEnumUpiStatusData_Index = ref<any>([]);
 
    const { getEnumDesc } = commonFunction();
  
  /***************************************************[包数据操作]开始***************************************************/
  const showAdvanceQueryUIValidateQiTaoOutput = ref(false);
  const tableRefValidateQiTaoOutput = ref(null);
  const printDialogRefValidateQiTaoOutput = ref();
  const editDialogRefValidateQiTaoOutput = ref();
  const loadingValidateQiTaoOutput = ref(false);
  const disabled_btnValidateQiTaoOutput = ref(false);
  const tableDataValidateQiTaoOutput = ref<any>([]);
  const queryParamsValidateQiTaoOutput = ref<any>({});
  const tableParamsValidateQiTaoOutput = ref({
    page: 1,
    pageSize: 10,
    total: 0,
  });
 
  const printValidateQiTaoOutputTitle = ref("");
  const editValidateQiTaoOutputTitle = ref("");
 
  // 改变高级查询的控件显示状态
  const changeAdvanceQueryUIValidateQiTaoOutput = () => {
    showAdvanceQueryUIValidateQiTaoOutput.value = !showAdvanceQueryUIValidateQiTaoOutput.value;
  }
 
  // 查询包数据
  const handleQueryValidateQiTaoOutput = async () => {
    loadingValidateQiTaoOutput.value = true;
    disabled_btnValidateQiTaoOutput.value = true;
    var res = await pageValidateQiTaoOutput(Object.assign(queryParamsValidateQiTaoOutput.value, tableParamsValidateQiTaoOutput.value));
    if(res.data.type=="success"){
      tableDataValidateQiTaoOutput.value = res.data.result?.items ?? [];
      tableParamsValidateQiTaoOutput.value.total = res.data.result?.total;
    }
    loadingValidateQiTaoOutput.value = false;
    disabled_btnValidateQiTaoOutput.value = false;
  };
 
  // 重置包数据查询
  const resetValidateQiTaoOutput = async () => {
    queryParamsValidateQiTaoOutput.value = {}
  };
 
  // 包数据列排序
  const sortChangeValidateQiTaoOutput = async (column: any) => {
    queryParamsValidateQiTaoOutput.value.field = column.prop;
    queryParamsValidateQiTaoOutput.value.order = column.order;
    await handleQueryValidateQiTaoOutput();
  };
 
  // 打开新增包数据页面
  const openAddValidateQiTaoOutput = () => {
    editValidateQiTaoOutputTitle.value = '添加包数据';
    editDialogRefValidateQiTaoOutput.value.openDialog(1,{});
  };
 
  // 打开打印包数据页面
  const openPrintValidateQiTaoOutput = async (row: any) => {
    printValidateQiTaoOutputTitle.value = '打印包数据';
  }
  
  // 打开编辑包数据页面
  const openEditValidateQiTaoOutput = (row: any) => {
    editValidateQiTaoOutputTitle.value = '编辑包数据';
    editDialogRefValidateQiTaoOutput.value.openDialog(2,row);
  };
 
  // 删除包数据
  const delValidateQiTaoOutput = (row: any) => {
    ElMessageBox.confirm(`确定要删除吗?`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
  .then(async () => {
    loadingValidateQiTaoOutput.value = true;
    var ret = await deleteValidateQiTaoOutput(row);
    if(ret.data.type=="success"){
        ElMessage.success("删除成功");
    }
    loadingValidateQiTaoOutput.value = false;
    handleQueryValidateQiTaoOutput();
  })
  .catch(() => {});
  };
 
  // 改变包数据页面容量
  const handleSizeChangeValidateQiTaoOutput = (val: number) => {
    tableParamsValidateQiTaoOutput.value.pageSize = val;
    handleQueryValidateQiTaoOutput();
  };
 
  // 改变包数据页码序号
  const handleCurrentChangeValidateQiTaoOutput = (val: number) => {
    tableParamsValidateQiTaoOutput.value.page = val;
    handleQueryValidateQiTaoOutput();
  };
 
/***************************************************[包数据操作]结束***************************************************/
/***************************************************[包数据导出]开始***************************************************/
//定义当前页面的方法组
const functionMapValidateQiTaoOutput = {
      getEnumAreaCodeData_Index,
      getEnumUpiStatusData_Index,
      formatDate_T_Date,
      formatDate_T_Time
};
//点击导出按钮
const handleExportExcelValidateQiTaoOutput = async (formData:Blob) => {
    loadingValidateQiTaoOutput.value = true;
    disabled_btnValidateQiTaoOutput.value = true;
    var new_tableParamsValidateQiTaoOutput=JSON.parse(JSON.stringify(tableParamsValidateQiTaoOutput.value));
    new_tableParamsValidateQiTaoOutput.page = 1;
    new_tableParamsValidateQiTaoOutput.pageSize = 100000;
    var res = await pageValidateQiTaoOutput(Object.assign(queryParamsValidateQiTaoOutput.value, new_tableParamsValidateQiTaoOutput));
    if(res.data.type=="success"){
      exportExcelValidateQiTaoOutput(res.data.result?.items ?? []);
    }
    loadingValidateQiTaoOutput.value = false;
    disabled_btnValidateQiTaoOutput.value = false;
};
//导出
const exportExcelValidateQiTaoOutput  = async (exportDataList:Array) => {
  exportPageExcel(exportDataList, tableRefValidateQiTaoOutput,"包数据",functionMapValidateQiTaoOutput);
};
/***************************************************[包数据导出]结束***************************************************/
  // 包数据页面加载时
  onMounted(async () => {
    getEnumAreaCodeData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('AreaCodeEnum')).data.result ?? [];
    getEnumUpiStatusData_Index.value = (await getAPI(SysEnumApi).apiSysEnumEnumDataListGet('UpiStatusEnum')).data.result ?? [];
  });
 
  handleQueryValidateQiTaoOutput();
</script>
<style scoped>
:deep(.el-input),
:deep(.el-select),
:deep(.el-input-number) {
    width: 100%;
}
</style>