352 lines
15 KiB
JavaScript
352 lines
15 KiB
JavaScript
function CreateReceiptSearchApp() {
|
|
const loadMarker = document.getElementById('receiptSearchApp');
|
|
if (loadMarker) {
|
|
DoCreateReceiptSearchApp();
|
|
}
|
|
}
|
|
|
|
function DoCreateReceiptSearchApp() {
|
|
window.__vms = window.__vms || {}
|
|
|
|
if (window.__vms.receiptSearchApp)
|
|
return;
|
|
|
|
console.log('Create receiptSearchApp');
|
|
|
|
window.__vms.receiptSearchApp = new Vue({
|
|
el: '#receiptSearchApp',
|
|
mixins: [DateMixin, ToastMixin, ApiMixin],
|
|
data: {
|
|
searchParams: {
|
|
計畫代號: '',
|
|
計畫名稱: '',
|
|
活動日期_1: '',
|
|
活動日期_2: '',
|
|
身分別: '',
|
|
講師_非講師編號: '',
|
|
憑證類別: '',
|
|
活動類別: '',
|
|
付款方式: ''
|
|
},
|
|
dropdown: {
|
|
身分別: [],
|
|
憑證類別: [],
|
|
付款方式: []
|
|
},
|
|
dataList: [],
|
|
selectedItems: [],
|
|
selectAll: false,
|
|
currentPage: 1,
|
|
pageSize: 20,
|
|
totalCount: 0,
|
|
totalPages: 0,
|
|
loading: false
|
|
},
|
|
created() {
|
|
// 從 AJAX 取得查詢用下拉選單資料
|
|
this.loadSearchDropdownLists();
|
|
|
|
// 取回保存的查詢條件
|
|
this.searchParams.計畫代號 = document.getElementById('ctl00_ContentPlaceHolder1_hid計畫代號').value;
|
|
this.searchParams.計畫名稱 = document.getElementById('ctl00_ContentPlaceHolder1_hid計畫名稱').value;
|
|
this.searchParams.活動日期_1 = document.getElementById('ctl00_ContentPlaceHolder1_hid活動日期_1').value;
|
|
this.searchParams.活動日期_2 = document.getElementById('ctl00_ContentPlaceHolder1_hid活動日期_2').value;
|
|
this.searchParams.身分別 = document.getElementById('ctl00_ContentPlaceHolder1_hid身分別').value;
|
|
this.searchParams.憑證類別 = document.getElementById('ctl00_ContentPlaceHolder1_hid憑證類別').value;
|
|
this.searchParams.活動類別 = document.getElementById('ctl00_ContentPlaceHolder1_hid活動類別').value;
|
|
this.searchParams.付款方式 = document.getElementById('ctl00_ContentPlaceHolder1_hid付款方式').value;
|
|
this.currentPage = 1 * document.getElementById('ctl00_ContentPlaceHolder1_hidCurrentPage').value || 1;
|
|
this.pageSize = 1 * document.getElementById('ctl00_ContentPlaceHolder1_hidPageSize').value || 20;
|
|
},
|
|
computed: {
|
|
displayPages() {
|
|
const pages = [];
|
|
const start = Math.max(1, this.currentPage - 2);
|
|
const end = Math.min(this.totalPages, this.currentPage + 2);
|
|
for (let i = start; i <= end; i++) {
|
|
pages.push(i);
|
|
}
|
|
return pages;
|
|
}
|
|
},
|
|
mounted() {
|
|
this.search();
|
|
},
|
|
methods: {
|
|
async loadSearchDropdownLists() {
|
|
this.dropdown.身分別 = await this.loadSearchDropdownList("身分別");
|
|
this.dropdown.憑證類別 = await this.loadSearchDropdownList("憑證類別");
|
|
this.dropdown.付款方式 = await this.loadSearchDropdownList("付款方式");
|
|
},
|
|
async loadSearchDropdownList(key) {
|
|
try {
|
|
const result = await this.callApiWithErrorMsg(
|
|
'領據處理',
|
|
'GetSearchDropdownLists',
|
|
{ key: key },
|
|
'載入下拉選單'
|
|
);
|
|
return result.Data || [];
|
|
}
|
|
catch(error) {
|
|
console.error('載入下拉選單失敗:', error);
|
|
return [];
|
|
}
|
|
},
|
|
|
|
clearSearch() {
|
|
this.searchParams.計畫代號 = '';
|
|
this.searchParams.計畫名稱 = '';
|
|
this.searchParams.活動日期_1 = '';
|
|
this.searchParams.活動日期_2 = '';
|
|
this.searchParams.身分別 = '';
|
|
this.searchParams.憑證類別 = '';
|
|
this.searchParams.活動類別 = '';
|
|
this.searchParams.付款方式 = '';
|
|
this.search();
|
|
},
|
|
|
|
async search() {
|
|
this.loading = true;
|
|
|
|
const params = {
|
|
pageIndex: this.currentPage,
|
|
pageSize: parseInt(this.pageSize),
|
|
活動日期_1: this.searchParams.活動日期_1 || null,
|
|
活動日期_2: this.searchParams.活動日期_2 || null,
|
|
身分別: this.searchParams.身分別 || null,
|
|
講師_非講師編號: this.searchParams.講師_非講師編號 || null,
|
|
憑證類別: this.searchParams.憑證類別 || null,
|
|
計畫代號: this.searchParams.計畫代號 || null,
|
|
計畫名稱: this.searchParams.計畫名稱 || null,
|
|
活動類別: this.searchParams.活動類別 || null,
|
|
付款方式: this.searchParams.付款方式 || null,
|
|
orderBy: ''
|
|
};
|
|
|
|
// 保存查詢條件
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid計畫代號').value = params.計畫代號;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid計畫名稱').value = params.計畫名稱;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid活動日期_1').value = params.活動日期_1;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid活動日期_2').value = params.活動日期_2;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid身分別').value = params.身分別;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid憑證類別').value = params.憑證類別;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid活動類別').value = params.活動類別;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid付款方式').value = params.付款方式;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hidCurrentPage').value = this.currentPage;
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hidPageSize').value = this.pageSize;
|
|
|
|
try {
|
|
let value = null;
|
|
const result = await this.callApiWithErrorMsg(
|
|
'領據處理',
|
|
'SelectPage',
|
|
params,
|
|
'查詢'
|
|
);
|
|
// 使用 ConvertDatesInObject 自動轉換日期
|
|
this.dataList = this.ConvertDatesInObject(result.Data || [], '-');
|
|
this.totalCount = result.TotalCount;
|
|
this.totalPages = Math.ceil(this.totalCount / this.pageSize);
|
|
this.selectedItems = [];
|
|
this.selectAll = false;
|
|
}
|
|
catch (error) {
|
|
console.error('查詢失敗:', error);
|
|
}
|
|
finally {
|
|
this.loading = false;
|
|
};
|
|
},
|
|
|
|
searchButtonClick()
|
|
{
|
|
this.currentPage = 1;
|
|
this.search();
|
|
},
|
|
|
|
changePage(page) {
|
|
if (page >= 1 && page <= this.totalPages) {
|
|
this.currentPage = page;
|
|
this.search();
|
|
}
|
|
},
|
|
|
|
toggleSelectAll() {
|
|
if (this.selectAll) {
|
|
this.selectedItems = [...this.dataList];
|
|
} else {
|
|
this.selectedItems = [];
|
|
}
|
|
},
|
|
|
|
addNew() {
|
|
// 切換到領據登錄與修改分頁
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid編號').value = '';
|
|
window.__doPostBack('ctl00$ContentPlaceHolder1$btnTab2', '');
|
|
},
|
|
|
|
edit(編號) {
|
|
// 切換到領據登錄與修改分頁，並進入該行資料的修改
|
|
document.getElementById('ctl00_ContentPlaceHolder1_hid編號').value = 編號;
|
|
window.__doPostBack('ctl00$ContentPlaceHolder1$btnTab2', '');
|
|
},
|
|
|
|
async printSelected() {
|
|
if (this.selectedItems.length === 0) {
|
|
this.ShowWarning('請選擇要列印的領據');
|
|
return;
|
|
}
|
|
|
|
this.loading = true;
|
|
try {
|
|
const idList = this.selectedItems.map(item => item.編號);
|
|
|
|
const result = await this.callApiWithErrorMsg(
|
|
'領據處理',
|
|
'Print',
|
|
{ idList: idList },
|
|
'列印領據'
|
|
);
|
|
|
|
if (result.Success) {
|
|
// 下載 Excel 檔案
|
|
if (result.Data && result.Data.fileName) {
|
|
const link = document.createElement('a');
|
|
link.href = `data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,${result.Data.excelData}`;
|
|
link.download = result.Data.fileName;
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
document.body.removeChild(link);
|
|
|
|
this.ShowSuccess(result.Message);
|
|
} else {
|
|
this.ShowWarning(result.Message);
|
|
}
|
|
} else
|
|
{
|
|
this.ShowError('列印失敗: ' + (error.message || '請稍後重試'));
|
|
}
|
|
|
|
// 列印完成後，刷新列表
|
|
this.search();
|
|
} catch (error) {
|
|
this.ShowError('列印失敗: ' + (error.message || '請檢查網路連線'));
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
},
|
|
|
|
async doExport() {
|
|
if (this.dataList.length === 0) {
|
|
this.ShowWarning('請先查詢再匯出');
|
|
return;
|
|
}
|
|
|
|
this.loading = true;
|
|
try {
|
|
const idList = this.selectedItems.map(item => item.編號);
|
|
|
|
const params = {
|
|
活動日期_1: this.searchParams.活動日期_1 || null,
|
|
活動日期_2: this.searchParams.活動日期_2 || null,
|
|
身分別: this.searchParams.身分別 || null,
|
|
講師_非講師編號: this.searchParams.講師_非講師編號 || null,
|
|
憑證類別: this.searchParams.憑證類別 || null,
|
|
計畫代號: this.searchParams.計畫代號 || null,
|
|
計畫名稱: this.searchParams.計畫名稱 || null,
|
|
活動類別: this.searchParams.活動類別 || null,
|
|
付款方式: this.searchParams.付款方式 || null,
|
|
orderBy: ''
|
|
};
|
|
|
|
const result = await this.callApiWithErrorMsg(
|
|
'領據處理',
|
|
'Export',
|
|
params,
|
|
'領據匯出'
|
|
);
|
|
|
|
// 下載 Excel 檔案
|
|
if (result.Data && result.Data.fileName) {
|
|
const link = document.createElement('a');
|
|
link.href = `data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,${result.Data.excelData}`;
|
|
link.download = result.Data.fileName;
|
|
document.body.appendChild(link);
|
|
link.click();
|
|
document.body.removeChild(link);
|
|
|
|
this.ShowSuccess('匯出完成');
|
|
} else {
|
|
this.ShowError('匯出失敗，沒有檔案內容');
|
|
}
|
|
} catch (error) {
|
|
this.ShowError('匯出失敗: ' + (error.message || '請檢查網路連線'));
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
},
|
|
|
|
//async voidSelected() {
|
|
// if (this.selectedItems.length === 0) {
|
|
// this.ShowWarning('請選擇要作廢的領據');
|
|
// return;
|
|
// }
|
|
// if (!confirm('確定要作廢/取消作廢選取的領據嗎？')) {
|
|
// return;
|
|
// }
|
|
|
|
// this.loading = true;
|
|
// try {
|
|
// // 並行調用多個 API
|
|
// const promises = this.selectedItems.map(item => {
|
|
// return this.callApi('領據處理', 'Void', {
|
|
// no: item.編號,
|
|
// dbAppNo: item.DB_APPNO
|
|
// });
|
|
// });
|
|
|
|
// await Promise.all(promises);
|
|
// this.ShowSuccess('作廢操作完成');
|
|
// this.search();
|
|
// } catch (error) {
|
|
// console.error('Void error:', error);
|
|
// this.ShowError('作廢操作失敗: ' + (error.message || '請檢查網路連線'));
|
|
// } finally {
|
|
// this.loading = false;
|
|
// }
|
|
//},
|
|
|
|
//async deleteSelected() {
|
|
// if (this.selectedItems.length === 0) {
|
|
// this.ShowWarning('請選擇要刪除的領據');
|
|
// return;
|
|
// }
|
|
// if (!confirm('確定要刪除選取的領據嗎？此操作無法復原！')) {
|
|
// return;
|
|
// }
|
|
|
|
// this.loading = true;
|
|
// try {
|
|
// // 並行調用多個 API
|
|
// const promises = this.selectedItems.map(item => {
|
|
// return this.callApi('領據處理', 'Delete', {
|
|
// no: item.編號,
|
|
// dbAppNo: item.DB_APPNO
|
|
// });
|
|
// });
|
|
|
|
// await Promise.all(promises);
|
|
// this.ShowSuccess('刪除完成');
|
|
// this.search();
|
|
// } catch (error) {
|
|
// console.error('Delete error:', error);
|
|
// this.ShowError('刪除失敗: ' + (error.message || '請檢查網路連線'));
|
|
// } finally {
|
|
// this.loading = false;
|
|
// }
|
|
//}
|
|
}
|
|
});
|
|
}
|