2026-06-14 12:22
setTableData(data, { type, index, id }) {
console.log(data, '合并后的数据')
const countMap = new Map();
data.forEach(item => {
const material_name = item.materialName;
countMap.set(material_name, (countMap.get(material_name) || 0) + 1);
});
const materialNames = new Set();
data.forEach(item => {
const material_name = item.materialName;
if (!materialNames.has(material_name)) {
item.count = countMap.get(material_name);
materialNames.add(material_name);
}
});
return data
},
这里的data数据是从哪里来的
2026-06-08 14:22
viewWorkflowCardBtn(row) {
return new Promise(async (resolve) => {
try {
const res = await useFun.requestApi('get', '/mes/production-plan/get-flow-card-code', {
params: {
id: row.id
}
})
const prosessInfo = await useFun.requestApi('get', '/mes/production-scheduling-plan/get-routing-card-process-list', {
params: {
scheduleId: row.id
}
})
prosessInfo.forEach((item, index) => {
item.index = '工序' + index
item.id = index
if (!item.isQuality) {
item.isQuality = 0
}
})
callPrint(defaultData);
//初始化控件
// useFun.controlInit('FormView', 'formView_53467', {
// handleType: 'returnData', //处理类型 default | returnData
// showType: 'dialog', //弹窗类型 dialog | drawer
// formId: '2041784700191748098', //表单设计id
// formType: 'view', //表单类型 add | edit | view
// showButton: true, //是否显示底部默认操作按钮
// dataOption: { //数据配置
// tableId: '', //表单开发id
// dataId: '' //数据id
// },
// defaultData: {
// qrCode: res,
// ...row,
// prosessInfo: prosessInfo
// }, //默认表单数据
// enhanceData: {
// }, //传递给表单js增强内部调用配置
// popOption: { //弹窗配置
// title: '查看流转卡', //标题
// width: '90%', //弹窗宽度
// fullscreen: false, //是否全屏
// footerBtnAlign: 'right', //底部按钮对齐方式
// footerBtn: [ //底部按钮配置
// {
// params: {}, //el-button 其他参数
// name: '打印', //按钮名称
// display: true, //是否显示
// loading: false, //点击时是否有loading
// icon: '', //图标
// clickFun: (loading) => {
// //点击事件
// setTimeout(() => {
// const formDom = document.querySelector('.low-form__2041784700191748098')
// crudRef.value.$Print(formDom)
// }, 1000)
// }
// }
// ],
// headerBtn: [], //顶部按钮配置（配置同上）
// dialogParams: {} //弹窗其他配置
// },
// // beforeClose: (type, done, formData, loading) => {
// // // type:关闭类型 submit:提交后触发 close:直接关闭弹窗触发
// // // done:关闭弹窗方法 formData:表单数据 loading:关闭loading方法
// // if (type == 'submit') {
// // setTimeout(() => {
// // const formDom = document.querySelector('.low-form__2041784700191748098')
// // avueFormRef.value.$Print(formDom)
// // },1000)
// // }
// // }
// })
//控件调用
const { formView_53467 } = Vue.toRefs(rendControlData.value)
const controlData = formView_53467.value.params //FormView的配置
formView_53467.value.show = true //显示FormView
// 等待控件初始化完成
} catch (error) {
}
})
},
getPrintTestHtlm = (printData) => {
return `<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>${printData.title}</title>
<style>
* {
box-sizing: border-box;
}
body {
margin: 0;
padding: 24px;
font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
font-size: 14px;
line-height: 1.6;
color: #303133;
background: #f5f7fa;
}
.page {
max-width: 800px;
margin: 0 auto;
padding: 40px;
background: #fff;
border-radius: 8px;
box-shadow: 0 2px 12px rgb(0 0 0 / 8%);
}
.header {
padding-bottom: 16px;
margin-bottom: 24px;
border-bottom: 2px solid #409eff;
}
.header h1 {
margin: 0 0 8px;
font-size: 24px;
color: #303133;
}
.header .meta {
font-size: 13px;
color: #909399;
}
.section {
margin-bottom: 24px;
}
.section h2 {
margin: 0 0 12px;
font-size: 16px;
color: #409eff;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 8px;
}
th,
td {
padding: 10px 12px;
text-align: left;
border: 1px solid #dcdfe6;
}
th {
font-weight: 600;
color: #606266;
background: #f4f4f5;
}
tr:nth-child(even) td {
background: #fafafa;
}
.tag {
display: inline-block;
padding: 2px 8px;
margin-right: 6px;
font-size: 12px;
color: #409eff;
background: #ecf5ff;
border-radius: 4px;
}
.highlight {
padding: 12px 16px;
margin-top: 8px;
background: #fdf6ec;
border-left: 4px solid #e6a23c;
border-radius: 0 4px 4px 0;
}
.footer {
margin-top: 32px;
padding-top: 16px;
font-size: 12px;
color: #909399;
text-align: center;
border-top: 1px dashed #dcdfe6;
}
/* 仅屏幕显示，打印时隐藏 */
.no-print {
position: fixed;
right: 24px;
bottom: 24px;
z-index: 999;
}
.no-print button {
padding: 10px 24px;
font-size: 14px;
color: #fff;
cursor: pointer;
background: #409eff;
border: none;
border-radius: 6px;
box-shadow: 0 2px 8px rgb(64 158 255 / 40%);
}
.no-print button:hover {
background: #66b1ff;
}
/* 打印专用样式 */
@media print {
body {
padding: 0;
background: #fff;
}
.page {
max-width: none;
padding: 0;
border-radius: 0;
box-shadow: none;
}
.no-print {
display: none !important;
}
table,
tr,
img {
page-break-inside: avoid;
}
.page-break {
page-break-after: always;
}
@page {
size: A4;
margin: 20mm;
}
}
</style>
</head>
<body>
<div class="page">
<header class="header">
<h1>打印测试文档</h1>
<div class="meta">生成时间：<span id="printTime"></span> · 用途：验证 HTML 打印效果</div>
</header>
<section class="section">
<h2>一、基本信息</h2>
<p>这是一份用于测试浏览器打印功能的 HTML 页面，可直接双击打开，按 <strong>Ctrl + P</strong> 打印或另存为 PDF。</p>
<p>
<span class="tag">文本</span>
<span class="tag">表格</span>
<span class="tag">样式</span>
<span class="tag">分页</span>
</p>
</section>
<section class="section">
<h2>二、数据表格</h2>
<table>
<thead>
<tr>
<th>序号</th>
<th>名称</th>
<th>类型</th>
<th>状态</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>开始节点</td>
<td>输入变量</td>
<td>正常</td>
</tr>
<tr>
<td>2</td>
<td>结束节点</td>
<td>返回文本</td>
<td>正常</td>
</tr>
<tr>
<td>3</td>
<td>测试变量</td>
<td>字符串</td>
<td>正常</td>
</tr>
</tbody>
</table>
</section>
<section class="section">
<h2>三、提示说明</h2>
<div class="highlight">
打印时在对话框中勾选「<strong>背景图形</strong>」，可保留表格底色和标签样式。
</div>
</section>
<footer class="footer">
JeeLowCode 打印测试 · 第 1 页
</footer>
</div>
<div class="no-print">
<button type="button" onclick="window.print()">点击打印</button>
</div>
<script>
document.getElementById('printTime').textContent = new Date().toLocaleString('zh-CN');
</script>
</body>
</html>
`
},
callPrint = (printData) => {
const html = getPrintTestHtlm(printData)
const iframe = document.createElement('iframe')
iframe.style.cssText = 'position:fixed;width:0;height:0;border:0;'
document.body.appendChild(iframe)
const doc = iframe.contentWindow.document
doc.open()
doc.write(html)
doc.close()
iframe.onload = () => {
iframe.contentWindow.focus()
iframe.contentWindow.print()
setTimeout(() => document.body.removeChild(iframe), 1000)
}
},
是这样写的吗
