rev: acs项目搭建

This commit is contained in:
2025-06-11 19:14:11 +08:00
parent 01198ffecc
commit 262c39cdd0
6 changed files with 0 additions and 2403 deletions

View File

@@ -1,117 +0,0 @@
<template>
<el-dialog
title="导入Excel文件"
append-to-body
:visible.sync="dialogVisible"
destroy-on-close
width="400px"
:show-close="true"
@close="close"
@open="open"
>
<el-upload
ref="upload"
class="upload-demo"
action=""
drag
:on-exceed="is_one"
:limit="1"
:auto-upload="false"
:multiple="false"
:show-file-list="true"
:on-change="uploadByJsqd"
:file-list="fileList"
accept=".xlsx,.xls"
>
<i class="el-icon-upload" />
<div class="el-upload__text">
将文件拖到此处
<em>点击上传</em>
</div>
<div slot="tip" class="el-upload__tip">只能上传Excel文件且不超过10MB</div>
</el-upload>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" @click="submit"> </el-button>
</span>
</el-dialog>
</template>
<script>
import mdBaseMaterial from '@/api/acs/order/mdBaseMaterial'
import CRUD, { crud } from '@crud/crud'
export default {
name: 'UploadDialog',
mixins: [crud()],
components: {},
props: {
dialogShow: {
type: Boolean,
default: false
},
openParam: {
type: String
}
},
data() {
return {
dialogVisible: false,
fileList: [],
file1: ''
}
},
watch: {
dialogShow: {
handler(newValue, oldValue) {
this.dialogVisible = newValue
}
},
openParam: {
handler(newValue, oldValue) {
this.opendtlParam = newValue
}
}
},
methods: {
open() {
},
close() {
this.$emit('update:dialogShow', false)
},
is_one() {
this.crud.notify('只能上传一个excel文件', CRUD.NOTIFICATION_TYPE.WARNING)
},
// 文件校验方法
beforeAvatarUpload(file) {
// 不能导入大小超过2Mb的文件
if (file.size > 10 * 1024 * 1024) {
return false
}
return true
},
// 文件发生改变就会触发的事件
uploadByJsqd(file) {
this.file1 = file
},
submit() {
if (this.beforeAvatarUpload(this.file1)) {
this.fileList.name = this.file1.name
this.fileList.url = ''
var formdata = new FormData()
formdata.append('file', this.file1.raw)
console.log(this.file1.raw)
// excelImport请求接口 formdata传递参数
mdBaseMaterial.excelImport(formdata).then((res) => {
this.crud.notify('导入成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.$emit('tableChanged3', '')
this.$emit('update:dialogShow', false)
})
} else {
this.crud.notify('文件过大请上传小于10MB的文件〜', CRUD.NOTIFICATION_TYPE.WARNING)
}
}
}
}
</script>

View File

@@ -1,191 +0,0 @@
<template>
<div class="app-container">
<div id="app" class="head-container">
<!-- <button @click="seeTemp">预览 </button> -->
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-form
:inline="true"
class="demo-form-inline"
label-position="right"
label-suffix=":"
>
<el-form-item label="模板名称">
<el-input
v-model="query.template_name"
size="small"
placeholder="模板名称"
class="filter-item"
style="width: 200px"
@change="crud.toQuery"
/>
</el-form-item>
<rrOperation />
</el-form>
</div>
<crudOperation :permission="permission">
<!-- <el-button
slot="left"
v-permission="['admin','task:add']"
class="filter-item"
size="mini"
type="primary"
icon="el-icon-plus"
@click="formDia=true"
>
{{ $t('auto.common.Create') }}
</el-button> -->
</crudOperation>
<div v-if="isModalVisible" class="modal" :style="{ width: modalWidth + 'px', height: modalHeight + 'px' }">
<button class="close-button" @click="hideModal">关闭</button>
<div v-for="element in printElements" :key="element.options.left + element.options.top" class="modal-content" :style="{position: 'absolute',left: element.options.left + 'px',top: element.options.top + 'px'}">
<div v-if="element.printElementType.type === 'table'">
<table border="1" :style="{width: element.options.width + 'px',height: element.options.height + 'px'}">
<thead>
<tr v-for="(row, rowIndex) in element.options.columns" :key="rowIndex">
<th v-for="(col) in row" :key="col.field" :style="{ width: col.width + 'px' }">{{ col.title }}</th>
</tr>
</thead>
<tbody>
<!-- 这里填充表格内容 -->
</tbody>
</table>
</div>
<div v-else-if="element.printElementType.type === 'barcode'" :style="{ position: 'absolute', left: element.options.left + 'px', top: element.options.top + 'px' }">
<barcode :value="element.options.testData" :type="element.options.barcodeType" color="#000000" />
</div>
<div v-else-if="element.printElementType.type === 'qrcode'" :style="{ position: 'absolute', left: element.options.left + 'px', top: element.options.top + 'px' }">
<qrcode-vue :value="element.options.testData" :size="80" :color="{ dark: '#000000', light: '#ffffff' }" />
</div>
<div v-else-if="element.printElementType.type === 'text'">
<div v-if="element.options.title" :style="{ color: '#000000', display: 'inline' }">{{ element.options.title }}</div>
<div v-else>没有文本数据可显示</div>
</div>
<div v-else-if="element.printElementType.type === 'image'" :style="{ position: 'absolute', left: element.options.left + 'px', top: element.options.top + 'px' }">
<img :src="element.options.src" alt="Image" :width="element.options.width" :height="element.options.height">
</div>
<div v-else-if="element.printElementType.type === 'longText'">
<div v-if="element.options.title" :style="{ color: '#000000' }">{{ element.options.title }}</div>
<div v-else>没有文本数据可显示</div>
</div>
</div>
</div>
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="50px" />
<el-table-column v-if="false" prop="template_id" label="模板标识" />
<el-table-column prop="template_name" label="模板名称" :min-width="flexWidth('template_name',crud.data,'模板名称')" />
<el-table-column prop="template_status" label="模板状态" width="100px" />
<el-table-column prop="create_by" :label="$t('task.select.Creator')" :min-width="flexWidth('create_by',crud.data,$t('task.select.Creator'))" />
<el-table-column prop="create_time" :label="$t('task.select.Create_time')" :min-width="flexWidth('create_time',crud.data,$t('task.select.Create_time'))" />
<el-table-column v-permission="['admin','task:edit','task:del']" :label="$t('task.select.Operation')" width="80px" align="center" fixed="right">
<template slot-scope="scope">
<!-- <el-button
type="text"
icon="el-icon-edit"
@click="seeTemp(scope.row.template_id)"
>
修改
</el-button> -->
</template>
</el-table-column>
</el-table>
<pagination />
</div>
</div>
</template>
<script>
import Barcode from 'vue-barcode' // 确保安装了 vue-barcode
// import Qrcode from 'vue-qrcode' // 确保安装了 vue-qrcode
import QrcodeVue from 'qrcode.vue' // 确保安装了 vue-qrcode
import template from '@/api/acs/order/template'
import CRUD, { crud, header, presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import rrOperation from '@crud/RR.operation'
import pagination from '@crud/Pagination'
export default {
components: {
'qrcode-vue': QrcodeVue,
Barcode,
crudOperation,
pagination,
rrOperation
},
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({ title: '模板', url: 'api/template', idField: 'template_id', sort: 'create_time,desc',
optShow: {
add: false,
edit: false,
del: true,
reset: false,
download: false
},
crudMethod: { ...template }})
},
data() {
return {
isModalVisible: false, // 控制弹框显示的状态
modalWidth: 1100, // 弹框宽度
modalHeight: 1000, // 弹框高度
printElements: [],
permission: {
add: ['admin', 'task:add'],
edit: ['admin', 'task:edit'],
del: ['admin', 'task:del']
}
}
},
computed: {
typeClass() {
return `type-${this.type}`
}
},
methods: {
seeTemp(id) {
template.see(id).then((data) => {
console.log('====================', data.printElements)
this.printElements = JSON.parse(data.printElements)
console.log(this.printElements)
// 确保 data 对象中的 printElements 是数组
if (Array.isArray(this.printElements)) {
this.isModalVisible = true
} else {
console.error('data.printElements 不是数组')
}
console.log('====================', this.printElements)
}).catch(error => {
console.error('获取数据失败:', error)
})
},
hideModal() {
this.isModalVisible = false // 隐藏弹框
}
}
}
</script>
<style>
/* 添加一些样式来调节页面布局 */
.modal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: white;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
z-index: 1000;
overflow: hidden; /* 处理溢出内容 */
}
.close-button {
position: absolute;
top: 10px;
right: 10px;
}
</style>

View File

@@ -1,890 +0,0 @@
<template>
<!-- <div class="app-container"> -->
<div v-loading.fullscreen.lock="fullscreenLoading" class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle">
<!-- 搜索 -->
<el-form
:inline="true"
class="demo-form-inline"
label-position="right"
label-suffix=":"
>
<rrOperation />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission">
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="!(crud.selections[0]) || crud.selections[1]"
@click="submits(crud.selections[0])"
>
开工
</el-button>
<el-button
slot="right"
class="filter-item"
type="success"
icon="el-icon-position"
size="mini"
:disabled="!(crud.selections[0]) || crud.selections[1]"
@click="finishorder(crud.selections[0])"
>
工单完成
</el-button>
<el-button
slot="left"
v-permission="['admin','task:add']"
class="filter-item"
size="mini"
type="primary"
icon="el-icon-plus"
@click="formDia=true"
>
{{ $t('auto.common.Create') }}
</el-button>
<!-- <el-button
slot="left"
v-permission="['admin','task:edit']"
class="filter-item"
size="mini"
type="primary"
icon="el-icon-plus"
@click="editBtn(scope.row.ticket_id)"
>
{{ $t('auto.common.Update') }}
</el-button> -->
</crudOperation>
<el-dialog :close-on-click-modal="false" :visible.sync="formDia" :title="crud.status.title" width="550px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="110px">
<el-row>
<el-col :span="24">
<div class="grid-content bg-purple" />
<el-form-item label="批次号" prop="batch_number">
<el-input v-model="form.batch_number" style="width: 370px;" @change="isDisabled=false" @focus="getMaterial(1)"/>
</el-form-item>
<el-form-item label="所属客户" prop="customer">
<el-input v-model="form.customer" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="实发型号" prop="production_materials">
<el-input v-model="form.production_materials" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="大型号" prop="large_model">
<el-input v-model="form.large_model" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="小型号" prop="small_model">
<el-input v-model="form.small_model" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="型号" prop="model">
<el-input v-model="form.model" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="批号" prop="batch">
<el-input v-model="form.batch" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="物料编码" prop="material_code">
<el-input v-model="form.material_code" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="物料名称" prop="material_number">
<el-input v-model="form.material_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="计划数量" prop="planned_quantity">
<el-input v-model="form.planned_quantity" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="瓶盖号(选填)" prop="bottle_number">
<el-input v-model="form.bottle_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="纸箱号(选填)" prop="carton_number">
<el-input v-model="form.carton_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="每罐重量kg" prop="bottle_weight">
<el-input v-model="form.bottle_weight" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="送货单(选填)" prop="shdnumber">
<el-input v-model="form.shdnumber" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="瓶盖关联标签模板" prop="bottle_board">
<el-select
v-model="form.bottle_board"
filterable
placeholder="请选择"
style="width: 370px;"
>
<el-option
v-for="item in templateList"
:key="item.template_name"
:label="item.template_name"
:value="item.template_name"
>
<span style="float: left">{{ item.template_name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.bottle_board }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="纸箱关联标签模板" prop="carton_board">
<el-select
v-model="form.carton_board"
filterable
placeholder="请选择"
style="width: 370px;"
>
<el-option
v-for="item in templateList1"
:key="item.template_name"
:label="item.template_name"
:value="item.template_name"
>
<span style="float: left">{{ item.template_name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.carton_board }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="纸箱装瓶数量" prop="carton_qty">
<el-input v-model="form.carton_qty" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="是否加冰" prop="is_ice">
<el-radio-group v-model="form.is_ice" style="width: 240px">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="formDia=false">{{ $t('task.select.Cancel') }}</el-button>
<el-button :loading="crud.cu === 2" :disabled="isDisabled" type="primary" @click="saveBtn">{{ $t('task.select.Confirm') }}</el-button>
</div>
</el-dialog>
<el-dialog :close-on-click-modal="false" :visible.sync="formDias" :title="crud.status.title" width="550px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="110px">
<el-row>
<el-col :span="24">
<div class="grid-content bg-purple" />
<el-form-item label="批次号" prop="batch_number">
<el-input v-model="form.batch_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="所属客户" prop="customer">
<el-input v-model="form.customer" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="实发型号" prop="production_materials">
<el-input v-model="form.production_materials" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="大型号" prop="large_model">
<el-input v-model="form.large_model" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="小型号" prop="small_model">
<el-input v-model="form.small_model" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="瓶盖完成数量" prop="fbottle_number">
<el-input v-model="form.fbottle_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="纸箱完成数量" prop="fcarton_number">
<el-input v-model="form.fcarton_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="计划数量" prop="planned_quantity">
<el-input v-model="form.planned_quantity" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="瓶盖号(选填)" prop="bottle_number">
<el-input v-model="form.bottle_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="纸箱号(选填)" prop="carton_number">
<el-input v-model="form.carton_number" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="晶科每罐重量kg(选填)" prop="bottle_weight">
<el-input v-model="form.bottle_weight" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="送货单(选填)" prop="shdnumber">
<el-input v-model="form.shdnumber" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="瓶盖关联标签模板" prop="bottle_board">
<el-select
v-model="form.bottle_board"
filterable
placeholder="请选择"
style="width: 370px;"
>
<el-option
v-for="item in templateList"
:key="item.template_name"
:label="item.template_name"
:value="item.template_name"
>
<span style="float: left">{{ item.template_name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.bottle_board }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="纸箱关联标签模板" prop="carton_board">
<el-select
v-model="form.carton_board"
filterable
placeholder="请选择"
style="width: 370px;"
>
<el-option
v-for="item in templateList1"
:key="item.template_name"
:label="item.template_name"
:value="item.template_name"
>
<span style="float: left">{{ item.template_name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.carton_board }}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="纸箱装瓶数量" prop="carton_qty">
<el-input v-model="form.carton_qty" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="是否加冰" prop="is_ice">
<el-radio-group v-model="form.is_ice" style="width: 240px">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<!-- <el-button type="text" @click="formDias=true">{{ $t('task.select.Cancel') }}</el-button> -->
<el-button :loading="crud.cu === 2" type="primary" @click="editBtn">{{ $t('task.select.Confirm') }}</el-button>
</div>
</el-dialog>
<!--表单组件-->
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="50px" />
<el-table-column v-if="false" prop="ticket_id" label="工单标识" />
<el-table-column prop="batch_number" label="批次号" :min-width="flexWidth('batch_number',crud.data,'批次号')" />
<el-table-column prop="production_materials" label="实发型号" :min-width="flexWidth('production_materials',crud.data,'实发型号')" />
<el-table-column prop="large_model" label="大型号" :min-width="flexWidth('large_model',crud.data,'大型号')" />
<el-table-column prop="small_model" label="小型号" :min-width="flexWidth('small_model',crud.data,'小型号')" />
<el-table-column prop="fbottle_number" label="瓶盖完成数量" :min-width="flexWidth('fbottle_number',crud.data,'瓶盖完成数量')" />
<el-table-column prop="fcarton_number" label="纸箱完成数量" :min-width="flexWidth('fcarton_number',crud.data,'纸箱完成数量')" />
<el-table-column prop="bottle_number" label="瓶盖号" :min-width="flexWidth('bottle_number',crud.data,'瓶盖号')" />
<el-table-column prop="carton_number" label="纸箱号" :min-width="flexWidth('carton_number',crud.data,'纸箱号')" />
<el-table-column prop="bottle_board" label="瓶盖关联标签模板" :min-width="flexWidth('bottle_board',crud.data,'瓶盖关联标签模板')" />
<el-table-column prop="carton_board" label="纸箱关联标签模板" :min-width="flexWidth('carton_board',crud.data,'纸箱关联标签模板')" />
<el-table-column prop="carton_qty" label="纸箱装瓶数量" :min-width="flexWidth('carton_qty',crud.data,'纸箱装瓶数量')" />
<el-table-column prop="ticket_status" label="状态" width="80px">
<template slot-scope="scope">
{{ getAgvSystemLabel(scope.row.ticket_status) }}
</template>
</el-table-column>
<el-table-column prop="planned_quantity" label="计划数量" width="150px" />
<el-table-column prop="start_time" label="计划开始时间" :min-width="flexWidth('start_time',crud.data,'计划开始时间')" />
<el-table-column prop="end_time" label="计划结束时间" :min-width="flexWidth('end_time',crud.data,'计划结束时间')" />
<el-table-column prop="finish_qty" label="实际完成数量" :min-width="flexWidth('finish_qty',crud.data,'实际完成数量')" />
<el-table-column prop="actual_start_time" label="实际开始时间" :min-width="flexWidth('actual_start_time',crud.data,'实际开始时间')" />
<el-table-column prop="actual_end_time" label="实际结束时间" :min-width="flexWidth('actual_end_time',crud.data,'实际结束时间')" />
<el-table-column prop="customer" label="所属客户" width="80px" />
<el-table-column
prop="is_ice"
label="是否加冰"
:min-width="flexWidth('is_needmove',crud.data,'是否加冰')"
>
<template slot-scope="scope">
{{ scope.row.is_ice ? '是' : '否' }}
</template>
</el-table-column>
<el-table-column prop="create_by" :label="$t('task.select.Creator')" :min-width="flexWidth('create_by',crud.data,$t('task.select.Creator'))" />
<el-table-column prop="create_time" :label="$t('task.select.Create_time')" :min-width="flexWidth('create_time',crud.data,$t('task.select.Create_time'))" />
<el-table-column v-permission="['admin','task:edit','task:del']" :label="$t('task.select.Operation')" width="80px" align="center" fixed="right">
<template slot-scope="scope">
<el-button
type="text"
icon="el-icon-edit"
v-permission="['admin']"
@click="queryBtn(scope.row)"
>
修改
</el-button>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
<MaterialDialog :dialog-show.sync="materialDialog" :flag="flag" @tableChanged="tableChanged"/>
</div>
</template>
<script>
import crudTask from '@/api/acs/order/order'
import {submits} from '@/api/acs/order/order'
import {finishorder} from '@/api/acs/order/order'
// import CRUD, { crud, header, presenter } from '@crud/crud'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
import rrOperation from '@crud/RR.operation'
import pagination from '@crud/Pagination'
import deviceCrud from '@/api/acs/device/device'
import routeCurd from '@/api/acs/route/routePlan'
import { getDicts } from '@/views/system/dict/dict'
import MaterialDialog from '@/views/acs/order/MaterialDialog.vue'
import template from '@/api/acs/order/template'
export default {
name: 'Tickets',
components: { MaterialDialog,pagination, crudOperation, rrOperation },
dicts: ['task_status', 'task_type', 'agv_system_type', 'storage_task_type', 'kezhuan', 'empty_shaft_position', 'operate'],
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({ title: '工单', url: 'api/tickets', idField: 'ticket_code', sort: 'ticket_code,desc',
optShow: {
add: false,
edit: false,
del: false,
reset: false,
download: true
},
crudMethod: { ...crudTask }})
},
data() {
return {
formDia: false,
formDias: false,
isDisabled: false,
deviceList: [],
empty_shaft_position: [],
materialList: [],
statusList: [],
routeList: [],
flag: 1,
materialDialog: false,
fullscreenLoading: false,
agvActionList: [
{ key: '普通任务', value: 1 },
{ key: '取货二次分配', value: 2 },
{ key: '防货二次分配', value: 3 },
{ key: '取放货二次分配', value: 4 }
],
task_type: [],
fromYList: [],
fromZList: [],
toYList: [],
toZList: [],
operate: [],
templateList: [],
templateList1: [],
start_flag: false,
end_flag: false,
permission: {
add: ['admin', 'task:add'],
edit: ['admin', 'task:edit'],
del: ['admin', 'task:del']
},
showAddRowButton: true,
input1: '',
input2: '',
input3: '',
input4: '',
form: {
ticket_id: null,
batch_number: null,
bottle_weight: null,
shdnumber: null,
device_code: null,
production_orders: null,
production_materials: null,
planned_quantity: null,
bottle_number: null,
templateList: [],
templateList1: [],
carton_number: null,
carton_form: null,
carton_qty: null,
start_time: null,
end_time: null,
labeling_qty: null,
labeling_message: null,
customer: null,
is_ice: null,
is_labeling: null,
weight_ok: null,
model: null,
batch: null,
material_code: null,
material_name: null,
ticket_status: null
},
form1: {
ticket_id: null,
batch_number: null,
bottle_weight: null,
shdnumber: null,
device_code: null,
production_orders: null,
production_materials: null,
planned_quantity: null,
bottle_number: null,
carton_number: null,
carton_form: null,
carton_qty: null,
start_time: null,
end_time: null,
labeling_qty: null,
labeling_message: null,
customer: null,
is_ice: null,
is_labeling: null,
weight_ok: null,
model: null,
batch: null,
material_code: null,
material_name: null,
ticket_status: null
},
originalForm: {},
loading: false,
isFormChanged: false,
taskStatus: {
task_status: '',
task_id: null
},
extension: [{
name: '',
value: ''
}],
dialogVisible: false,
rules: {
// production_orders: [
// { required: true, message: '生产数量不能为空', trigger: 'blur' }
// ],
// production_materials: [
// { required: true, message: '实发型号不能为空', trigger: 'blur' }
// ],
// planned_quantity: [
// { required: true, message: '计划数量不能为空', trigger: 'blur' }
// ],
// bottle_number: [
// { required: true, message: '瓶身号不能为空', trigger: 'blur' }
// ],
// carton_number: [
// { required: true, message: '纸箱号不能为空', trigger: 'blur' }
// ],
// carton_qty: [
// { required: true, message: '纸箱装瓶数量不能为空', trigger: 'blur' }
// ],
// labeling_qty: [
// { required: true, message: '贴标数量不能为空', trigger: 'blur' }
// ],
// customer: [
// { required: true, message: '所属客户不能为空', trigger: 'blur' }
// ]
}
}
},
computed: {
concatenatedValue1() {
return `${this.input3},${this.input4}`.replace(/,$/, '') // 去除末尾可能的逗号
},
concatenatedValue() {
return `${this.input1},${this.input2}`.replace(/,$/, '') // 去除末尾可能的逗号
}
},
created() {
deviceCrud.selectDeviceList().then(data => {
this.deviceList = data
})
template.getTemplateList().then(data => {
this.templateList = data
})
template.getTemplateList1().then(data => {
this.templateList1 = data
})
routeCurd.selectList().then(data => {
this.routeList = data
})
getDicts().then(data => {
this.dicts = data
})
},
mounted() {
// 备份初始表单数据
this.originalForm = JSON.parse(JSON.stringify(this.form))
},
methods: {
updateIsIce() {
this.form.weight_ok = this.concatenatedValue
},
querytable(){
},
updateIsIce1() {
this.form1.weight_ok = this.concatenatedValue1
},
// getTemplateList() {
// console.log("111");
// template.getTemplateList().then(data => {
// this.templateList = data
// })
// },
// getTemplateList1() {
// template.getTemplateList1().then(data => {
// this.templateList1 = data
// })
// },
getMaterial(flag) {
this.materialDialog = true
this.flag = flag
},
submits(row) {
this.fullscreenLoading = true
submits(row).then(res => {
this.crud.notify('下发成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
}).catch(() => {
this.fullscreenLoading = false
}).finally(() => {
this.fullscreenLoading = false
})
},
finishorder(row) {
finishorder(row).then(res => {
this.crud.notify('完成成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
this.crud.toQuery()
})
},
tableChanged(row, flag) {
if (flag === 1) {
this.form.batch_number=row.batch_number
this.form.customer=row.customer
this.form.production_materials=row.production_materials
this.form.large_model=row.large_model
this.form.small_model=row.small_model
this.form.planned_quantity=row.sum_qty
this.form.bottle_number=row.bottle_number
this.form.carton_number=row.carton_number
this.form.carton_qty=row.carton_qty
this.form.shdnumber=row.shdnumber
this.form.model=row.model
this.form.batch=row.batch
this.form.material_code=row.material_code
this.form.material_number=row.material_number
}
},
handleDateTimeChange() {
console.log('Selected date and time:')
// 处理你的日期时间变更逻辑
},
handleChange(field) {
// 检查字段值是否发生变化
if (this.form1[field] !== this.originalForm[field]) {
this.isFormChanged = true
} else {
this.isFormChanged = false
}
},
getAgvSystemLabel(value) {
const item = this.dict.label.operate[value]
return item
},
addNewRow() {
this.extension.push({
name: '',
value: ''
})
},
deleteField(index) { // 添加字段的时候删除一条数据
if (this.extension.length > 1) {
this.extension.splice(index, 1)
}
},
cancelForm() {
// 清空表单数据
this.extension = [{
name: '',
value: '' }]
this.dialogVisible = false
},
saveForm() {
// 保存表单数据
// 你可以在这里处理保存逻辑,并发送请求保存表单数据
this.form.interactionJson = this.extension.reduce((extension, item) => {
extension[item.name] = item.value
return extension
}, {})
this.dialogVisible = false
},
queryBtn(ticket) {
// 禁用按钮
console.log(ticket)
this.form=ticket
this.isDisabled = true
this.formDias = true
// crudTask.update(this.form).then(res => {
// // 请求完成后启用按钮
// this.isDisabled = false
// this.form = res
// this.crud.toQuery()
// this.formDia = true
// if (this.form1.weight_ok) {
// const parts = this.form1.weight_ok.split(',')
// this.input3 = parts[0] || '' // 如果没有值,则为空字符串
// this.input4 = parts[1] || '' // 如果没有第二个值,则为空字符串
// }
// })
// // 设置定时器,等待一定时间后再次允许请求
// setTimeout(() => {
// this.isDisabled = false // 可根据具体需求进行调整
// }, 1000) // 5000 毫秒,即 5 秒钟
},
saveBtn() {
// 禁用按钮
this.isDisabled = true
crudTask.add(this.form).then(res => {
// 请求完成后启用按钮
this.isDisabled = false
this.crud.toQuery()
this.formDia = false
this.isDisabled = true
this.form = {
ticket_id: null,
device_code: null,
batch_number: null,
bottle_weight: null,
shdnumber: null,
production_orders: null,
production_materials: null,
planned_quantity: null,
bottle_number: null,
carton_number: null,
carton_form: null,
carton_qty: null,
start_time: null,
end_time: null,
labeling_qty: null,
labeling_message: null,
customer: null,
is_ice: null,
is_labeling: null,
templateList: [],
templateList1: [],
weight_ok: null,
ticket_status: null
}
})
this.extension = [{
name: '',
value: '' }]
// 设置定时器,等待一定时间后再次允许请求
setTimeout(() => {
this.isDisabled = false // 可根据具体需求进行调整
}, 1000) // 5000 毫秒,即 5 秒钟
},
editBtn() {
this.isDisabled = true
// if (!this.isFormChanged) {
// // 如果表单没有变化,不进行提交
// return
// }
crudTask.update(this.form).then(res => {
// 请求完成后启用按钮
this.isDisabled = false
this.crud.toQuery()
this.formDias = false
this.isDisabled = true
this.originalForm = JSON.parse(JSON.stringify(this.form))
console.log(JSON.parse(JSON.stringify(this.form)))
this.isFormChanged = false
this.form={}
})
this.extension = [{
name: '',
value: '' }]
// 设置定时器,等待一定时间后再次允许请求
setTimeout(() => {
this.isDisabled = false // 可根据具体需求进行调整
}, 1000) // 5000 毫秒,即 5 秒钟
},
openDialog() {
this.dialogVisible = true
},
closeDialog() {
this.dialogVisible = false
},
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
finish(index, row) {
this.taskStatus.task_id = row.task_id
this.taskStatus.task_status = index
crudTask.finish(this.taskStatus).then(res => {
this.crud.toQuery()
this.crud.notify('完成成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(err => {
console.log(err.response.data.message)
})
},
cancel(index, row) {
crudTask.cancel(row.task_id).then(res => {
this.crud.toQuery()
this.crud.notify('取消成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(err => {
console.log(err.response.data.message)
})
},
createInst(index, row) {
crudTask.createInst(row.task_id).then(res => {
this.crud.toQuery()
this.crud.notify('创建成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(err => {
console.log(err.response.data.message)
})
},
reload() {
crudTask.reload().then(res => {
this.crud.toQuery()
}).catch(err => {
console.log(err.response.data.message)
})
},
beforeHandleCommand(index, row, command) {
return {
'index': index,
'row': row,
'command': command
}
},
handleCommand(index, row, command) {
switch (command) {
case 'a':// 完成
this.finish('2', row)
break
case 'b':// 取消
this.cancel(index, row)
break
case 'c':// 创建指令
this.createInst(index, row)
break
case 'd':// 完成
this.finish('4', row)
break
}
},
showStartStorage(val) {
let obj = {}
obj = this.deviceList.find((item) => {
return item.device_code === val
})
if (obj.device_type === 'storage') {
this.start_flag = true
let storage_obj = {}
deviceCrud.queryStorageExtra(obj.device_code).then(data => {
storage_obj = data
const n1 = storage_obj.minY
const n2 = storage_obj.maxY
const m1 = storage_obj.minZ
const m2 = storage_obj.maxZ
const from_y = []
const from_z = []
for (let i = n1; i <= n2; i++) {
const y = {}
if (i < 10) {
y.id = '0' + i
} else {
y.id = i
}
y.value = i + '列'
from_y.push(y)
}
for (let i = m1; i <= m2; i++) {
const z = {}
if (i < 10) {
z.id = '0' + i
} else {
z.id = i
}
z.value = i + '层'
from_z.push(z)
}
this.fromYList = from_y
this.fromZList = from_z
this.form.from_x = storage_obj.tunnel
})
} else {
this.start_flag = false
this.form.from_x = ''
this.form.from_y = ''
this.form.from_z = ''
}
this.isDisabled = false
},
showEndStorage(val) {
let obj = {}
obj = this.deviceList.find((item) => {
return item.device_code === val
})
if (obj.device_type === 'storage') {
this.end_flag = true
let storage_obj = {}
deviceCrud.queryStorageExtra(obj.device_code).then(data => {
storage_obj = data
const n1 = storage_obj.minY
const n2 = storage_obj.maxY
const m1 = storage_obj.minZ
const m2 = storage_obj.maxZ
const to_y = []
const to_z = []
for (let i = n1; i <= n2; i++) {
const y = {}
if (i < 10) {
y.id = '0' + i
} else {
y.id = i
}
y.value = i + '列'
to_y.push(y)
}
for (let i = m1; i <= m2; i++) {
const z = {}
if (i < 10) {
z.id = '0' + i
} else {
z.id = i
}
z.value = i + '层'
to_z.push(z)
}
this.toYList = to_y
this.toZList = to_z
this.form.to_x = storage_obj.tunnel
})
} else {
this.end_flag = false
this.form.to_x = ''
this.form.to_y = ''
this.form.to_z = ''
}
this.isDisabled = false
}
}
}
</script>
<style scoped>
.el-dropdown-link {
cursor: pointer;
color: #409EFF;
}
.el-icon-arrow-down {
font-size: 12px;
}
.button-container {
display: flex;
justify-content: flex-end;
align-items: flex-end;
}
</style>

View File

@@ -1,376 +0,0 @@
<template>
<div v-loading.fullscreen.lock="fullscreenLoading" class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle">
<el-form
:inline="true"
class="demo-form-inline"
label-position="right"
label-width="90px"
label-suffix=":"
>
<!-- <el-form-item label="模糊搜索">
<el-input
v-model="query.blurry"
clearable
size="mini"
placeholder="编码名称"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item> -->
<el-form-item label="客户">
<el-input
v-model="query.customer"
clearable
size="mini"
placeholder="客户"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="实发型号">
<el-input
v-model="query.production_materials"
clearable
size="mini"
placeholder="实发型号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="实发批次">
<el-input
v-model="query.actual_batch"
clearable
size="mini"
placeholder="实发批次"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="大型号">
<el-input
v-model="query.large_model"
clearable
size="mini"
placeholder="大型号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="小型号">
<el-input
v-model="query.small_model"
clearable
size="mini"
placeholder="小型号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="批次号">
<el-input
v-model="query.batch_number"
clearable
size="mini"
placeholder="批次号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<rrOperation />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission">
<el-button
slot="right"
class="filter-item"
size="mini"
type="warning"
icon="el-icon-download"
:loading="downloadLoading"
@click="doExport"
>导出眉山通威
</el-button>
<el-button
slot="right"
class="filter-item"
size="mini"
type="warning"
icon="el-icon-download"
:loading="downloadLoading"
@click="doExport1"
>导出晶科报表
</el-button>
<el-button
slot="right"
class="filter-item"
size="mini"
type="warning"
icon="el-icon-download"
:loading="downloadLoading"
@click="doExport2"
>导出东磁报表
</el-button>
<el-button
slot="right"
class="filter-item"
type="warning"
icon="el-icon-upload2"
size="mini"
@click="uploadShow = true"
>
导入
</el-button>
</crudOperation>
<!--表单组件-->
<el-dialog
:close-on-click-modal="false"
:before-close="crud.cancelCU"
:visible.sync="crud.status.cu > 0"
:title="crud.status.title"
width="500px"
>
<el-form
ref="form"
:inline="true"
style="border: 1px solid #cfe0df;margin-top: 10px;padding-top: 10px;"
:model="form"
:rules="rules"
size="mini"
label-width="125px"
label-suffix=":"
>
<el-form-item label="客户" prop="customer">
<el-input v-model="form.customer" style="width: 240px;" />
</el-form-item>
<el-form-item label="实发型号" prop="production_materials">
<el-input v-model="form.production_materials" style="width: 240px;" />
</el-form-item>
<el-form-item label="实发批次" prop="actual_batch">
<el-input v-model="form.actual_batch" style="width: 240px;" />
</el-form-item>
<el-form-item label="库存数量" prop="inventory_qty">
<el-input v-model="form.inventory_qty" style="width: 240px;" />
</el-form-item>
<el-form-item label="当天生产" prop="product_qty">
<el-input v-model="form.product_qty" style="width: 240px;" />
</el-form-item>
<el-form-item label="大型号 " prop="large_model">
<el-input v-model="form.large_model" style="width: 240px;" />
</el-form-item>
<el-form-item label="小型号" prop="small_model">
<el-input v-model="form.small_model" style="width: 240px;" />
</el-form-item>
<el-form-item label="批次号" prop="batch_number">
<el-input v-model="form.batch_number" style="width: 240px;" />
</el-form-item>
<el-form-item label="重量/KG" prop="weight">
<el-input v-model="form.weight" style="width: 240px;" />
</el-form-item>
<el-form-item label="备注"prop="remark">
<el-input v-model="form.remark" type="textarea" style="width: 240px;" />
</el-form-item>
<el-form-item label="瓶盖号"prop="bottle_number">
<el-input v-model="form.bottle_number" type="textarea" style="width: 240px;" />
</el-form-item>
<el-form-item label="纸箱号"prop="carton_number">
<el-input v-model="form.carton_number" type="textarea" style="width: 240px;" />
</el-form-item>
<el-form-item label="纸箱装瓶数量"prop="carton_qty">
<el-input v-model="form.carton_qty" type="textarea" style="width: 240px;" />
</el-form-item>
<el-form-item label="总罐数"prop="sum_qty">
<el-input v-model="form.sum_qty" type="textarea" style="width: 240px;" />
</el-form-item>
<el-form-item label="送货单"prop="shdnumber">
<el-input v-model="form.shdnumber" type="textarea" style="width: 240px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="info" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" size="mini" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55" />
<el-table-column prop="customer" label="客户" :min-width="flexWidth('customer',crud.data,'客户')" />
<el-table-column prop="production_materials" label="实发型号" :min-width="flexWidth('production_materials',crud.data,'实发型号')" />
<el-table-column prop="actual_batch" label="实发批次" :min-width="flexWidth('actual_batch',crud.data,'实发批次')" />
<el-table-column prop="inventory_qty" label="库存数量" :min-width="flexWidth('inventory_qty',crud.data,'库存数量')" />
<el-table-column prop="product_qty" label="当天生产" :min-width="flexWidth('product_qty',crud.data,'当天生产')" />
<el-table-column prop="large_model" label="大型号 " :min-width="flexWidth('large_model',crud.data,'大型号 ')" />
<el-table-column prop="small_model" label="小型号" :min-width="flexWidth('small_model',crud.data,'小型号')" />
<el-table-column prop="batch_number" label="批次号" :min-width="flexWidth('batch_number',crud.data,'批次号')" />
<el-table-column prop="weight" label="重量/KG" :min-width="flexWidth('weight',crud.data,'重量/KG')" />
<el-table-column prop="remark" label="备注" :min-width="flexWidth('remark',crud.data,'备注')" />
<el-table-column prop="bottle_number" label="瓶盖号" :min-width="flexWidth('bottle_number',crud.data,'瓶盖号')" />
<el-table-column prop="carton_number" label="纸箱号" :min-width="flexWidth('carton_number',crud.data,'纸箱号')" />
<el-table-column prop="sum_qty" label="总罐数" :min-width="flexWidth('sum_qty',crud.data,'总罐数')" />
<el-table-column prop="shdnumber" label="送货单" :min-width="flexWidth('shdnumber',crud.data,'送货单')" />
<el-table-column prop="carton_qty" label="纸箱装瓶数量" :min-width="flexWidth('carton_qty',crud.data,'纸箱装瓶数量')" />
<el-table-column prop="model" label="型号" :min-width="flexWidth('model',crud.data,'型号')" />
<el-table-column prop="batch" label="批号" :min-width="flexWidth('batch',crud.data,'批号')" />
<el-table-column prop="material_code" label="物料编码" :min-width="flexWidth('material_code',crud.data,'物料编码')" />
<el-table-column prop="material_number" label="物料名称" :min-width="flexWidth('material_number',crud.data,'物料名称')" />
<el-table-column prop="is_used" label="是否启用" :min-width="flexWidth('is_used',crud.data,'是否启用')">
<template slot-scope="scope">
{{ scope.row.is_used?'是':'否' }}
</template>
</el-table-column>
<el-table-column prop="is_delete" label="是否删除" :min-width="flexWidth('is_delete',crud.data,'是否删除')">
<template slot-scope="scope">
{{ scope.row.is_delete?'是':'否' }}
</template>
</el-table-column>
<el-table-column prop="create_name" label="创建人" :min-width="flexWidth('create_name',crud.data,'创建人')" />
<el-table-column prop="create_time" label="同步时间" :min-width="flexWidth('create_time',crud.data,'创建时间')" />
<el-table-column prop="update_name" label="修改人" :min-width="flexWidth('update_name',crud.data,'修改人')" />
<el-table-column prop="update_time" label="修改时间" :min-width="flexWidth('update_time',crud.data,'修改时间')" />
<el-table-column v-permission="[]" label="操作" width="120px" align="center" fixed="right">
<template slot-scope="scope">
<udOperation
:data="scope.row"
:permission="permission"
/>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
<UploadDialog :dialog-show.sync="uploadShow" @tableChanged3="tableChanged3" />
</div>
</template>
<script>
import crudMdBaseMaterial from '@/api/acs/order/mdBaseMaterial'
import CRUD, { crud, form, header, presenter } from '@crud/crud'
import UploadDialog from '@/views/acs/order/UploadDialog'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import { downloadFile, parseTime } from '@/utils/index'
import { download, initData } from '@/api/data'
const defaultForm = {
small_model: null,
production_materials: null,
material_id: null,
actual_batch: null,
batch_number: null,
large_model: null,
customer: null,
workshop_code: null,
remark: null,
is_used: true,
is_special: false,
is_delete: false
}
export default {
name: 'MdBaseMaterial',
dicts: ['vehicle_type'],
components: { pagination, crudOperation, rrOperation, udOperation, UploadDialog },
mixins: [presenter(), header(), form(defaultForm), crud()],
cruds() {
return CRUD({
title: '物料基础信息',
url: 'api/mdBaseMaterial',
idField: 'material_id',
sort: 'material_id,desc',
crudMethod: { ...crudMdBaseMaterial }
})
},
data() {
return {
classes1: [],
permission: {
add: ['admin', 'device:add'],
edit: ['admin', 'device:edit'],
del: ['admin', 'device:del']
},
uploadShow: false,
rules: {
large_model: [
{ required: true, message: '大型号不能为空', trigger: 'blur' }
],
small_model: [
{ required: true, message: '小型号不能为空', trigger: 'blur' }
],
customer: [
{ required: true, message: '客户不能为空', trigger: 'blur' }
],
},
downloadLoading: false,
fullscreenLoading: false,
workShopList: []
}
},
// created() {
// this.getWorkShopList()
// },
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
tableChanged3() {
this.crud.toQuery()
},
synchronize() {
this.fullscreenLoading = true
crudMdBaseMaterial.synchronize(this.crud.query).then(res => {
this.fullscreenLoading = false
this.crud.notify('同步成功!', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(() => {
this.fullscreenLoading = false
})
},
doExport() {
this.downloadLoading = true
download('api/mdBaseMaterial' + '/doExport', {}).then(result => {
downloadFile(result, crud.title + '数据', 'xlsx')
this.downloadLoading = false
}).catch(() => {
this.downloadLoading = false
})
},
doExport1() {
this.downloadLoading = true
download('api/mdBaseMaterial' + '/doExport1', {}).then(result => {
downloadFile(result, crud.title + '数据', 'xlsx')
this.downloadLoading = false
}).catch(() => {
this.downloadLoading = false
})
},
doExport2() {
this.downloadLoading = true
download('api/mdBaseMaterial' + '/doExport2', {}).then(result => {
downloadFile(result, crud.title + '数据', 'xlsx')
this.downloadLoading = false
}).catch(() => {
this.downloadLoading = false
})
},
// 获取子节点数据
loadChildNodes({ action, parentNode, callback }) {
// if (action === LOAD_CHILDREN_OPTIONS) {
// crudClassstandard.getClass({ pid: parentNode.id }).then(res => {
// parentNode.children = res.content.map(function(obj) {
// if (obj.hasChildren) {
// obj.children = null
// }
// return obj
// })
// setTimeout(() => {
// callback()
// }, 100)
// })
// }
}
}
}
</script>
<style scoped>
</style>

View File

@@ -1,101 +0,0 @@
<template>
<el-dialog
:title="预览页面"
append-to-body
:visible.sync="previewVisible"
:width="width+'mm'"
@close="close"
@open="open"
>
<el-button type="primary" icon="el-icon-printer" @click="print">打印</el-button>
<el-button type="primary" icon="el-icon-printer" @click="print">PDF</el-button>
<div id="preview_content_design" />
</el-dialog>
</template>
<script>
export default {
name: 'PrintPreview',
props: {
previewShow: {
type: Boolean,
default: false
}
},
data() {
return {
previewVisible: false,
visible: false,
spinning: true,
waitShowPrinter: false,
// 纸张宽 mm
width: 0,
// 模板
hiprintTemplate: {},
// 数据
printData: {}
}
},
watch: {
previewShow: {
handler(newValue, oldValue) {
this.previewVisible = newValue
}
}
},
created() {
},
mounted() {
},
methods: {
close() {
this.$emit('update:previewShow', false)
},
open() {
},
hideModal() {
this.visible = false
},
show(hiprintTemplate, printData, width = '210') {
// debugger
this.visible = true
this.spinning = true
this.width = hiprintTemplate.editingPanel ? hiprintTemplate.editingPanel.width : width
this.hiprintTemplate = hiprintTemplate
this.printData = printData
setTimeout(() => {
// eslint-disable-next-line no-undef
$('#preview_content_design').html(hiprintTemplate.getHtml(printData))
this.spinning = false
}, 500)
},
print() {
this.waitShowPrinter = true
this.hiprintTemplate.print(this.printData, {}, {
callback: () => {
console.log('callback')
this.waitShowPrinter = false
}
})
},
toPdf() {
this.hiprintTemplate.toPdf({}, '打印预览')
}
}
}
</script>
<style lang="less" scoped>
/deep/ .ant-modal-body {
padding: 0px;
}
/deep/ .ant-modal-content {
margin-bottom: 24px;
}
</style>

View File

@@ -1,728 +0,0 @@
<template>
<div class="flex-col">
<div class="flex-row justify-center" style="margin-bottom: 10px">
<div>
<el-radio-group v-model="radio1" @input="setPaper">
<el-radio-button
v-for="(value,type) in paperTypes"
:key="type"
:label="type"
name="name"
/>
</el-radio-group>
<el-popover
placement="right"
width="400"
title="置纸张宽高(mm)"
trigger="click"
>
<el-input-number
v-model="paperWidth"
:controls="false"
:min="1"
:max="10000"
label="描述文字"
@change="otherPaper"
/>
<el-input-number
v-model="paperHeight"
:controls="false"
:min="1"
:max="10000"
label="描述文字"
@change="otherPaper"
/>
<el-button slot="reference">自定义纸张1</el-button>
</el-popover>
<el-select
v-model="templateId"
filterable
placeholder="请选择瓶盖模板"
style="width: 250px;"
@change="getTemplateById"
>
<el-option
v-for="item in templateList"
:key="item.template_name"
:label="item.template_name"
:value="item.template_id"
/>
</el-select>
<el-select
v-model="templateId1"
filterable
placeholder="请选择纸箱模板"
style="width: 250px;"
@change="getTemplateById1"
>
<el-option
v-for="item in templateList1"
:key="item.template_name"
:label="item.template_name"
:value="item.template_id"
/>
</el-select>
<!-- <el-input
v-model="template_number"
style="width: 200px;"
placeholder="请输入需要打印的份数"
/> -->
<!-- <el-select
v-model="ticketId"
filterable
placeholder="请选择模板需要关联的工单"
style="width: 200px;"
@change="getTemplateList"
>
<el-option
v-for="item in ticketList"
:key="item.ticket_code"
:label="item.ticket_code"
:value="item.ticket_code"
/>
</el-select> -->
</div>
<el-button type="primary" icon="el-icon-printer" @click="print"> 浏览器打印</el-button>
<el-button type="primary" icon="el-icon-printer" @click="print2"> 直接打印</el-button>
<el-button type="primary" @click="preview"> 预览</el-button>
<el-button type="primary" @click="PreviewData"> 导出</el-button>
<el-button type="primary" @click="addTable"> 保存</el-button>
<el-button type="primary" @click="clear"> 清空</el-button>
<!-- <button class="warning circle-10 ml-10" @click.stop="print2">
直接打印(需要连接客户端)
<i class="iconfont sv-printer" />
</button> -->
</div>
<el-row :gutter="5">
<el-col :span="4">
<div>
<div class="title" style="font-weight: bold;">基础元素</div>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.text">
<i class="iconfont sv-text" />
<span>文本</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.image">
<i class="iconfont sv-image" />
<span>图片</span>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.longText">
<i class="iconfont sv-longText" />
<span>长文</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.table">
<i class="iconfont sv-table" />
<span>表格</span>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.emptyTable">
<i class="iconfont sv-table" />
<span>空白表格</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.customText">
<i class="iconfont sv-text" />
<span>自定义</span>
</div>
</div>
</el-col>
</el-row>
<div class="title" style="font-weight: bold;">辅助元素</div>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.hline">
<i class="iconfont sv-hline" />
<span>横线</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.vline">
<i class="iconfont sv-vline" />
<span>竖线</span>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.rect">
<i class="iconfont sv-rect" />
<span>矩形</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.oval">
<i class="iconfont sv-oval" />
<span>圆形</span>
</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.barcode">
<i class="iconfont sv-barcode" />
<span>条形码</span>
</div>
</div>
</el-col>
<el-col :span="12">
<div class="grid-content bg-purple">
<div class="ep-draggable-item item" tid="defaultModule.qrcode">
<i class="iconfont sv-qrcode" />
<span>二维码</span>
</div>
</div>
</el-col>
</el-row>
</div>
</el-col>
<el-col :span="16" style="margin-top: 15px;">
<!-- 设计器的 容器 -->
<div id="hiprint-printTemplate" />
</el-col>
<el-col :span="4">
<!-- 元素参数的 容器 -->
<div id="PrintElementOptionSetting" />
</el-col>
</el-row>
<div>
<el-dialog :close-on-click-modal="false" :visible.sync="formDias" title="模板" width="550px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="110px">
<el-row>
<el-col :span="24">
<div class="grid-content bg-purple" />
<el-form-item label="模板名称" prop="template_name">
<el-input v-model="form.template_name" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
<el-form-item label="模板状态" prop="template_status">
<el-input v-model="form.template_status" style="width: 370px;" @change="isDisabled=false" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="formDias=false">{{ $t('task.select.Cancel') }}</el-button>
<el-button :disabled="isDisabled" type="primary" @click="create">{{ $t('task.select.Confirm') }}</el-button>
</div>
</el-dialog>
</div>
<Preview ref="preView" :preview-show.sync="previewShow" />
</div>
</template>
<script>
import $ from 'jquery'
import { hiprint, defaultElementTypeProvider } from 'vue-plugin-hiprint'
import template from '@/api/acs/order/template'
import Preview from '@/views/acs/order/preview.vue'
import uuidv1 from 'uuid/v1'
// 初始化 provider
hiprint.init({
providers: [defaultElementTypeProvider()]
})
export default {
name: 'Hrprint',
components: { Preview },
data() {
return {
template_number:'',
printDataList: [],
previewShow: false,
radio1:null,
ticketList: [],
templateList: [],
templateList1: [],
ticketId: null,
templateId: null,
templateId1: null,
templateLoading: false,
curPaper: {
type: 'A4',
width: 210,
height: 296.6
},
paperTypes: {
'A3': {
width: 420,
height: 296.6
},
'A4': {
width: 210,
height: 296.6
},
'A5': {
width: 210,
height: 147.6
},
'B3': {
width: 500,
height: 352.6
},
'B4': {
width: 250,
height: 352.6
},
'B5': {
width: 250,
height: 175.6
}
},
formDias: false,
hiprintTemplate: null, // 声明 hiprintTemplate 以便在 buildDesigner 中使用
printResults: [],
isDisabled: false,
paperWidth: 220,
paperHeight: 80,
form: {
template_name: '',
template_status: '',
template: Object
},
rules: {
template_name: [
{ required: true, message: '模板名称不能为空', trigger: 'blur' }
]
}
}
},
mounted() {
// 确保 hiprint 初始化完成后再执行构建操作
this.$nextTick(() => {
this.buildLeftElement()
this.buildDesigner()
})
},
created() {
template.getTemplateList().then(data => {
this.templateList = data
})
template.getTicketList().then(data => {
this.ticketList = data
})
template.getTemplateList1().then(data => {
this.templateList1 = data
})
console.log('-----获取到消息1------')
if (typeof (WebSocket) === 'undefined') {
this.$notify({
title: '提示',
message: '当前浏览器无法接收实时打印信息,请使用谷歌浏览器!',
type: 'warning',
duration: 0
})
}
const wsUri = window.g.prod.VUE_APP_BASE_API.replace('http', 'ws') + '/webSocket/sendPrint/' + uuidv1()
this.websock = new WebSocket(wsUri)
this.websock.onmessage = this.webSocketOnMessage
},
methods: {
webSocketOnMessage(e) {
console.log('-----获取到消息------')
console.log("后端传入的值",e.data);
console.info('自动发给打印机的参数', JSON.parse(e.data))
const typeValue =JSON.parse(e.data).type
console.log("后端传入的值e",typeValue);
this.hiprintTemplate.update(JSON.parse(e.data))
if (typeValue === 1) {
let printData1 = {name:'名称2'};
this.hiprintTemplate.print2(this.printData1,{
printer: 'ZDesigner ZT610-300dpi ZPL111',
title: '打印任务名称',
color: false, // 是否打印颜色 默认 true
copies: 1, // 打印份数 默认 1
});
const printerList = this.hiprintTemplate.getPrinterList()
console.info('打印机列表', printerList)
}
if (typeValue === 2){
let printData1 = {name:'名称1'};
this.hiprintTemplate.print2(this.printData1,{
printer: 'ZDesigner ZT610-300dpi ZPL110', // 指定打印机 打印机 名称
title: '打印任务名称',
color: false, // 是否打印颜色 默认 true
copies: 1, // 打印份数 默认 1
});
const printerList = this.hiprintTemplate.getPrinterList()
console.info('打印机列表', printerList)
}
},
addTable() {
this.formDias = true
this.isDisabled = false
},
clear() {
this.hiprintTemplate.clear()
},
preview() {
this.previewShow = true
/* const str = '{ "panels": [{ "index": 0, "height": 30, "width": 50, "paperHeader": 0, "paperFooter": 82.5, "printElements": [{ "options": { "left": 7.5, "top": 9, "height": 15, "width": 127.5, "field": "product", "testData": "加多老吉茶 100889", "hideTitle": true }, "printElementType": { "title": "文本", "type": "text" } }, { "options": { "left": 120, "top": 27, "height": 33, "width": 13.5, "field": "ptype", "testData": "酒水222", "hideTitle": true }, "printElementType": { "title": "文本", "type": "text" } }, { "options": { "left": 7.5, "top": 28.5, "height": 30, "width": 105, "field": "code", "testData": "100889", "textAlign": "center", "textType": "barcode" }, "printElementType": { "title": "文本", "type": "text" } }], "paperNumberLeft": 111, "paperNumberTop": 63, "paperNumberDisabled": true }] }'
const hiprintTemplate = new hiprint.PrintTemplate({
template: JSON.parse(str)
})
hiprintTemplate.design('#hiprint-printTemplate')
const printData = { product: '测试数量', ptype: '测试酒水', code: '100889' }*/
const printData = { dd: '测试数量' }
this.$refs.preView.show(this.hiprintTemplate, printData)
},
/**
* 构建左侧可拖拽元素
* 注意: 可拖拽元素必须在 hiprint.init() 之后调用
* 而且 必须包含 class="ep-draggable-item" 否则无法拖拽进设计器
*/
buildLeftElement() {
// 确保 hiprint 初始化完成后再执行构建操作
if (hiprint && hiprint.PrintElementTypeManager) {
hiprint.PrintElementTypeManager.buildByHtml($('.ep-draggable-item'))
}
},
/**
* 构建设计器
* 注意: 必须要在 hiprint.init() 之后去构建
* 因为都是把元素挂载到对应容器中, 必须要先找到该容器
*/
buildDesigner() {
// 确保 hiprint 初始化完成后再执行构建操作
if (hiprint && hiprint.PrintTemplate) {
$('#hiprint-printTemplate').empty() // 先清空, 避免重复构建
this.hiprintTemplate = new hiprint.PrintTemplate({
settingContainer: '#PrintElementOptionSetting' // 元素参数容器
})
// 构建 并填充到 容器中
this.hiprintTemplate.design('#hiprint-printTemplate')
}
},
// 根据搜索获取模板列表
getTemplateById() {
// if (hiprintTemplate) {
template.see(this.templateId).then(res => {
try {
this.hiprintTemplate.update(JSON.parse(res.template))
} catch (e) {
this.$message.error(`更新失败: ${e}`)
}
})
// }
},
getTemplateById1() {
// if (hiprintTemplate) {
template.see(this.templateId1).then(res => {
try {
this.hiprintTemplate.update(JSON.parse(res.template))
} catch (e) {
this.$message.error(`更新失败: ${e}`)
}
})
// }
},
otherPaper() {
this.hiprintTemplate.setPaper(this.paperWidth, this.paperHeight)
},
/**
* 设置纸张大小
* @param type [A3, A4, A5, B3, B4, B5, other]
* @param value {width,height} mm
*/
setPaper(type) {
try {
if (Object.keys(this.paperTypes).includes(type)) {
// this.curPaper = {type: type, width: value.width, height: value.height}
const value = this.paperTypes[type]
this.hiprintTemplate.setPaper(value.width, value.height)
} else {
this.curPaper = { type: 'other', width: value.width, height: value.height }
this.hiprintTemplate.setPaper(value.width, value.height)
}
} catch (error) {
this.$message.error(`操作失败: ${error}`)
}
},
/**
* 浏览器打印
*/
print() {
// 打印数据key 对应 元素的 字段名
const printData = { name: 'CcSimple' }
// 参数: 打印时设置 左偏移量,上偏移量
const options = { leftOffset: -1, topOffset: -1 }
// 扩展
const ext = {
callback: () => {
console.log('浏览器打印窗口已打开')
},
styleHandler: () => {
// 重写 文本 打印样式
return '<style>.hiprint-printElement-text{color:red !important;}</style>'
}
}
// 调用浏览器打印
if (this.hiprintTemplate) {
console.log('准备打印,参数:', { printData, options, ext })
this.hiprintTemplate.print(printData, options, ext)
}
},
/**
* 自动打印
* 注意: 需要先连接客户端
*/
/**
* 直接打印: 借助客户端,静默打印(无弹窗直接打印)
* 注意: 需要先连接客户端
*/
print2() {
let jsonString=JSON.stringify(this.hiprintTemplate.getJson() || {})
// 1. 解析 JSON 字符串为 JavaScript 对象
let jsonObject = JSON.parse(jsonString);
let testDataValue = parseInt(jsonObject.panels[0].printElements[0].options.testData, 10);
jsonObject.panels[0].printElements[0].options.testData = testDataValue + 1;
jsonObject.panels[0].printElements[0].options.testData = jsonObject.panels[0].printElements[0].options.testData.toString();
// 3. 转换回 JSON 字符串
let updatedJsonString = JSON.stringify(jsonObject);
console.info('发给打印机的参数', updatedJsonString)
this.hiprintTemplate.update(JSON.parse(updatedJsonString))
let printData1 = {name:'名称1'};
this.hiprintTemplate.print2(this.printData1);
// this.hiprintTemplate.print2(printData);
// console.log('打印份数为',this.template_number);
const printerList = this.hiprintTemplate.getPrinterList()
console.info('打印机列表', printerList)
// if (hiprint.hiwebSocket && hiprint.hiwebSocket.opened) {
// // let printData1 = {name:'名称1'};
// // let printData2 = {name:'名称2'};
// const count = Number(this.template_number);
// for (let i = 0; i < count; i++) {
// let i={name:i};
// this.printDataList.push(i);
// }
// if (this.hiprintTemplate) {
// // this.hiprintTemplate.print2([printData1,printData2]);
// this.hiprintTemplate.print2(this.printDataList);
// }
// } else {
// hiprint.hiwebSocket.setHost("http://192.168.81.182:17521")
// alert('请先连接客户端(刷新网页), 然后再点击「直接打印」')
// }
},
PreviewData() {
this.hiprintTemplate.toPdf('', '').then((tempPrintResults) => {
// 处理生成的 PDF 数据
console.log('获取pdf结果::::' + tempPrintResults)
// 创建 Blob 对象
const blob = new Blob([tempPrintResults], { type: 'application/pdf' })
const url = URL.createObjectURL(blob)
// 创建下载链接并设置文件名
const link = document.createElement('a')
link.href = url
link.download = 'your-custom-file-name.pdf' // 设置文件名
document.body.appendChild(link) // 追加到 DOM 中
link.click() // 触发下载
document.body.removeChild(link) // 下载后移除链接
// 清理 URL 对象
URL.revokeObjectURL(url)
}).catch((error) => {
console.error('PDF 生成失败:', error)
})
},
create() {
this.isDisabled = true
// debugger
this.form = {
...this.form, // 保留原有属性
...this.hiprintTemplate.getJson() // 赋值新属性
}
console.log('保存数据', JSON.stringify(this.form))
template.create(JSON.stringify(this.form)).then((data) => {
this.formDias = false
// 设置定时器,等待一定时间后再次允许请求
setTimeout(() => {
this.isDisabled = false // 可根据具体需求进行调整
}, 1000) // 5000 毫秒,即 5 秒钟
})
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/* 字体样式 */
@import "../../../assets/css/iconfont.css";
/* scrollbar */
::-webkit-scrollbar {
height: 4px;
width: 4px;
}
::-webkit-scrollbar-corner {
height: 4px;
width: 4px;
}
/*::-webkit-scrollbar-thumb {
background: purple;
border-radius: 2px;
background-image: -webkit-linear-gradient(
45deg,
rgba(255, 255, 255, 0.2) 25%,
transparent 25%,
transparent 50%,
rgba(255, 255, 255, 0.2) 50%,
rgba(255, 255, 255, 0.2) 75%,
transparent 75%,
transparent
);
}*/
::-webkit-scrollbar-thumb:hover {
background: purple;
}
/* flex */
.flex-row {
display: flex;
}
.flex-col {
display: flex;
-ms-flex-direction: column; /* 旧版 IE */
flex-direction: column;
}
.flex-wrap {
flex-wrap: wrap;
}
.align-center {
align-items: center;
}
.justify-center {
justify-content: center;
}
/* 重写全局 hiprint 样式 */
.hiprint-headerLine,
.hiprint-footerLine {
border-color: purple !important;
}
.hiprint-headerLine:hover,
.hiprint-footerLine:hover {
border-top: 3px dashed purple !important;
}
.hiprint-headerLine:hover:before {
content: "页眉线";
left: calc(50% - 18px);
position: relative;
background: #ffff;
top: -14px;
color: purple;
font-size: 12px;
}
.hiprint-footerLine:hover:before {
content: "页脚线";
left: calc(50% - 18px);
position: relative;
color: purple;
background: #ffff;
top: -14px;
font-size: 12px;
}
/* 左侧拖拽元素样式 */
.title {
font-size: 16px;
font-weight: 500;
width: 100%;
margin: 10px 0 0 24px;
}
.item {
display: flex;
flex-direction: column;
align-items: center;
background: white;
padding: 4px 10px;
margin: 10px 8px 4px 8px;
/*width: 38%;*/
min-height: 60px;
border-radius: 4px;
box-shadow: 2px 2px 2px 2px rgba(171, 171, 171, 0.2);
}
.item .iconfont {
font-size: 1.5rem;
}
.item span {
font-size: 14px;
}
</style>