存档＆改造【02】下载文件模板 打印二维码样式设置
1.下载文件模板
文件模板获取得先设置好全局变量和获取文件URL
声明变量
function fileDownload(url, name) {
return new Promise((resolve, reject) => {
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true); // 也可以使用POST方式，根据接口
xhr.responseType = "blob"; // 返回类型blob
// 定义请求完成的处理函数，请求前也可以增加加载框/禁用下载按钮逻辑
xhr.onload = function () {
// 请求完成
if (this.status === 200) {
// 返回200
var blob = this.response;
var reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64，可以直接放入a表情href
reader.onload = function (e) {
// 转换完成，创建一个a标签用于下载
var a = document.createElement("a");
a.download = name;
a.href = e.target.result;
$("body").append(a); // 修复firefox中无法触发click
a.click();
resolve(200)
$(a).remove();
};
}
};
// 发送ajax请求
xhr.send();
})
};获取URL的动态操作
配置后点击导入模板下载终于有东西了
只不过因为没存东西进去，所以打开是这样的
需要在对应网址配置下载内容。
2.生成二维码
要设置二维码打印样式，将样式设置做成对话框的形式，实现在上面预览打印效果图，先创建一个
配置二维码生成
在【动态操作】中配置
declare
v_err_msg nvarchar2(2000);
v_clob clob;
/**
* create by: xiaoxian
* create date: 2023-09-20 16:32
* modify by:
* modify date:
* describe:
*/
begin
select json_arrayagg(
json_object(
key 'DEVICE_ID' value DEVICE_ID,
key 'DEVICE_NAME' value DEVICE_NAME,
key 'DEVICE_CODE' value DEVICE_CODE,
key 'IP' value IP,
key 'FAB_ID' value FAB_ID,
key 'MAP_AREA_X_ID' value MAP_AREA_X_ID,
key 'MAP_AREA_Y_ID' value MAP_AREA_Y_ID,
key 'MANAGEMENT_EXT_ORG_ID' value MANAGEMENT_EXT_ORG_ID,
key 'CATEGORY_FIRST_CODE' value CATEGORY_FIRST_CODE,
key 'CATEGORY_SECOND_CODE' value CATEGORY_SECOND_CODE
)
)
into v_clob
from (
select s.DEVICE_ID,
s.DEVICE_NAME,
s.DEVICE_CODE,
s.IP,
s.FAB_ID,
s.MAP_AREA_X_ID,
s.MAP_AREA_Y_ID,
s.MANAGEMENT_EXT_ORG_ID,
s.CATEGORY_FIRST_CODE,
s.CATEGORY_SECOND_CODE
from JM_BASIC_DEVICE s
)
where DEVICE_ID in (select * from table ( SPLITSTR(:P14_INST_IDS, ',') ));
apex_util.set_session_state('P14_RESP_DATA', v_clob);
exception
when others then
v_err_msg := sqlerrm || chr(13) || dbms_utility.format_error_backtrace;
JA_WRITE_LOG('P' || :APP_PAGE_ID || '二维码生成', 'ERROR', V_ERR_MSG, :USER_ID, :USER_TENANT,
:APP_NAME || ':' || :APP_ID);
end;function showInstrumentDetails() {
//解析获取JSON字符串
var myJSONString = decodeURIComponent(apex.item('P14_RESP_DATA').getValue());
//转换字符串为原始格式
var myJSONArray = JSON.parse(myJSONString);
var myDiv = document.getElementById('instrument-list');
//仪器二维码标签循环
for (var i = 0; i <= myJSONArray.length - 1; i++) {
var myObj = myJSONArray[i];
//生成list
var myUl = document.createElement('ul');
myUl.id = 'myUl' + i;
//ul标签添加属性
myUl.className = 'list-unstyled fw-bold';
//设备IP
var myLi1 = document.createElement('li');
myLi1.innerHTML = '设备IP: ' + myObj.IP;
//所在位置
var myLi2 = document.createElement('li');
myLi2.innerHTML = '所在位置: ' + myObj.FAB_ID + myObj.MAP_AREA_X_ID + myObj.MAP_AREA_Y_ID ;
myLi2.classList.add('mt-3');
//责任部门
var myLi3 = document.createElement('li');
myLi3.innerHTML = '责任部门: ' + myObj.MANAGEMENT_EXT_ORG_ID;
myLi3.classList.add('mt-3');
//大类名称
var myLi4 = document.createElement('li');
myLi4.innerHTML = '大类名称: ' + myObj.CATEGORY_FIRST_CODE;
myLi4.classList.add('mt-3');
//小类名称
var myLi5 = document.createElement('li');
myLi5.innerHTML = '小类名称: ' + myObj.CATEGORY_SECOND_CODE;
myLi5.classList.add('mt-3');
//list子元素添加到添加到父元素中
myUl.appendChild(myLi1);
myUl.appendChild(myLi2);
myUl.appendChild(myLi3);
myUl.appendChild(myLi4);
myUl.appendChild(myLi5);
//二维码标签属性
var myInstrumentDiv = document.createElement('div');
myInstrumentDiv.id = 'myInstrumentDiv' + i;
myInstrumentDiv.className = 'shadow rounded-4 m-1';
myInstrumentDiv.style.position = 'relative';
myInstrumentDiv.style.height = '300px';
myInstrumentDiv.style.width = '420px';
//标签标题与属性
var myH4 = document.createElement('h4');
myH4.className = 'text-center pt-3';
myH4.innerHTML = '' + myObj.DEVICE_NAME;
//分割线——1
var myHr1 = document.createElement('hr');
//二维码标签效果
var myDiv2 = document.createElement('div');
myDiv2.id = 'qrcode_content';
myDiv2.style.paddingLeft = '20px';
myDiv2.className = 'mt-3';
myDiv2.appendChild(myUl);
//分割线——2
var myHr2 = document.createElement('hr');
myHr2.style.marginTop = '15px';
//二维码内容
var qr_content = '&APP_URL.f?p=106:4:&inst_id=' + myObj.DETAILS_ID;
var myDiv3 = document.createElement('div');
myDiv3.id = 'qrcode' + i;
myDiv3.style.position = 'absolute';
myDiv3.style.bottom = '70px';
myDiv3.style.right = '60px';
//list添加到标签
myInstrumentDiv.appendChild(myH4);
myInstrumentDiv.appendChild(myHr1);
myInstrumentDiv.appendChild(myDiv2);
myInstrumentDiv.appendChild(myHr2);
myInstrumentDiv.appendChild(myDiv3);
//生成二维码传递参数
makeqrcode(qr_content, myDiv3);
myDiv.appendChild(myInstrumentDiv);
}
}
//调用函数
showInstrumentDetails();
// apex.storage.setSessionStorage('inst_details_id', myObj.INST_DETAILS_ID);
//生成二维码函数
function makeqrcode(qr_content, qrcodeElem) {
const qr = new QRCode(qrcodeElem, { width: 3200, height: 1800 }); //二维码尺寸大小
qr_content.oninput = (e) => {
qr.makeCode(e.target.value.trim());
};
qr.makeCode(qr_content.trim());
}二维码出来了，但是又没完全出来（之所以设3200px*1800px那么大是因为考虑后期可能会压缩图像大小，干脆一开始需求里做大一点）
改了以后（依旧很丑orz）
除了格式上的问题，还有就是显示上的问题，想要显示名称而不是id/编号；（我找到问题的根源了，在pl/sql语句那里）
改动参数即可修改位置
修改后的样式顺眼多了
接下来就是解决内容展示
重新修改了
declare
v_err_msg nvarchar2(2000);
v_clob clob;
/**
* create by: xiaoxian
* create date: 2023-09-21 15:49
* modify by:
* modify date:
* describe:设备二维码预览2.0
*/
begin
select json_arrayagg(
json_object(
key 'DEVICE_ID' value DEVICE_ID,
key 'DEVICE_NAME' value DEVICE_NAME,
key 'DEVICE_CODE' value DEVICE_CODE,
key 'IP' value IP,
key 'FAB_ID' value FAB_ID,
key 'MAP_AREA_X_ID' value MAP_AREA_X_ID,
key 'MAP_AREA_Y_ID' value MAP_AREA_Y_ID,
key 'MANAGEMENT_EXT_ORG_ID' value MANAGEMENT_EXT_ORG_ID,
key 'CATEGORY_FIRST_CODE' value CATEGORY_FIRST_CODE,
key 'CATEGORY_SECOND_CODE' value CATEGORY_SECOND_CODE,
)
)
into v_clob
from (
select s.DEVICE_ID,
s.DEVICE_NAME,
s.DEVICE_CODE,
s.IP,
(select d.NAME from FND_FAB d where d.FAB_ID = s.FAB_ID) FAB_ID ,
(select x.NAME from FND_AREAS x where x.FAB_ID = s.MAP_AREA_X_ID) MAP_AREA_X_ID,
(select y.NAME from FND_AREAS y where y.FAB_ID = s.MAP_AREA_X_ID) MAP_AREA_Y_ID,
(select b.MANAGEMENT_EXT_ORG_NAME from BASIC_DEVICE_BUFF_3 b where b.MANAGEMENT_EXT_ORG_ID = s.MANAGEMENT_EXT_ORG_ID) MANAGEMENT_EXT_ORG_ID,
(select b.CATEGORY_FIRST_NAME from BASIC_DEVICE_BUFF_3 b where b.CATEGORY_FIRST_CODE = s.CATEGORY_FIRST_CODE) CATEGORY_FIRST_CODE,
(select b.CATEGORY_SECOND_NAME from BASIC_DEVICE_BUFF_3 b where b.CATEGORY_SECOND_CODE= s.CATEGORY_SECOND_CODE) CATEGORY_SECOND_CODE
from JM_BASIC_DEVICE s
)
where DEVICE_ID in (select * from table ( SPLITSTR(:P13_DEVICE_ID, ',') ));
apex_util.set_session_state('P13_RESP_DATA', v_clob);
exception
when others then
v_err_msg := sqlerrm || chr(13) || dbms_utility.format_error_backtrace;
JA_WRITE_LOG('P' || :APP_PAGE_ID || '二维码生成', 'ERROR', V_ERR_MSG, :USER_ID, :USER_TENANT,
:APP_NAME || ':' || :APP_ID);
end;
select * from fnd_maps_areas_asso_v;打印结果
找到原因了，pl/sql里多了一个逗号
新的问题又已出现
破案了，在这儿呢
因为打印是在P14，所以将P13_RESP_DATA改成P14_RESP_DATA，至于厂区ID随着P13中值传递，传到P14_INST_IDS，所以这里也要改。
值传递过程
代码：
declare
v_err_msg nvarchar2(2000);
v_clob clob;
/**
* create by: xiaoxian
* create date: 2023-09-21 15:49
* modify by:
* modify date:
* describe:设备二维码预览2.0
*/
begin
select json_arrayagg(
json_object(
key 'DEVICE_ID' value DEVICE_ID,
key 'DEVICE_NAME' value DEVICE_NAME,
key 'DEVICE_CODE' value DEVICE_CODE,
key 'IP' value IP,
key 'FAB_ID' value FAB_ID,
key 'MAP_AREA_X_ID' value MAP_AREA_X_ID,
key 'MAP_AREA_Y_ID' value MAP_AREA_Y_ID,
key 'MANAGEMENT_EXT_ORG_ID' value MANAGEMENT_EXT_ORG_ID,
key 'CATEGORY_FIRST_CODE' value CATEGORY_FIRST_CODE,
key 'CATEGORY_SECOND_CODE' value CATEGORY_SECOND_CODE
)
)
into v_clob
from (
select s.DEVICE_ID,
s.DEVICE_NAME,
s.DEVICE_CODE,
s.IP,
(select d.NAME from FND_FAB d where d.FAB_ID = s.FAB_ID) FAB_ID ,
(select x.NAME from FND_AREAS x where x.FAB_ID = s.MAP_AREA_X_ID) MAP_AREA_X_ID,
(select y.NAME from FND_AREAS y where y.FAB_ID = s.MAP_AREA_X_ID) MAP_AREA_Y_ID,
(select b.MANAGEMENT_EXT_ORG_NAME from BASIC_DEVICE_BUFF_3 b where b.MANAGEMENT_EXT_ORG_ID = s.MANAGEMENT_EXT_ORG_ID) MANAGEMENT_EXT_ORG_ID,
(select b.CATEGORY_FIRST_NAME from BASIC_DEVICE_BUFF_3 b where b.CATEGORY_FIRST_CODE = s.CATEGORY_FIRST_CODE) CATEGORY_FIRST_CODE,
(select b.CATEGORY_SECOND_NAME from BASIC_DEVICE_BUFF_3 b where b.CATEGORY_SECOND_CODE= s.CATEGORY_SECOND_CODE) CATEGORY_SECOND_CODE
from JM_BASIC_DEVICE s
)
where DEVICE_ID in (select * from table ( SPLITSTR(:P14_INST_IDS, ',') ));
apex_util.set_session_state('P14_RESP_DATA', v_clob);
exception
when others then
v_err_msg := sqlerrm || chr(13) || dbms_utility.format_error_backtrace;
JA_WRITE_LOG('P' || :APP_PAGE_ID || '二维码生成', 'ERROR', V_ERR_MSG, :USER_ID, :USER_TENANT,
:APP_NAME || ':' || :APP_ID);
end;出来了，但是又没完全出来
和之前的对比一下