修改打印

master
夜笙歌 2 days ago
parent e673690245
commit 7d04371607

@ -312,22 +312,21 @@
</template>
<div class="moduleText">数字翻牌器</div>
</el-card>
<!-- <el-card class="moduleCard" shadow="never" :draggable="true"-->
<!-- @dragstart="onDragStart($event, 'table')"-->
<!-- :style="{display:'inline-block',margin:'0 4px 4px 0'}"-->
<!-- :body-style="{padding:'4px 0'}">-->
<!-- <template #header>-->
<!-- <StarFilled />-->
<!-- </template>-->
<!-- <div class="moduleText">普通表格</div>-->
<!-- </el-card>-->
<el-card class="moduleCard" shadow="never" :draggable="true"
@dragstart="onDragStart($event, 'table')"
:style="{display:'inline-block',margin:'0 4px 4px 0'}"
:body-style="{padding:'4px 0'}">
<template #header>
<el-image style="width:50px;height: 50px;text-align: center" :src="scrollTableImg" fit="contain" />
</template>
<div class="moduleText">普通表格</div>
</el-card>
<el-card class="moduleCard" shadow="never" :draggable="true"
@dragstart="onDragStart($event, 'scrollTable')"
:style="{display:'inline-block',margin:'0 4px 4px 0'}"
:body-style="{padding:'4px 0'}">
<template #header>
<div style="width: 100%;height: 100%;text-align: center">
<el-image style="width:50px;height: 50px;text-align: center" :src="scrollTableImg" fit="contain" />
</div>
</template>
@ -345,6 +344,18 @@
</template>
<div class="moduleText">背景</div>
</el-card>
<el-card class="moduleCard" shadow="never" :draggable="true"
@dragstart="onDragStart($event, 'pagination')"
:style="{display:'inline-block',margin:'0 4px 4px 0'}"
:body-style="{padding:'4px 0'}">
<template #header>
<div style="width: 100%;height: 100%;text-align: center">
<el-image style="width:50px;height: 50px;text-align: center" :src="backgroundimg" fit="contain" />
</div>
</template>
<div class="moduleText">分页</div>
</el-card>
</div>
</el-popover>
</div>
@ -552,6 +563,10 @@
<BackgroundNode :inputData=getInputData(backgroundNodeProps.id) v-bind="backgroundNodeProps"
@resize="resize"></BackgroundNode>
</template>
<template #node-pagination="paginationNodeProps">
<PaginationNode :inputData=getInputData(paginationNodeProps.id) v-bind="paginationNodeProps"
@resize="resize"></PaginationNode>
</template>
</VueFlow>
</FlowRuler>
@ -791,6 +806,9 @@
配置表格
</el-button>
</el-form-item>
<el-form-item label="表头是否显示" v-if="Object.keys(nodeAttrForm).includes('isThShow')">
<el-switch v-model="nodeAttrForm.isThShow" />
</el-form-item>
<el-form-item label="表格动画设置" v-if="Object.keys(nodeAttrForm).includes('tableClassOption')">
<el-button class="optionsBtn" plain @click="tableClassOptionsVisible = true">
配置动画
@ -867,6 +885,12 @@
<el-form-item label="输出字段名" v-if="Object.keys(nodeAttrForm).includes('field')">
<el-input v-model="nodeAttrForm.field" />
</el-form-item>
<el-form-item label="每页个数字段" v-if="Object.keys(nodeAttrForm).includes('pageSizeField')">
<el-input v-model="nodeAttrForm.field" />
</el-form-item>
<el-form-item label="当前页字段" v-if="Object.keys(nodeAttrForm).includes('currentPageField')">
<el-input v-model="nodeAttrForm.field" />
</el-form-item>
<el-form-item label="时间戳字段名" v-if="Object.keys(nodeAttrForm).includes('timestampField')">
<el-input v-model="nodeAttrForm.timestampField" />
</el-form-item>
@ -1004,6 +1028,9 @@
<el-form-item label="图例" v-if="Object.keys(nodeAttrForm).includes('legend')">
<el-switch v-model="nodeAttrForm.legend" active-text="" inactive-text="" />
</el-form-item>
<el-form-item label="图例颜色" v-if="Object.keys(nodeAttrForm).includes('legendColor')">
<el-color-picker v-model="nodeAttrForm.legendColor" show-alpha />
</el-form-item>
<el-form-item label="饼图标签" v-if="Object.keys(nodeAttrForm).includes('label')">
<el-switch v-model="nodeAttrForm.label" active-text="" inactive-text="" />
</el-form-item>
@ -1103,12 +1130,18 @@
<el-form-item label="图表颜色" v-if="Object.keys(nodeAttrForm).includes('seriesColor')">
<el-color-picker v-model="nodeAttrForm.seriesColor" show-alpha />
</el-form-item>
<el-form-item label="饼图标签格式" v-if="Object.keys(nodeAttrForm).includes('pieLabelFormatter')">
<el-input v-model="nodeAttrForm.pieLabelFormatter" style="width: 100%" />
</el-form-item>
<el-form-item label="饼图中心位置" v-if="Object.keys(nodeAttrForm).includes('pieCenter')">
<el-slider v-model="nodeAttrForm.pieCenter" :min="0" :max="100" />
</el-form-item>
<el-form-item label="饼图半径" v-if="Object.keys(nodeAttrForm).includes('pieRadius')">
<el-slider v-model="nodeAttrForm.pieRadius" :min="0" :max="100" range />
</el-form-item>
<el-form-item label="js脚本设置">
<el-input type="textarea" v-model="nodeAttrForm.JScript" style="width: 100%" />
</el-form-item>
</el-collapse-item>
</el-collapse>
</el-form>
@ -1152,7 +1185,7 @@
</div>
</template>
</el-dialog>
<el-dialog v-model="tableOptionsVisible" title="表格设置" width="800">
<el-dialog v-model="tableOptionsVisible" title="表格设置" width="950">
<el-table :data="nodeAttrForm.tableOptions">
<el-table-column label="列名称" width="150">
<template #default="scope">
@ -1206,6 +1239,10 @@
label="标签"
value="标签"
/>
<el-option
label="进度条"
value="进度条"
/>
<el-option
label="图片"
value="图片"
@ -1213,6 +1250,11 @@
</el-select>
</template>
</el-table-column>
<el-table-column label="计算公式" width="200">
<template #default="scope">
<el-input v-model="scope.row.formula" style="width: 100%" />
</template>
</el-table-column>
<el-table-column label="操作">
<template #default="scope">
<el-button :icon="Delete" circle @click="nodeAttrForm.tableOptions.splice(scope.$index, 1)" />
@ -1375,6 +1417,7 @@ import ImgNode from '@/views/boardGenerate/nodes/form/imgNode.vue';
import TimelineNode from '@/views/boardGenerate/nodes/form/timelineNode.vue';
import ScrollTableNode from '@/views/boardGenerate/nodes/form/scrollTableNode.vue';
import BackgroundNode from '@/views/boardGenerate/nodes/form/backgroundNode.vue';
import PaginationNode from '@/views/boardGenerate/nodes/form/paginationNode.vue';
import TextNode from '@/views/boardGenerate/nodes/form/textNode.vue';
import CurveNode from '@/views/boardGenerate/nodes/board/curveNode.vue';
@ -1456,7 +1499,6 @@ onMounted(async () => {
} else {
data[key] = null;
}
}
});
return {
@ -1471,7 +1513,7 @@ onMounted(async () => {
y: e.posY
},
type: e.pointType,
draggable: e.fieldTwo,
draggable: e.fieldTwo === 'true',
data: JSON.parse(e.dataContent)
};
}) : [{

@ -292,6 +292,7 @@ const getOption = () => {
]
}
;
console.log(props.data?.options?.seriesColor);
let xData = [props.inputData?.x1 || []];
let yData = [props.inputData?.y1 || []];
let length = Math.min(...xData.map(e => e.length), ...yData.map(e => e.length));

@ -69,7 +69,7 @@ const getOption = () => {
itemWidth: 6,
itemGap: 20,
textStyle: {
color: '#fff'
color: props.data?.options?.legendColor ||'#fff'
}
},
tooltip: {
@ -106,7 +106,11 @@ const getOption = () => {
center: [`${props.data?.options?.pieCenter || 50}%`, '50%'],
label: {
show:props.data?.options?.label||false,
formatter: '{b}: {d}%'
formatter: props.data?.options?.pieLabelFormatter || '{b}: {d}%'
},
labelLine: {
length: 2, // 线
length2: 3 // 线
}
}
]

@ -0,0 +1,105 @@
<template>
<div
:style="{width:props.dimensions.width+'px',height:props.dimensions.height+'px'}">
<NodeResizer color="#fff" v-if="!props.isView && !props.isHideHandle && props.selected"
@resize="resize" />
<div class="custom-node"
:style="{width:props.dimensions.width+'px',height:props.dimensions.height+'px',pointerEvents:props.isView?'auto': 'none'}">
<div style="width: 100%; height: 100%;">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[100, 200, 300, 400]"
:size="size"
:disabled="disabled"
:background="background"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
<Handle v-if="!props.isView" :id="`${props.id}.-t`" type="target" :position="Position.Left" />
<Handle v-if="!props.isView" :id="`${props.id}.-s`" type="source" :position="Position.Right" />
</div>
</template>
<script setup>
import { defineEmits, defineProps, ref } from 'vue';
import { NodeResizer } from '@vue-flow/node-resizer';
import { Handle, Position } from '@vue-flow/core';
const currentPage = ref(4);
const pageSize = ref(100);
const total = ref(300);
const size = ref('default');
const background = ref(false);
const disabled = ref(false);
const getOutput = () => {
let output = {
pageSize: pageSize.value,
currentPage: currentPage.value
};
props.data.outputData = output;
};
const handleSizeChange = (val) => {
getOutput();
};
const handleCurrentChange = (val) => {
getOutput();
};
onMounted(() => {
getOutput();
});
const props = defineProps({
isView: {
type: Boolean,
required: false
},
inputData: {
type: Object,
required: false
},
id: {
type: String,
required: true
},
isHideHandle: {
type: Boolean,
required: false
},
selected: {
type: Boolean,
required: false
},
data: {
type: Object,
required: true
},
dimensions: {
type: Object,
required: true
}
});
const emit = defineEmits(['resize']);
const resize = (e) => {
emit('resize', e, props.id);
};
watch(() => JSON.parse(JSON.stringify(props.inputData || '{}')), (obj1, obj2) => {
if (JSON.stringify(obj1) !== JSON.stringify(obj2)) {
total.value = props.inputData?.total || 0;
}
}, { deep: true, immediate: true });
</script>
<style scoped>
.custom-node {
position: absolute;
}
</style>

@ -27,15 +27,16 @@
<div class="scrollTable" style="font-weight: bold;"
:style="{width: i.width || '100px',height:props.data.options.tdHeight,lineHeight:props.data.options.tdHeight,textAlign:i.align || 'left' }"
v-for="(i,k) in props.data.options.tableOptions">
<span v-if="i.type === '文本'">{{ ((props.inputData.tableData || [])[k] || {})[i.field] }}</span>
<span v-if="i.type === '文本'">{{ setText(((props.inputData.tableData || [])[k] || {})[i.field], i.formula)
}}</span>
<el-tag type="primary" v-else-if="i.type === ''">
{{ ((props.inputData.tableData || [])[k] || {})[i.field] }}
{{ setText(((props.inputData.tableData || [])[k] || {})[i.field], i.formula) }}
</el-tag>
<el-image :preview-src-list="[((props.inputData.tableData || [])[k] || {})[i.field]]"
v-else-if="i.type === '图片'" style="width: 100%;" :style="{height:props.data.options.tdHeight}"
:src="((props.inputData.tableData || [])[k] || {})[i.field]" fit="contain" />
:src="setText(((props.inputData.tableData || [])[k] || {})[i.field],i.formula)" fit="contain" />
<span v-else>{{ ((props.inputData.tableData || [])[k] || {})[i.field] }}</span>
<span v-else>{{ setText(((props.inputData.tableData || [])[k] || {})[i.field], i.formula) }}</span>
</div>
</div>
@ -86,7 +87,13 @@ const props = defineProps({
}
});
console.log(props.inputData);
const setText = (value, formula) => {
if (!formula) {
return value;
} else {
}
};
watch(() => JSON.parse(JSON.stringify([props.inputData?.tableData || '', props.data.options])), (obj1, obj2) => {
if (JSON.stringify(obj1) !== JSON.stringify(obj2)) {
scrollShow.value = false;

@ -6,52 +6,283 @@
<div class="custom-node"
:style="{width:props.dimensions.width+'px',height:props.dimensions.height+'px',pointerEvents:props.isView?'auto': 'none'}">
<div class="tableTh"></div>
<vue3ScrollSeamless
class="scroll-wrap"
:classOptions="classOptions"
:dataList="list">
<ul class="ui-wrap">
<li class="li-item" v-for="(item,i) of list" :key="i">
<p style="color: #fff">{{ item.title }}</p>
</li>
</ul>
</vue3ScrollSeamless>
<el-table
:data="props.inputData.tableData"
v-if="scrollShow"
style="--el-table-border-color:#000"
:border="true"
:header-cell-style="{color:props.data.options.thColor,backgroundColor:`${props.data.options?.thBgColor} !important`}"
:header-row-style="{height:props.data.options.thHeight }"
:show-header="props.data.options.isThShow"
:style="{height: '100%'}"
>
<el-table-column v-for="(i,k) in props.data.options.tableOptions" :key="k" :align="i.align" prop="date"
:label="i.name"
:width="i.width">
<template #default="scope">
<div>
<span
v-if="(scope.row[`cellType${k+1}`] || i.type) === '文本'">{{ setText(scope.row[i.field], scope.row, i.formula)
}}</span>
<el-tag type="primary" v-else-if="(scope.row[`cellType${k+1}`] || i.type) === ''">
{{ setText(scope.row[i.field], scope.row, i.formula) }}
</el-tag>
<el-image :preview-src-list="[scope.row[i.field]]"
v-else-if="(scope.row[`cellType${k+1}`] || i.type) === '图片'" style="width: 100%;"
:style="{height:props.data.options.tdHeight}"
:src="setText(scope.row[i.field],scope.row,i.formula)"
fit="contain" />
<el-progress v-else-if="(scope.row[`cellType${k+1}`] || i.type) === ''" :text-inside="true"
:stroke-width="26"
:percentage="parseFloat(setText(scope.row[i.field],scope.row, i.formula))" />
<span v-else>{{ setText(scope.row[i.field], scope.row, i.formula)
}}</span>
</div>
</template>
</el-table-column>
</el-table>
</div>
<Handle v-if="!props.isView" :id="`${props.id}.-t`" type="target" :position="Position.Left" />
</div>
</template>
<script setup>
import { defineEmits, defineProps, ref } from 'vue';
import { NodeResizer } from '@vue-flow/node-resizer';
import { Handle, Position } from '@vue-flow/core';
import { vue3ScrollSeamless } from 'vue3-scroll-seamless';
let list = ref([{
'title': '水调歌头·明月几时有'
}, {
'title': '苏轼 〔宋代〕'
}, {
'title': '明月几时有?把酒问青天。'
}, {
'title': '不知天上宫阙,今夕是何年。'
}, {
'title': '我欲乘风归去,又恐琼楼玉宇,高处不胜寒'
}, {
'title': '起舞弄清影,何似在人间。'
}, {
'title': '转朱阁,低绮户,照无眠。'
}, {
'title': '不应有恨,何事长向别时圆?'
}, {
'title': '人有悲欢离合,月有阴晴圆缺,此事古难全。'
}, {
'title': '但愿人长久,千里共婵娟。'
}
]);
const a = {
'tableData': [
{
'生产日期': '2024/8/2',
'销售订单': 'G-00101',
'产品名称': '圆珠笔',
'规格型号': '0.5mm',
'单位': '个',
'计划产量': 50,
'实际产量': 45,
'不良数量': 10,
'完成率': '90.00%',
'用时': '2小时',
'备注': ''
},
{
'生产日期': '2024/8/3',
'销售订单': 'G-00110',
'产品名称': '订书机',
'规格型号': '小型',
'单位': '个',
'计划产量': 100,
'实际产量': 99,
'不良数量': 11,
'完成率': '99.00%',
'用时': '3小时',
'备注': ''
},
{
'生产日期': '2024/8/4',
'销售订单': 'G-00111',
'产品名称': '笔记本',
'规格型号': 'A5',
'单位': '个',
'计划产量': 150,
'实际产量': 130,
'不良数量': 15,
'完成率': '86.67%',
'用时': '4小时',
'备注': ''
},
{
'生产日期': '2024/8/5',
'销售订单': 'G-00568',
'产品名称': '笔筒',
'规格型号': '500mm',
'单位': '个',
'计划产量': 200,
'实际产量': 195,
'不良数量': 20,
'完成率': '97.50%',
'用时': '5小时',
'备注': ''
},
{
'生产日期': '2024/8/6',
'销售订单': 'G-00365',
'产品名称': '毛笔',
'规格型号': '小楷笔',
'单位': '个',
'计划产量': 250,
'实际产量': 243,
'不良数量': 22,
'完成率': '97.20%',
'用时': '6小时',
'备注': ''
},
{
'生产日期': '2024/8/7',
'销售订单': 'G-00486',
'产品名称': '铅笔',
'规格型号': '184mm',
'单位': '个',
'计划产量': 300,
'实际产量': 289,
'不良数量': 21,
'完成率': '96.33%',
'用时': '7小时',
'备注': ''
},
{
'生产日期': '2024/8/8',
'销售订单': 'G-00321',
'产品名称': '文件袋',
'规格型号': '240mm',
'单位': '个',
'计划产量': 350,
'实际产量': 345,
'不良数量': 25,
'完成率': '98.57%',
'用时': '8小时',
'备注': ''
},
{
'生产日期': '2024/8/9',
'销售订单': 'G-00462',
'产品名称': '文件盒',
'规格型号': '500mm',
'单位': '个',
'计划产量': 400,
'实际产量': 396,
'不良数量': 26,
'完成率': '99.00%',
'用时': '9小时',
'备注': ''
},
{
'生产日期': '2024/8/10',
'销售订单': 'G-00466',
'产品名称': '水墨笔',
'规格型号': '黑色',
'单位': '个',
'计划产量': 450,
'实际产量': 441,
'不良数量': 27,
'完成率': '98.00%',
'用时': '10小时',
'备注': ''
},
{
'生产日期': '2024/8/11',
'销售订单': 'G-00468',
'产品名称': '橡皮擦',
'规格型号': '小熊',
'单位': '个',
'计划产量': 500,
'实际产量': 498,
'不良数量': 100,
'完成率': '99.60%',
'用时': '11小时',
'备注': ''
},
{
'生产日期': '2024/8/12',
'销售订单': 'G-00500',
'产品名称': '日历',
'规格型号': 'A5',
'单位': '个',
'计划产量': 550,
'实际产量': 530,
'不良数量': 150,
'完成率': '96.36%',
'用时': '12小时',
'备注': ''
},
{
'生产日期': '2024/8/13',
'销售订单': 'G-00510',
'产品名称': '双面胶',
'规格型号': '100m',
'单位': '个',
'计划产量': 600,
'实际产量': 580,
'不良数量': 35,
'完成率': '96.67%',
'用时': '13小时',
'备注': ''
},
{
'生产日期': '2024/8/14',
'销售订单': 'G-00511',
'产品名称': 'A4纸',
'规格型号': '500张',
'单位': '个',
'计划产量': 650,
'实际产量': 610,
'不良数量': 50,
'完成率': '93.85%',
'用时': '14小时',
'备注': ''
},
{
'生产日期': '2024/8/15',
'销售订单': 'G-00515',
'产品名称': '美工刀',
'规格型号': '小',
'单位': '个',
'计划产量': 700,
'实际产量': 670,
'不良数量': 100,
'完成率': '95.71%',
'用时': '15小时',
'备注': ''
},
{
'生产日期': '2024/8/16',
'销售订单': 'G-00518',
'产品名称': '剪刀',
'规格型号': '中',
'单位': '个',
'计划产量': 600,
'实际产量': 500,
'不良数量': 60,
'完成率': '83.33%',
'用时': '16小时',
'备注': ''
},
{
'生产日期': '2024/8/17',
'销售订单': 'G-00520',
'产品名称': '墨水',
'规格型号': '红色',
'单位': '个',
'计划产量': 500,
'实际产量': 420,
'不良数量': 80,
'完成率': '84.00%',
'用时': '17小时',
'备注': ''
},
{
'生产日期': '2024/8/18',
'销售订单': 'G-00525',
'产品名称': '文具盒',
'规格型号': '卡通',
'单位': '个',
'计划产量': 500,
'实际产量': 450,
'不良数量': 100,
'完成率': '90.00%',
'用时': '18小时',
'备注': ''
}
]
};
const aa = '${type} - ${aa}';
const scrollShow = ref(true);
const classOptions = ref({
limitMoveNum: 6
limitMoveNum: 5
});
const props = defineProps({
isView: {
@ -83,7 +314,40 @@ const props = defineProps({
required: true
}
});
const formulaFun = (row, formula) => {
let data = formula.replace(/\$\{\s*([^}]+?)\s*\}/g, (_, key) => {
if (`${row[key]}`?.trim() !== '' && !isNaN(row[key])) {
return row[key] || 0;
} else {
return `"${row[key]}"`;
}
});
let res = 0;
try {
res = eval(data);
} catch (err) {
res = 0;
}
if (`${res}`.trim() !== '' && !isNaN(res)) {
res = res.toFixed(2);
}
return res;
};
const setText = (value, row, formula) => {
if (!formula) {
return value;
} else {
return formulaFun(row, formula);
}
};
watch(() => JSON.parse(JSON.stringify([props.inputData?.tableData || '', props.data.options])), (obj1, obj2) => {
if (JSON.stringify(obj1) !== JSON.stringify(obj2)) {
scrollShow.value = false;
nextTick(() => {
scrollShow.value = true;
});
}
}, { deep: true, immediate: true });
const emit = defineEmits(['resize']);
const resize = (e) => {
emit('resize', e, props.id);
@ -93,5 +357,10 @@ const resize = (e) => {
.custom-node {
position: absolute;
}
.scrollTable {
display: inline-block;
vertical-align: top;
}
</style>

@ -277,7 +277,14 @@ const getOption = (e) => {
};
} else if (e === 'pie' || e === 'nightingaleRoseDiagram') {
return {
title: '', yNames: [], tooltip: true, legend: true, label: true, pieCenter: 50
title: '',
yNames: [],
tooltip: true,
legend: true,
label: true,
pieCenter: 50,
pieLabelFormatter: '',
legendColor: '#fff'
};
} else if (e === 'annular') {
return {
@ -312,7 +319,7 @@ const getOption = (e) => {
} else if (e === 'scrollTable' || e === 'table') {
return {
tableOptions: [],
tableClassOption: {},
tableClassOption: {}, isThShow: true,
thHeight: '32px',
tdHeight: '28px',
thColor: '#D6F4FF',
@ -324,6 +331,8 @@ const getOption = (e) => {
return { swiperOptions: {}, imageFit: 'contain', carouselImages: [] };
} else if (e === 'background') {
return { backgroundColor: '#fff', isBorder: true, borderColor: '#fff', backgroundImage: '' };
} else if (e === 'pagination') {
return { pageSizeField: 'pageSize', currentPageField: 'currentPage' };
} else if (e === 'digitalFlop') {
return {
field: '', number: 1111, backgroundColor: 'rgba(180, 180, 180, 0.2)', isBorder: true, borderColor: '#fff'

@ -1,8 +1,9 @@
<template>
<div class="content"
:style='`width:${area?.width || "100%"};height:${area?.height || "100%"};background-image:url(${area?.bg})`'>
<div v-for="i in nodes" class="node"
:style="{left: (i.position?.x / (parseFloat(area?.width)|| 1920))*100 +'%',top: (i.position?.y / (parseFloat(area?.height) || 1080))*100 +'%'}">
<div v-for="(i,k) in nodes" class="node"
:style="{zIndex:k,left: (i.position?.x / (parseFloat(area?.width)|| 1920))*100 +'%',top: (i.position?.y / (parseFloat(area?.height) || 1080))*100 +'%'}">
<template v-if="i.type === 'customBoard'">
<CustomBoardNode :isView="true" :inputData=getInputData(i.id) v-bind="i"></CustomBoardNode>
</template>
@ -76,10 +77,12 @@
<template v-if="i.type === 'scrollTable'">
<ScrollTableNode :isView="true" :inputData=getInputData(i.id) v-bind="i"></ScrollTableNode>
</template>
<template v-if="i.type === 'background'">
<BackgroundNode :isView="true" :inputData=getInputData(i.id) v-bind="i"></BackgroundNode>
</template>
<template v-if="i.type === 'pagination'">
<PaginationNode :isView="true" :inputData=getInputData(i.id) v-bind="i"></PaginationNode>
</template>
<template v-if="i.type === 'annular'">
<AnnularNode :isView="true" :inputData=getInputData(i.id) v-bind="i"></AnnularNode>
</template>
@ -104,6 +107,7 @@ import { useRouter } from 'vue-router';
import AreaNode from './nodes/other/areaNode.vue';
import BackgroundNode from '@/views/boardGenerate/nodes/form/backgroundNode.vue';
import PaginationNode from '@/views/boardGenerate/nodes/form/paginationNode.vue';
import AnnularNode from '@/views/boardGenerate/nodes/board/annularNode.vue';
import DashboardNode from '@/views/boardGenerate/nodes/board/dashboardNode.vue';
@ -164,7 +168,7 @@ onMounted(async () => {
await getBoardApi(router.currentRoute.value.query.id)
.then((res) => {
let data = res.data;
nodes.value = data.designPagePointList?.length !== 0 ? data.designPagePointList.map(e => {
nodes.value = data.designPagePointList?.length !== 0 ? data.designPagePointList.sort((a, b) => a.fieldOne - b.fieldOne).map(e => {
let data = {};
let savaField = ['customData', 'options'];
let dataContent = JSON.parse(e.dataContent) || {};

@ -74,6 +74,15 @@
v-bind="i"
></SelectNode>
</template>
<template v-if="i.type === 'inputNode'">
<InputNode
:isView="true"
:isPrint="isPrint"
:pageData="pageData"
:pageSize="{ width: cmToPx(pageWidth), height: cmToPx(pageHeight) }"
v-bind="i"
></InputNode>
</template>
</div>
</div>
</div>
@ -109,6 +118,7 @@ import BarCodeNode from './nodes/barCodeNode.vue';
import QRCodeNode from './nodes/QRCodeNode.vue';
import TimeNode from './nodes/timeNode.vue';
import SelectNode from './nodes/selectNode.vue';
import InputNode from './nodes/inputNode.vue';
import { useRoute } from 'vue-router';
import { isJSON } from '@/utils/scrin.js';
import { listPrintTemplateList } from '@/api/system/printTemplateList/index';

@ -139,6 +139,9 @@
<el-form-item label="字段名" v-if="Object.keys(nodeAttrForm).includes('field')">
<el-input v-model="nodeAttrForm.field" style="width: 100%" />
</el-form-item>
<el-form-item label="集合字段名" v-if="Object.keys(nodeAttrForm).includes('selectField')">
<el-input v-model="nodeAttrForm.selectField" style="width: 100%" />
</el-form-item>
<el-form-item label="缺省显示" v-if="Object.keys(nodeAttrForm).includes('default')">
<el-input v-model="nodeAttrForm.default" style="width: 100%" />
</el-form-item>
@ -435,17 +438,13 @@ const data = {
planCode:'1',
cardId:'1',
classes:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
planCode:'1',
team: '1',
specification: '1',
machineTable: '1',
operatorName: '张三',
operatorList: ['张三', '李四'],
barcode: '1',
qrcode: '1'
};
const dics = ref([]);
@ -537,7 +536,7 @@ const zoomChange = (e) => {
const view = () => {
localStorage.setItem('printNodes', JSON.stringify(nodes.value));
console.log();
internalInstance.appContext.config.globalProperties.$openPrint([{}, {}, {}, {}, {}], 'demo1');
internalInstance.appContext.config.globalProperties.$openPrint([data, data, data], 'demo1');
// isView.value = true;
};
@ -584,13 +583,13 @@ const clear = () => {
};
onMounted(() => {
listType({
pageNum: 1,
pageSize: 9999999
}).then(e => {
dics.value = e.rows;
console.log(dics.value);
});
// listType({
// pageNum: 1,
// pageSize: 9999999
// }).then(e => {
// dics.value = e.rows;
// console.log(dics.value);
// });
flowRef.value.onInit(() => {
flowRef.value.setTransform({
x: 0,

@ -71,16 +71,13 @@ const props = defineProps({
const text = ref('');
const options = ref([]);
const getDic = (value) => {
listData({
pageNum: 1,
pageSize: 9999999,
dictType: value
}).then(e => {
options.value = e.rows.map(v => v.dictLabel);
})
.catch(e => {
getDic(value);
});
// listData({
// pageNum: 1,
// pageSize: 9999999,
// dictType: value
// }).then(e => {
// options.value = e.rows.map(v => v.dictLabel);
// })
};
const getEleData = async () => {
if (props.isView) {
@ -93,15 +90,15 @@ const getEleData = async () => {
const addFunction = new Function('request', fun());
const data = await addFunction(request)();
options.value = data;
} else if (props.data.options.field) {
options.value = options.value = props.pageData?.[props.data.options.field] || [];
} else if (props.data.options.selectField) {
options.value = options.value = props.pageData?.[props.data.options.selectField] || [];
} else if (props.data.options.dic) {
getDic(props.data.options.dic);
} else {
options.value = props.data.options.selectOptions || [];
}
} else {
options.value = props.data.options.field ? (props.pageData?.[props.data.options.field] || []) : props.data.options.selectOptions || [];
options.value = props.data.options.selectField ? (props.pageData?.[props.data.options.selectField] || []) : props.data.options.selectOptions || [];
}
};
const spanChange = (val) => {
@ -111,7 +108,7 @@ onMounted(() => {
getEleData();
});
let timestep = new Date().getTime();
watch(() => [JSON.parse(JSON.stringify(props.data.options.selectOptions)), JSON.parse(JSON.stringify(props.data.options.field)), JSON.parse(JSON.stringify(props.data.options.dic || ''))], (obj1, obj2) => {
watch(() => [JSON.parse(JSON.stringify(props.data.options.selectOptions)), JSON.parse(JSON.stringify(props.data.options.field)), JSON.parse(JSON.stringify(props.data.options.selectField || '')), JSON.parse(JSON.stringify(props.data.options.dic || ''))], (obj1, obj2) => {
if (new Date().getTime() - timestep > 500) {
timestep = new Date().getTime();
if (JSON.stringify(obj1) !== JSON.stringify(obj2)) {
@ -121,7 +118,11 @@ watch(() => [JSON.parse(JSON.stringify(props.data.options.selectOptions)), JSON.
}, { deep: true });
watch(() => JSON.parse(JSON.stringify(props.data.options.default)), (obj1, obj2) => {
if (JSON.stringify(obj1) !== JSON.stringify(obj2)) {
text.value = props.data.options.default;
if (props.data.options.field) {
text.value = options.value = props.pageData?.[props.data.options.field] || '';
} else {
text.value = props.data.options.default;
}
}
}, { deep: true, immediate: true });

@ -46,6 +46,7 @@ const getOption = (e, name) => {
...commonOption, dic: '',
default: '',
JScript: '',
selectField:'',
selectOptions: [],
horizontalAlign: 'center',
verticalAlign: 'center',

Loading…
Cancel
Save