目的: V120402B -[歸還登記]鈕 -開啟子視窗,顯示子畫面 - 含Grid
處理說明: 1>var win = getMyWindow("借閱登記", sub_LendFlds, sub_LendFlds_Btns);
win.show();
win.show();
2>設定子畫面下方處理按鈕(sub_LendFlds_Btns)
3>設定子畫面上方過濾條件 & Grid
4>子畫面 layout: 'border'
[過濾條件: region: 'north',] [Grid: region: 'center',] []
1>*.js - 開啟子視窗
//按鈕 : [借閱登記] [歸還登記][續借登記][查詢借閱記錄][報表]
var BtnAry = [
{
xtype: 'button', text: '借閱登記', id: 'LendBtn',
listeners: {
click: function () {
LendBtn_click();
}
}
},
{
xtype: 'button', text: '歸還登記', id: 'BackBtn',
listeners: {
click: function () {
//console.log(" 1 inside 缺勤記錄維護: ");
BackBtn_click();
}
}
},
:
]
//於單檔下方新增 Button
Ext.getCmp('grid_D').insertBtn(BtnAry);
//[借閱登記]鈕 - 子視窗
function LendBtn_click() {
console.log("step1");
//按鈕 : [確認] [取消] - [借閱登記]鈕
var sub_LendFlds_Btns = [
{
xtype: 'button', text: '確定', id: 'sub_LendFlds_OkBtn',
listeners: {
click: function () {
//mysuccessalert("mysub2_確定 ");
sub_LendFlds_OkBtn();
}
}
},
{
xtype: 'button', text: '刪除', id: 'sub_LendFlds_DelBtn',
listeners: {
click: function () {
//mysuccessalert("mysub2_確定 ");
//sub_LendFlds_DelBtn();
var Tmp_sub_Grid = Ext.getCmp('sub_Grid');
console.log("Tmp_sub_Grid:", Tmp_sub_Grid);
var cur_recs;
var cur_rec;
cur_recs = Tmp_sub_Grid.selModel.getSelection();
if (cur_recs.length == 0) {
mywarnalert("請先選擇要刪除的資料");
return;
}
else {
cur_rec = cur_recs[0];
console.log("cur_rec:", cur_rec);
console.log("Tmp_sub_Grid.store:", Tmp_sub_Grid.store);
Tmp_sub_Grid.store.remove(cur_rec);
mysuccessalert("刪除資料完成 !!");
return;
}
}
}
},
{
xtype: 'button', text: '取消', id: 'sub_LendFlds_CancelBtn',
listeners: {
click: function () {
//mysuccessalert("mysub2_取消");
var Tmp_win = this.up("window");
if (Tmp_win == undefined) {
Ext.Msg.alert("取消時未取到Window Object");
}
this.up("window").close();
this.up("window").destroy();
}
}
},
];
console.log("step2");
var sub_Columns = [
{ header: "", xtype: "rownumberer", width: 50, align: "center", sortable: false },
{ header: "條碼編號", dataIndex: "TMNO", width: 100, TMType: "string" },
{ header: "技令編號", dataIndex: "TMNOXX", width: 150, TMType: "string" },
{ header: "文件編號", dataIndex: "DOCNO", width: 100, TMType: "string" },
{ header: "最近版期", dataIndex: "VNDTXY_", width: 100, TMType: "string" },
{ header: "最近版別", dataIndex: "VNTPXD_", width: 100, TMType: "string" },
{ header: "頁次", dataIndex: "SHT", width: 100, TMType: "string" },
{ header: "版本", dataIndex: "REV", width: 100, TMType: "string" },
{ header: "文件名稱", dataIndex: "DOCTLE", width: 200, TMType: "string" },
{ header: "儲位", dataIndex: "STLCT", width: 100, TMType: "string" },
{ header: "冊號", dataIndex: "VOL", width: 100, TMType: "string" },
{ header: "管制現況", dataIndex: "STAT", width: 80, TMType: "string" },
{ header: "管制現況說明", dataIndex: "STAT_", width: 100, TMType: "string" },
{ header: "預期借閱天數", dataIndex: "BRDAY_", width: 100, TMType: "string" },
{ header: "備註", dataIndex: "REMARK_", width: 100, TMType: "string" },
];
var sub_Fields = [
{ name: "TMNO" },
{ name: "TMNOXX" },
{ name: "DOCNO" },
{ name: "VNTPXD_" },
{ name: "VNDTXY_" },
{ name: "SHT" },
{ name: "REV" },
{ name: "DOCTLE" },
{ name: "STLCT" },
{ name: "VOL" },
{ name: "STAT" },
{ name: "STAT_" },
{ name: "BRDAY_" },
{ name: "REMARK_" },
];
//借閱登記 Grid
var sub_Grid = Ext.create('TMGrid', {
grid_id: 'sub_Grid',
columns: sub_Columns,
autoScroll: true,
flex: 1,
store: Ext.create('gridstore', { model: sub_Fields }),
});
console.log("step2.5");
// [缺勤記錄維護]鈕 - 子畫面欄位
var sub_LendFlds = [
{
type: 'panel', bodyStyle: "background-color:transparent;", border: 0, padding: "5",
flex: 100,
layout: 'border',
items: [
{ //sub_panel1 : 過濾條件 panel
xtype: 'panel',
id: 'sub_panel1',
region: 'north',
layout: { type: 'hbox', align: 'stretch' },
//flex: 0,
//border: 1,
items: [
{
xtype: 'panel',
id: 'sub_panel11',
layout: { type: 'vbox', align: 'stretch' },
flex: 15,
border: 0,
items: [{
xtype: "fieldcontainer", fieldLabel: "借閱人員", labelWidth: 60, layout: "hbox", flex: 2,
items: [{
xtype: "textfield", id: "sub_BRP", name: "sub_BRP", width: 100, padding: "0 4 0 0", fieldCls: "required",
listeners: {
change: function (textfield, newValue, oldValue) {
if (newValue.length == 10) {
getVcardInfo(newValue);
}0
}
}
},
{ xtype: "textfield", id: "sub_BRP_", name: "sub_BRP_", width: 100, padding: "0 4 0 0", readOnly: true, fieldCls: "readonly", },
{
xtype: "button", id: "sub_BRP_btn", name: "sub_BRP_btn", width: 100, padding: "0 4 0 0", text: "借閱人員變更",
handler: function () {
Ext.getCmp("sub_BRP").setValue("");
}
},
]
}, // end of s_借閱人員
{ //QRCODE
xtype: "fieldcontainer", fieldLabel: "QR CODE", labelWidth: 60, layout: "hbox", flex: 2,
items: [
{
xtype: "textfield", id: "sub_TMNO", name: "sub_TMNO", width: 200, padding: "0 4 0 0", fieldCls: "required",
listeners: {
blur: function (obj, event, opts) {
//1>檢核 TMNO 是否存在 AMM_TMDWG
//2>檢核 TMNO 存在 AMM_TMDWG 是否可借閱(STAT='A')
var Tmp_TMNO = "";
var isOk = true;
Tmp_TMNO = Ext.getCmp("sub_TMNO").getValue();
var np = {};
np["TMNO"] = Tmp_TMNO;
Ext.Ajax.request({
method: "POST",
url: '../../api/V120402API/CHECK_TMNO',
params: np,
async: false,
success: function (response, opts) {
console.log("0 response.responseText=", response.responseText);
var Tmp_Obj = Ext.decode(response.responseText);
console.log("1 Tmp_Obj=", Tmp_Obj);
if (Tmp_Obj["success"] == false) {
var Tmp_Rtn_Msg = "條碼編號 (" + Tmp_TMNO + ")錯誤訊息如下:<br>"
+ Tmp_Obj["Rtn_Msg"];
mywarnalert(Tmp_Rtn_Msg);
isOk = false;
}
}, //end of success
failure: function (response, opts) {
var Tmp_Obj = Ext.decode(response.responseText);
var Tmp_Rtn_Msg = "條碼編號 (" + Tmp_TMNO + ")錯誤訊息如下:<br>"
+ Tmp_Obj["Rtn_Msg"];
mywarnalert(Tmp_Rtn_Msg);
isOk = false;
}
}) //end of Ext.Ajax.Request
//若 ok ,才可按 [加入資料]
if (isOk == true) {
console.log("isOk:", isOk);
if (!checkisnull(Ext.getCmp("sub_btn_add")))
Ext.getCmp("sub_btn_add").setDisabled(false);
}
else {
if (!checkisnull(Ext.getCmp("sub_btn_add")))
Ext.getCmp("sub_btn_add").setDisabled(true);
}
//3>加入 sub_store
console.log("1 sub_btn_add.fireHandler()");
Ext.getCmp("sub_btn_Add").fireHandler();
//Ext.getCmp("sub_btn_Add").fireEvent("click");
//console.log("2 sub_btn_add.fireEvent(click)");
} // end of blur event
} // end of Listener
}, // end of sub_TMNO
] // end of QR_CODE.ITEMS
},
]
}, //end of sub2_panel11 , flex:20
{
//xtype: 'toolbar',
xtype: 'panel',
id: 'sub_panel12',
layout: { type: 'vbox', align: 'right' },
flex: 5,
border: 0,
items: [
{
xtype: 'button',
id: 'sub_btn_Show',
hidden: true,
flex: 2,
border: 1,
text: '資料顯示', //sub2
iconCls: 'icon-search',
handler: function () {
//--> 需改為將 TMNO 的[AMM_TMDWG]資料加入 store
var np = {};
np["sub_BRP"] = Ext.getCmp("sub_BRP").getValue();
np["sub_TMNO"] = Ext.getCmp("sub_TMNO").getValue();
//console.log('np:', np);
Ext.getCmp('sub_Grid').store.getProxy().url = '../api/V120402API/getsubData';
Ext.getCmp('sub_Grid').store.getProxy().extraParams = np; //分頁OK,篩選條件OK
Ext.getCmp('sub_Grid').store.clearOnPageLoad = false;
Ext.getCmp('sub_Grid').reloadGridData();
}
}, // end of 顯示資料
{
xtype: 'button',
id: 'sub_btn_Add',
flex: 2,
border: 1,
text: '加入資料', //sub_btn_Add
iconCls: 'icon-search',
hidden: true, //隱藏不顯示 [加入資料]鈕
handler: function () {
//--> 需改為將 TMNO 的[AMM_TMDWG]資料加入 store
console.log("insider handler of sub_btn_Add");
var np = {};
np["sub_BRP"] = Ext.getCmp("sub_BRP").getValue();
np["sub_TMNO"] = Ext.getCmp("sub_TMNO").getValue();
var is_Ok = true;
//console.log('np:', np);
//Ext.getCmp('sub_Grid').store.getProxy().url = '../api/V120402API/getsubData';
//Ext.getCmp('sub_Grid').store.getProxy().extraParams = np; //分頁OK,篩選條件OK
//Ext.getCmp('sub_Grid').reloadGridData();
Ext.Ajax.request({
method: "POST",
url: '../../api/V120402API/get_sub_data1',
params: np,
async: false,
success: function (response, opts) {
console.log("0 response.responseText=", response.responseText);
var Tmp_Obj = Ext.decode(response.responseText);
console.log("1 Tmp_Obj=", Tmp_Obj);
if (Tmp_Obj["success"] == true) {
//var Tmp_Rtn_Msg = "借閱人(" + np["sub_BRP"] + ")條碼編號(" + np["sub_TMNO"] + ")的資料取得(AMM_TMDWG)成功<br>";
//mysuccessalert(Tmp_Rtn_Msg);
console.log("1 Tmp_Obj[Rtn_Msg]:", Tmp_Obj["Rtn_Msg"]);
isOk = true;
var Tmp_recs = Ext.decode(Tmp_Obj["Rtn_Msg"]);
console.log("Tmp_recs:", Tmp_recs);
console.log("Tmp_recs.length:", Tmp_recs.length);
var Tmp_rec;
for (i = 0; i < Tmp_recs.length; i++) {
console.log("1 Tmp_rec:", Tmp_rec);
Tmp_rec = Tmp_recs[i];
console.log("Tmp_rec:", Tmp_rec);
if (Ext.getCmp("sub_Grid").store.find("TMNO", Tmp_rec["TMNO"]) == -1)
Ext.getCmp("sub_Grid").store.add(Tmp_rec);
//2022/08/24 若已加入,則不顯示訊息
//else
//mywarnalert("條碼編號(" + Tmp_rec["TMNO"].toString() + ")已加入,不可重複加入<br>");
} // for (i=0;i<)
}
if (Tmp_Obj["success"] == false) {
console.log(" false , Tmp_Obj[Rtn_Msg]", Tmp_Obj["Rtn_Msg"]);
var Tmp_Rtn_Msg = "借閱人(" + np["sub_BRP"] + ")條碼編號(" + np["sub_TMNO"] + ")的資料錯誤訉息如下:<br>"
+ Tmp_Obj["Rtn_Msg"];
mywarnalert(Tmp_Rtn_Msg);
isOk = false;
}
}, //end of success
failure: function (response, opts) {
var Tmp_Obj = Ext.decode(response.responseText);
var Tmp_Rtn_Msg = "借閱人(" + np["sub_BRP"] + ")條碼編號(" + np["sub_TMNO"] + ")的資料錯誤訊息如下:<br>"
+ Tmp_Obj["Rtn_Msg"];
mywarnalert(Tmp_Rtn_Msg);
isOk = false;
}
}) //end of Ext.Ajax.Request
return isOk;
} // end of handler of sub_btn_Add
},// end of button sub_btn_Add , 加入資料
{
xtype: 'label',
id: 'sub_btn_label',
flex: 2,
},
]
} //end of sub_panel12
]
}, //end of panel1
{
xtype: 'panel',
id: 'sub_panel2',
//title: 'sub_panel2',
region: 'center',
layout: 'fit',
//flex: 60,
//border: 20,
items: [sub_Grid]
},
] // end of layout: "vbox", padding: "5", items: [
} //end of my_Sub2 , items[{
] //end of my_Sub2 , items[
Ext.getCmp('sub_Grid').store.on("load", function (me, records, successful, eOpts) {
if (successful) {
console.log("Ext.getCmp('sub_Grid').store", Ext.getCmp('sub_Grid').store);
console.log("Ext.getCmp('sub_Grid').store.data", Ext.getCmp('sub_Grid').store.data);
}
}
);
console.log("sub_Grid:", sub_Grid);
var win = getMyWindow("借閱登記", sub_LendFlds, sub_LendFlds_Btns);
win.setWidth(600);
win.setHeight(400);
win.show();
Ext.getCmp('sub_Grid_ptb').hide();
console.log("step6");
} // end of function LendBtn_click() {
沒有留言:
張貼留言