EnChia
aa5941a324
2. 修改報名記錄中的活動開始結束時間 3. 修正列印問題 4. 信眾資料及報名管理起始不會出現資料 5. 信眾不得重複報名相同活動 6. 信眾資料的 cache（含結果與搜尋條件） 7. 修復信眾、活動、品項刪除功能 8. 增加自訂是否自動編號 9. 優化信眾資料頁面（彈出查詢頁面、顯示剛新增資料） 10. 新增管理表單匯出 excel 功能 11. 無查詢資料時不可點選匯出／列印按鈕 12. 匯出／列印管理報表時，若無資料則顯示提示 13. 新增信眾資料時，加入日期預設為今日
749 lines
37 KiB
Plaintext
749 lines
37 KiB
Plaintext
<%@ Page Title="後端管理" Language="C#" MasterPageFile="~/admin/Templates/TBS5ADM001/MasterPage.master" AutoEventWireup="true" EnableEventValidation="false" CodeFile="index.aspx.cs" Inherits="admin_follower_index" %>
|
||
<%@ Register Src="~/admin/_uc/alert.ascx" TagPrefix="uc1" TagName="alert" %>
|
||
<asp:Content ID="Content1" ContentPlaceHolderID="page_header" runat="Server">
|
||
</asp:Content>
|
||
<asp:Content ID="Content3" ContentPlaceHolderID="page_nav" runat="Server">
|
||
<div class="mb-2 mb-sm-0">
|
||
<a href="reg.aspx" class="btn btn-primary">
|
||
<i class="mdi mdi-plus"></i>新增
|
||
</a>
|
||
<a @click="deleteAll" class="btn btn-outline-danger" title="刪除勾選的資料" ><i class="mdi mdi-trash-can"></i> 刪除勾選</a>
|
||
</div>
|
||
<div class="">
|
||
<a @click="print_dialog.show=true" class="btn btn-outline-primary btn-print" target="_blank">
|
||
<i class="mdi mdi-printer"></i>列印管理報表
|
||
</a>
|
||
<a @click="goPrint" class="btn btn-outline-primary btn-print" :class="{ 'disabled': data_table.list.length === 0 }" target="_blank">
|
||
<i class="mdi mdi-printer"></i>列印查詢資料
|
||
</a>
|
||
<div :style="data_table.list.length === 0 ? 'pointer-events: none; opacity: 0.5;' : ''" style="display:inline-block;">
|
||
<asp:LinkButton ID="excel" runat="server" CssClass="btn btn-outline-success" OnClick="export_Click"><span class="fa-solid fa-file-excel"></span> 匯出查詢資料（Excel）</asp:LinkButton>
|
||
</div>
|
||
</div>
|
||
</asp:Content>
|
||
<asp:Content ID="Content5" ContentPlaceHolderID="footer_script" runat="Server">
|
||
<script>
|
||
Vue.filter('timeString', function (value, myFormat) {
|
||
return value == null || value == "" ? "" : moment(value).format(myFormat || 'YYYY-MM-DD, HH:mm:ss');
|
||
});
|
||
let VueApp = new Vue({
|
||
el: '#app',
|
||
vuetify: new Vuetify(vuetify_options),
|
||
data() {
|
||
return {
|
||
isSearched: false,
|
||
print_error_msg: '',
|
||
options: { multiSort: false },
|
||
search_options: { multiSort: false },
|
||
data_table: {
|
||
loading: true,
|
||
list: [],
|
||
selected: [],
|
||
singleSelect: false,
|
||
count: 0,
|
||
page: 1,
|
||
pageSize: 10,
|
||
header: [
|
||
{ text: '信眾編號', value: 'f_number', align: 'start' },
|
||
{ text: '信眾姓名', value: 'u_name' },
|
||
{ text: '身分別', value: 'identity_type_desc' },
|
||
{ text: '性別', value: 'sex' },
|
||
{ text: '生日', value: 'birthday' },
|
||
{ text: '報名記錄', value: 'order_record' },
|
||
{ text: '', value: 'slot', sortable: false },
|
||
{ text: '', value: 'slot_btn', sortable: false, align: 'end' },
|
||
],
|
||
footer: {
|
||
showFirstLastPage: true,
|
||
pageSizeOptions: [5, 10, 20, 30],
|
||
},
|
||
},
|
||
search: {
|
||
f_number: '',
|
||
u_name: '',
|
||
sex: '',
|
||
//birthday: new Date().toISOString().split('T')[0],
|
||
//birthday2: new Date().toISOString().split('T')[0]
|
||
birthday: '',
|
||
birthday2: '',
|
||
address: '',
|
||
country: '',
|
||
country2: '',
|
||
phone_idcode: '', // 電話/證號搜尋
|
||
/*注意這邊的參數不能跟下方print_search重複*/
|
||
},
|
||
//列印管理報表
|
||
print_conditions: 'yy',
|
||
print_search: {
|
||
year: '',
|
||
month: '',
|
||
season: '',
|
||
},
|
||
select_items: {
|
||
month: [{
|
||
text: "請選擇",
|
||
val: 0
|
||
},],
|
||
season: [{
|
||
text: "請選擇",
|
||
val: 0
|
||
},],
|
||
},
|
||
print_dialog: {
|
||
show: false,
|
||
},
|
||
//國籍
|
||
search_dialog: {
|
||
controls: {
|
||
search1: {
|
||
id: 'search1',
|
||
title: '國籍',
|
||
text_prop: 'name_zh',
|
||
value_prop: 'id',
|
||
keys: [
|
||
{ id: 'keyword', title: '關鍵字' },
|
||
],
|
||
api_url: HTTP_HOST + 'api/country/GetList',
|
||
columns: [
|
||
{ id: 'id', title: '代碼' },
|
||
{ id: 'name_en', title: '英文短名稱' },
|
||
{ id: 'name_zh', title: '中文名稱' },
|
||
],
|
||
selected: {},
|
||
select(item, t) {
|
||
//console.log("select search1", t);
|
||
t.search.country = item.id;
|
||
t.search.country2 = '';
|
||
}
|
||
},
|
||
|
||
}, show: false,
|
||
current: {},
|
||
list: [],
|
||
count: 0,
|
||
page: 1,
|
||
loading: false,
|
||
footer: {
|
||
showFirstLastPage: true,
|
||
disableItemsPerPage: true,
|
||
itemsPerPageAllText: '',
|
||
itemsPerPageText: '',
|
||
},
|
||
},
|
||
|
||
}
|
||
},
|
||
watch: {
|
||
options: {
|
||
handler() {
|
||
if (this.isSearched) {
|
||
this.getList()
|
||
}
|
||
else {
|
||
this.data_table.loading = false;
|
||
}
|
||
},
|
||
deep: true,
|
||
},
|
||
search_options: {
|
||
handler() {
|
||
this.search_get()
|
||
},
|
||
deep: true,
|
||
}
|
||
}, mounted() {
|
||
const printResult = document.getElementById('<%= hid_err_msg.ClientID %>').value;
|
||
document.getElementById('<%= hid_err_msg.ClientID %>').value = '';
|
||
window._printResult = printResult
|
||
|
||
this.search_dialog.current = this.search_dialog.controls.search1 ///default
|
||
this.initPrintSearch();
|
||
|
||
const navEntries = performance.getEntriesByType("navigation");
|
||
const isReload = navEntries.length > 0 && navEntries[0].type === "reload";
|
||
|
||
const url = new URL(window.location.href);
|
||
let params = url.searchParams;
|
||
if (params.get('dirty') === '1') { // 資料有更新時執行 getlist
|
||
this.search = JSON.parse(sessionStorage.getItem("member_query_params"));
|
||
this.getList();
|
||
|
||
params.delete('dirty');
|
||
window.history.replaceState({}, '', url.pathname + url.search);
|
||
}
|
||
|
||
if (isReload) {
|
||
sessionStorage.removeItem("followerpage");
|
||
sessionStorage.removeItem("member_list_cache");
|
||
sessionStorage.removeItem("member_query_params");
|
||
}
|
||
else if ("<%=lastAddedID%>" !== "") {
|
||
const newQuery = { f_number: '<%=lastAddedID%>' };
|
||
sessionStorage.setItem('member_query_params', JSON.stringify(newQuery));
|
||
this.search = newQuery;
|
||
this.isSearched = true;
|
||
}
|
||
else {
|
||
const savedPage = parseInt(sessionStorage.getItem('followerpage'));
|
||
const savedData = sessionStorage.getItem("member_list_cache");
|
||
const savedQuery = JSON.parse(sessionStorage.getItem("member_query_params"));
|
||
if (savedQuery) {
|
||
this.search = savedQuery;
|
||
this.isSearched = true;
|
||
}
|
||
if (savedPage) {
|
||
this.options.page = savedPage;
|
||
}
|
||
if (savedData && savedData !== "undefined") {
|
||
this.data_table = JSON.parse(savedData);
|
||
this.isSearched = true;
|
||
}
|
||
}
|
||
|
||
//if (params.has('year')) {
|
||
// this.print_search.year = parseInt(params.get('year'));
|
||
// this.print_dialog.show = true;
|
||
//}
|
||
//if (params.has('month')) {
|
||
// this.print_search.month = parseInt(params.get('month'));
|
||
// this.print_dialog.show = true;
|
||
//}
|
||
//if (params.has('season')) {
|
||
// this.print_search.season = parseInt(params.get('season'));
|
||
// this.print_dialog.show = true;
|
||
//}
|
||
//if (params.has('mode')) {
|
||
// this.print_conditions = params.get('mode');
|
||
// this.print_dialog.show = true;
|
||
//}
|
||
|
||
if (printResult === 'nodata' || printResult === 'success') {
|
||
this.$nextTick(() => {
|
||
this.print_search.year = parseInt(document.getElementById('<%= hid_print_year.ClientID %>').value) || this.print_search.year;
|
||
this.print_search.month = parseInt(document.getElementById('<%= hid_print_month.ClientID %>').value) || this.print_search.month;
|
||
this.print_search.season = parseInt(document.getElementById('<%= hid_print_season.ClientID %>').value) || this.print_search.season;
|
||
this.print_conditions = document.getElementById('<%= hid_print_mode.ClientID %>').value || 'yy';
|
||
this.print_dialog.show = true;
|
||
if (printResult === 'nodata') {
|
||
this.print_error_msg = "查無資料，請重新選擇區間";
|
||
}
|
||
});
|
||
}
|
||
this.$nextTick(() => {
|
||
setTimeout(() => {
|
||
['year', 'month', 'season', 'mode', 'msg'].forEach(p => params.delete(p));
|
||
window.history.replaceState({}, '', url.pathname + url.search);
|
||
}, 100);
|
||
});
|
||
},
|
||
methods: {
|
||
triggerManagementExport(mode) {
|
||
this.print_dialog.show = false;
|
||
this.print_error_msg = "";
|
||
if (this.print_search.year == '') {
|
||
msgbox('請輸入年份');
|
||
return;
|
||
}
|
||
|
||
document.getElementById('<%= hid_print_mode.ClientID %>').value = this.print_conditions;
|
||
document.getElementById('<%= hid_print_year.ClientID %>').value = this.print_search.year;
|
||
if (this.print_conditions == 'mm') {
|
||
document.getElementById('<%= hid_print_month.ClientID %>').value = this.print_search.month;
|
||
}
|
||
else if (this.print_conditions == 'ss') {
|
||
document.getElementById('<%= hid_print_season.ClientID %>').value = this.print_search.season;
|
||
}
|
||
|
||
if (mode === 'print') {
|
||
const printWindow = window.open('about:blank', '列印信眾資料');
|
||
document.getElementById('<%= print_management.ClientID %>').click();
|
||
}
|
||
else if (mode === "excel") {
|
||
document.getElementById('<%= excel_management.ClientID %>').click();
|
||
}
|
||
},
|
||
search_show(curr) {
|
||
//console.log("btn_click:", curr, curr.api_url);
|
||
this.search_dialog.current = curr;
|
||
this.search_clear()
|
||
//this.search_get()//清除完自動會重抓, 故取消
|
||
this.search_dialog.show = true;
|
||
},
|
||
search_clear() {
|
||
if (!this.search_dialog.current.keys) return;
|
||
this.search_dialog.current.keys.forEach((t, i) => { t.value = '' })
|
||
this.search_get()
|
||
},
|
||
search_get() {
|
||
if (!this.search_dialog.current.keys) return;
|
||
let api_url = this.search_dialog.current.api_url;
|
||
let keys = this.search_dialog.current.keys;
|
||
//const { page, itemsPerPage } = this.options
|
||
//const { sortBy, sortDesc, page, itemsPerPage } = this.options
|
||
this.search_dialog.page = this.search_options.page ?? 1
|
||
let params = { page: this.search_dialog.page, pageSize: 10 };//url params
|
||
var search = {};//post body
|
||
keys.forEach((t, i) => {
|
||
search[t.id] = t.value;
|
||
});
|
||
//necessary parameter===
|
||
|
||
|
||
console.log("search_get", api_url, search, params, this.search_options);
|
||
this.search_dialog.loading = true
|
||
axios.post(api_url, search, { params: params })
|
||
.then(response => {
|
||
this.search_dialog.list = response.data.list
|
||
this.search_dialog.count = response.data.count
|
||
this.search_dialog.loading = false
|
||
})
|
||
.catch(error => {
|
||
console.log(error)
|
||
this.search_dialog.list = []
|
||
this.search_dialog.count = 0
|
||
this.search_dialog.loading = false
|
||
this.snackbar.text = "錯誤:" + error
|
||
this.snackbar.show = true
|
||
})
|
||
},
|
||
search_headers() {
|
||
if (!this.search_dialog.current.columns) return;
|
||
r = [];
|
||
this.search_dialog.current.columns.forEach((t, i) => {
|
||
r.push({
|
||
text: t.title,
|
||
align: 'start',
|
||
sortable: false,
|
||
value: t.id,
|
||
})
|
||
})
|
||
return r
|
||
},
|
||
search_select(row) {
|
||
let curr = this.search_dialog.current;
|
||
let target = $(`[data-search-control=${curr.id}]`);
|
||
curr.selected = row;
|
||
target.children("input.search-text").val(curr.selected[curr.text_prop])//text
|
||
target.children("input:hidden").val(curr.selected[curr.value_prop])//value
|
||
if (curr.select instanceof Function) {
|
||
curr.select(row, this);
|
||
}
|
||
this.search_dialog.show = false;
|
||
//console.log(row, row["u_name"], row["f_number"], curr.id, target);
|
||
},
|
||
getList(clearpage = false) {
|
||
console.log("do getlist")
|
||
const { sortBy, sortDesc, page, itemsPerPage } = this.options
|
||
const params = {
|
||
sortBy: sortBy[0], sortDesc: sortDesc[0],
|
||
page: clearpage ? '1' : page, pageSize: itemsPerPage
|
||
};
|
||
sessionStorage.setItem('followerpage', page);
|
||
this.data_table.loading = true
|
||
axios
|
||
.post(HTTP_HOST + 'api/follower/GetList', this.search, { params: params })
|
||
.then(response => {
|
||
this.data_table.list = response.data.list
|
||
this.data_table.count = response.data.count;
|
||
this.data_table.loading = false
|
||
|
||
const dataToStore = JSON.stringify(this.data_table);
|
||
sessionStorage.setItem("member_list_cache", dataToStore);
|
||
})
|
||
.catch(
|
||
error => console.log(error)
|
||
)
|
||
},
|
||
getDataFromApi() {
|
||
},
|
||
editItem(item) {
|
||
console.log("edit", item);
|
||
//this.editedIndex = this.desserts.indexOf(item)
|
||
//this.editedItem = Object.assign({}, item)
|
||
//this.dialog = true
|
||
},
|
||
deleteItem(item) {
|
||
//this.editedIndex = this.list.indexOf(item)
|
||
//this.editedItem = Object.assign({}, item)
|
||
//this.dialogDelete = true
|
||
if (confirm('是否確定刪除此筆資料?')) {
|
||
const index = this.data_table.list.indexOf(item)
|
||
if (index != -1) {
|
||
axios
|
||
.delete(HTTP_HOST + 'api/follower/Delete/' + item.num)
|
||
.then(response => {
|
||
this.getList();
|
||
})
|
||
.catch(error => console.log(error))
|
||
}
|
||
}
|
||
},
|
||
deleteAll() {
|
||
if (confirm('是否確定刪除已勾選的資料?')) {
|
||
axios
|
||
.delete(HTTP_HOST + 'api/follower/Delete/' + this.data_table.selected.map(x => x.num))
|
||
.then(response => {
|
||
//console.log("delAll");
|
||
//for (var i = 0; i < this.data_table.selected.length; i++) {
|
||
// const index = this.data_table.list.indexOf(this.data_table.selected[i]);
|
||
// this.data_table.list.splice(index, 1);
|
||
//}
|
||
//this.data_table.selected = [];
|
||
//this.data_table.count = this.data_table.list.length
|
||
//location.reload();
|
||
this.getList();
|
||
})
|
||
.catch(error => console.log(error))
|
||
}
|
||
},
|
||
btn_search() {
|
||
isSearched = true;
|
||
sessionStorage.setItem("member_query_params", JSON.stringify(this.search));
|
||
this.getList(true)
|
||
bootstrap.Offcanvas.getInstance(document.getElementById("offcanvasRight")).hide()
|
||
},
|
||
btn_all() {
|
||
isSearched = false;
|
||
clearObjProps(this.search);
|
||
sessionStorage.setItem("member_query_params", JSON.stringify(this.search));
|
||
//this.btn_search()
|
||
},
|
||
goPrint() {
|
||
//debugger;
|
||
let _qry = "";
|
||
Object.keys(this.search).forEach(key => {
|
||
//console.log(`${key}: ${this.search[key]}`);
|
||
if (this.search[key] != undefined && this.search[key] != null && this.search[key] != '') {
|
||
_qry += (_qry != '' ? '&' : '?') + (key + '=' + this.search[key]);
|
||
}
|
||
});
|
||
window.open("print.aspx" + _qry, '_blank');
|
||
},
|
||
//列印管理報表
|
||
print_close() {
|
||
this.print_dialog.show = false;
|
||
this.print_error_msg = "";
|
||
}
|
||
,
|
||
initPrintSearch() {
|
||
//下拉選單
|
||
for (let i = 1; i <= 12; i++) {
|
||
var _tmp = {
|
||
text: i,
|
||
val:i,
|
||
}
|
||
this.select_items.month.push(_tmp);
|
||
}
|
||
for (let i = 1; i <= 4; i++) {
|
||
var _tmp = {
|
||
text: i,
|
||
val: i,
|
||
}
|
||
this.select_items.season.push(_tmp);
|
||
}
|
||
|
||
//預設值
|
||
const Today = new Date();//現在日期時間
|
||
const first_date = new Date(Today.getFullYear(), Today.getMonth(), 1); //本月第一天
|
||
const last_month_date = new Date(first_date - 1); //上個月最後一天
|
||
|
||
this.print_search.year = last_month_date.getFullYear();
|
||
this.print_search.month = last_month_date.getMonth() + 1 //預設上個月的年份
|
||
|
||
let _season = 1;
|
||
const _month = first_date.getMonth() + 1; //本月
|
||
if (_month >= 1 && _month <= 3) {
|
||
_season = 4;
|
||
} else if (_month >= 4 && _month <= 6) {
|
||
_season = 1;
|
||
} else if (_month >= 7 && _month <= 9) {
|
||
_season = 2;
|
||
} else if (_month >= 10 && _month <= 12) {
|
||
_season = 3;
|
||
}
|
||
this.print_search.season = _season; //預設上一季
|
||
//this.print_search.season = 0;
|
||
},
|
||
goPrint2() {
|
||
if (this.print_search.year != '') {
|
||
//let _qry = "";
|
||
//Object.keys(this.print_search).forEach(key => {
|
||
// if (this.print_search[key] != undefined && this.print_search[key] != null && this.print_search[key] != '') {
|
||
// _qry += (_qry != '' ? '&' : '?') + (key + '=' + this.print_search[key]);
|
||
// }
|
||
//});
|
||
|
||
let _qry = "?year=" + this.print_search.year;
|
||
if (this.print_conditions == 'mm') {
|
||
_qry += "&month=" + this.print_search.month;
|
||
} else if (this.print_conditions == 'ss') {
|
||
_qry += "&season=" + this.print_search.season;
|
||
}
|
||
|
||
this.print_dialog.show = false;
|
||
window.open("print.aspx" + _qry, '_blank');
|
||
}else{
|
||
msgbox('請輸入年份');
|
||
}
|
||
|
||
},
|
||
//
|
||
countryChange() {
|
||
this.search.country = '';
|
||
$('#country_txt').val('')
|
||
},
|
||
|
||
},
|
||
computed: {
|
||
pageCount() {
|
||
return Math.ceil(this.data_table.count / this.data_table.pageSize)
|
||
},
|
||
},
|
||
})
|
||
|
||
document.getElementById("<%= s_country.ClientID %>").addEventListener("click", function () {
|
||
$('#country2').val('');
|
||
VueApp.search.country2 = '';
|
||
});
|
||
|
||
$(document).ready(function () {
|
||
// 判斷是否彈出 search dialog
|
||
let hasSearchResult = sessionStorage.getItem("member_list_cache") !== null;
|
||
|
||
if (!hasSearchResult && window._printResult === '') {
|
||
let $btn = $("a[data-bs-target='#offcanvasRight'][href='#search_panel']");
|
||
$btn.click();
|
||
let el = document.getElementById('offcanvasRight');
|
||
let offcanvas = bootstrap.Offcanvas.getOrCreateInstance(el);
|
||
offcanvas.show();
|
||
}
|
||
});
|
||
</script>
|
||
</asp:Content>
|
||
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
|
||
<uc1:alert runat="server" ID="L_msg" Text="" />
|
||
<asp:HiddenField ID="hid_err_msg" runat="server" />
|
||
<asp:HiddenField ID="hid_print_year" runat="server" />
|
||
<asp:HiddenField ID="hid_print_month" runat="server" />
|
||
<asp:HiddenField ID="hid_print_season" runat="server" />
|
||
<asp:HiddenField ID="hid_print_mode" runat="server" />
|
||
<asp:LinkButton ID="excel_management" runat="server" OnClick="export_Click" style="display:none;" />
|
||
<asp:LinkButton ID="print_management" runat="server" OnClick="export_Click" style="display:none;" />
|
||
<div id="content" class="container-fluid">
|
||
<v-data-table
|
||
v-model="data_table.selected"
|
||
:items="data_table.list"
|
||
:search-props="search"
|
||
item-key="num"
|
||
:options.sync="options"
|
||
:headers="data_table.header"
|
||
:footer-props="data_table.footer"
|
||
:server-items-length="data_table.count"
|
||
:loading="data_table.loading"
|
||
:single-select="data_table.singleSelect"
|
||
show-select
|
||
hide-default-footer
|
||
:page.sync="data_table.page"
|
||
:items-per-page.sync="data_table.pageSize"
|
||
class="elevation-1">
|
||
|
||
<template #item.birthday="{ item }" >
|
||
<div v-if="item.birthday">
|
||
<span class="badge bg-secondary">西元</span> {{ item.birthday|timeString('YYYY/MM/DD') }}
|
||
</div>
|
||
<div v-if="item.birthday2">
|
||
<span class="badge bg-secondary">農曆</span> {{ item.birthday2 }} ({{ item.sign }})
|
||
</div>
|
||
<div v-if="!item.birthday && !item.birthday2">
|
||
<span class="badge bg-light text-muted">未填寫</span>
|
||
</div>
|
||
</template>
|
||
<template #item.slot_btn="{ item }">
|
||
<a :href="'reg.aspx?num='+item.num" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-pencil-box-outline"></i>修改</a>
|
||
<a @click="deleteItem(item)" class="btn btn-outline-secondary btn-sm"><i class="mdi mdi-trash-can"></i>刪除</a>
|
||
</template>
|
||
<template #item.order_record="{item}">
|
||
<a :href="'order_record.aspx?userid='+item.num" class="btn btn-outline-secondary btn-sm">報名記錄</a>
|
||
</template>
|
||
</v-data-table>
|
||
<v-container>
|
||
<v-row class="align-baseline" wrap>
|
||
<v-col cols="12" md="9">
|
||
<v-pagination
|
||
v-model="data_table.page"
|
||
:length="pageCount">
|
||
</v-pagination>
|
||
</v-col>
|
||
<v-col class="text-truncate text-right" cols="12" md="2">
|
||
共 {{ data_table.count }} 筆, 頁數:
|
||
</v-col>
|
||
<v-col cols="6" md="1">
|
||
<v-text-field
|
||
v-model="data_table.page"
|
||
type="number"
|
||
hide-details
|
||
dense
|
||
min="1"
|
||
:max="pageCount"
|
||
@input="data_table.page = parseInt($event, 10)"
|
||
></v-text-field>
|
||
</v-col>
|
||
</v-row>
|
||
</v-container>
|
||
</div>
|
||
<div id="print_data">
|
||
</div>
|
||
<v-dialog v-model="print_dialog.show" max-width="400px">
|
||
<v-card>
|
||
<v-card-title class="justify-space-between grey lighten-2">
|
||
信眾加入日期管理報表
|
||
<v-btn icon @click="print_close"><v-icon>mdi-close</v-icon></v-btn>
|
||
</v-card-title>
|
||
<v-card-text >
|
||
<v-row densee class="pt-3" >
|
||
<v-col :cols="4" >
|
||
<span class="fs-6 text text-dark">查詢條件</span>
|
||
</v-col>
|
||
<v-col :cols="8" >
|
||
<select class="form-select" v-model="print_conditions" >
|
||
<option value="yy">年</option>
|
||
<option value="mm">月</option>
|
||
<option value="ss">季</option>
|
||
</select>
|
||
</v-col>
|
||
<v-col :cols="2" class="pt-5" >
|
||
<span class="fs-6 text text-dark">年 *</span>
|
||
</v-col>
|
||
<v-col :cols="10" >
|
||
<v-text-field v-model.number="print_search.year" min="1911" type="number" placeholder="年份必填" />
|
||
|
||
</v-col>
|
||
<v-col :cols="2" class="pt-5" v-if="print_conditions=='mm' ">
|
||
<span class="fs-6 text text-dark">月</span>
|
||
</v-col>
|
||
<v-col :cols="10" v-if="print_conditions=='mm' ">
|
||
<v-select
|
||
item-text="text"
|
||
item-value="val"
|
||
v-model="print_search.month"
|
||
:items="select_items.month"
|
||
></v-select>
|
||
</v-col>
|
||
<v-col :cols="2" class="pt-5" v-if="print_conditions=='ss' ">
|
||
<span class="fs-6 text text-dark">季</span>
|
||
</v-col>
|
||
<v-col :cols="10" v-if="print_conditions=='ss' ">
|
||
<v-select
|
||
item-text="text"
|
||
item-value="val"
|
||
v-model="print_search.season"
|
||
:items="select_items.season"
|
||
></v-select>
|
||
</v-col>
|
||
|
||
</v-row>
|
||
<v-row>
|
||
<v-col>
|
||
<div v-if="print_error_msg" class="red--text mt-2 text-center" style="font-weight: bold;">
|
||
{{ print_error_msg }}
|
||
</div>
|
||
</v-col>
|
||
</v-row>
|
||
<v-row densee class="pt-3" >
|
||
<v-col :cols="12" class="pt-3 text-center" >
|
||
<v-btn class="ma-2" color="primary" dark @click="triggerManagementExport('print')" > 列印 </v-btn>
|
||
<v-btn class="ma-2" color="primary" dark @click="triggerManagementExport('excel')"> 匯出 Excel </v-btn>
|
||
<v-btn class="ma-2" color="green" dark @click="print_close" > 取消 </v-btn>
|
||
</v-col>
|
||
</v-row>
|
||
</v-card-text>
|
||
|
||
</v-card>
|
||
</v-dialog>
|
||
<v-dialog v-model="search_dialog.show" max-width="500px">
|
||
<v-card>
|
||
<v-card-title class="justify-space-between grey lighten-2">
|
||
查詢:{{search_dialog.current.title}}
|
||
<v-btn icon @click="search_dialog.show=false"><v-icon>mdi-close</v-icon></v-btn>
|
||
</v-card-title>
|
||
<v-card-text >
|
||
<v-row>
|
||
<v-col v-for="item in search_dialog.current.keys"
|
||
:cols="search_dialog.current.keys.length>1?6:12" >
|
||
<v-text-field v-model="item.value" :label="item.title" v-if="item.visible===undefined || item.visible==true "></v-text-field>
|
||
</v-col>
|
||
<v-col cols="12" class="text-end">
|
||
<v-btn color="primary" elevation="0" @click="search_get()">查詢</v-btn>
|
||
<v-btn elevation="0" @click="search_clear()">清除條件</v-btn>
|
||
</v-col>
|
||
</v-row>
|
||
<v-data-table
|
||
:headers="search_headers()"
|
||
:items="search_dialog.list"
|
||
:footer-props="search_dialog.footer"
|
||
:items-per-page="10"
|
||
:server-items-length="search_dialog.count"
|
||
:page.sync="search_dialog.page"
|
||
:options.sync="search_options"
|
||
@click:row="search_select"
|
||
></v-data-table>
|
||
</v-card-text>
|
||
<v-card-actions>
|
||
</v-card-actions>
|
||
</v-card>
|
||
</v-dialog>
|
||
</asp:Content>
|
||
|
||
<asp:Content ID="Content4" ContentPlaceHolderID="offCanvasRight" runat="Server">
|
||
<div id="search_panel" alt="查詢公告資料">
|
||
<div class="mb-3">
|
||
<label class="form-label">信眾編號 </label>
|
||
<input type="text" v-model="search.f_number" class="form-control" placeholder="可輸入關鍵字查詢" id="s_f_number" runat="server">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">信眾姓名 </label>
|
||
<input type="text" v-model="search.u_name" class="form-control" placeholder="可輸入關鍵字查詢" id="s_u_name" runat="server">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">電話/證號 </label>
|
||
<input type="text" v-model="search.phone_idcode" class="form-control" placeholder="可輸入電話、手機、身份證號或護照號碼" id="s_phone_idcode" runat="server">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">地址 </label>
|
||
<input type="text" v-model="search.address" class="form-control" placeholder="可輸入關鍵字查詢" id="s_address" runat="server">
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">生日</label>
|
||
<div class="input-group">
|
||
<input type="date" v-model="search.birthday" class="form-control" id="s_birthday" runat="server">
|
||
<span class="input-group-text">~</span>
|
||
<input type="date" v-model="search.birthday2" class="form-control" id="s_birthday2" runat="server" >
|
||
</div>
|
||
</div>
|
||
<div class="mb-3">
|
||
<label class="form-label">國籍</label>
|
||
<div class="input-group mb-3 d-none" data-search-control="search1" @click="search_show(search_dialog.controls.search1)">
|
||
<input class="form-control search-text" type="text" readonly
|
||
placeholder="請選擇國籍" value="" id="country_txt">
|
||
<input type="hidden" v-model="search.country" >
|
||
<button class="btn btn-outline-secondary" type="button">
|
||
<i class="mdi mdi-view-list-outline"></i>
|
||
</button>
|
||
</div>
|
||
<asp:DropDownList ID="s_country" runat="server" CssClass="form-select" v-model="search.country" >
|
||
<asp:ListItem Value="" Text="請選擇"></asp:ListItem>
|
||
</asp:DropDownList>
|
||
<select class="form-select" v-model="search.country2" @change="countryChange" id="country2">
|
||
<option value="">請選擇</option>
|
||
<option value="0">全部</option>
|
||
<option value="1">台灣</option>
|
||
<option value="2">境外(非台灣)</option>
|
||
</select>
|
||
</div>
|
||
<div class="mb-3 p-2 border-top">
|
||
<a @click="btn_search" class="btn btn-outline-primary"><i class="mdi mdi-filter"></i> 搜尋</a>
|
||
<a class="btn btn-outline-secondary" @click="btn_all"><i class="mdi mdi-filter-remove"></i> 所有資料</a>
|
||
</div>
|
||
|
||
</div>
|
||
</asp:Content> |