398 lines
20 KiB
Plaintext
398 lines
20 KiB
Plaintext
<%@ Page Title="後端管理" Language="C#" MasterPageFile="~/admin/Templates/TBS5ADM001/MasterPage.master" AutoEventWireup="true" CodeFile="kind_reg.aspx.cs" Inherits="admin_bed_kind_reg" %>
|
|
|
|
<%@ Register Src="~/admin/_uc/alert.ascx" TagPrefix="uc1" TagName="alert" %>
|
|
<asp:Content ID="Content1" ContentPlaceHolderID="page_header" runat="Server">
|
|
</asp:Content>
|
|
<asp:Content ID="Content4" ContentPlaceHolderID="footer_script" runat="Server">
|
|
|
|
<script>
|
|
let VueApp = new Vue({
|
|
el: '#app',
|
|
vuetify: new Vuetify(vuetify_options),
|
|
data() {
|
|
return {
|
|
this_id: '<%= _this_id %>',
|
|
this_root: '<%= _this_root %>',
|
|
options: {},
|
|
optionsDetail: { multiSort: false },
|
|
|
|
snackbar: {
|
|
show: false,
|
|
text: "",
|
|
}//床位
|
|
, searchDetail: '',
|
|
headersDetail: [
|
|
{ text: '* 床位編號', value: 'bed_name', sortable: false },
|
|
{ text: '* 床位型態', value: 'bed_type_txt', sortable: false },
|
|
{ text: '備註', value: 'demo', sortable: false },
|
|
{ text: '', value: 'actions', sortable: false, width: "120px" },
|
|
],
|
|
desserts: [],
|
|
desserts_count: 0,
|
|
desserts_page: 1,
|
|
editedIndex: -1,
|
|
editedItem: {
|
|
id: 0,
|
|
num: 0,
|
|
bed_name: '',
|
|
bed_type: 0,
|
|
bed_type_txt: '',
|
|
demo: '',
|
|
},
|
|
defaultItem: {
|
|
id: 0,
|
|
num: 0,
|
|
bed_name: '',
|
|
bed_type: 0,
|
|
bed_type_txt: '',
|
|
demo: '',
|
|
},
|
|
bed_type_items: [{ //床位下單選項
|
|
text: "請選擇",
|
|
val: 0
|
|
},],
|
|
}
|
|
},
|
|
mounted() {
|
|
//console.log("mounted");
|
|
this.bedTypeArray();
|
|
},
|
|
watch: {
|
|
options: {
|
|
handler() {
|
|
},
|
|
deep: true,
|
|
},
|
|
optionsDetail: {
|
|
handler() {
|
|
this.initialize();
|
|
},
|
|
deep: true,
|
|
},
|
|
},
|
|
methods: {
|
|
bedTypeArray() {
|
|
var getArray = <%=Newtonsoft.Json.JsonConvert.SerializeObject(_bedType, Newtonsoft.Json.Formatting.Indented) %>;
|
|
if (getArray != undefined && getArray != null ) {
|
|
var keys = Object.keys(getArray);
|
|
for (let i = 0; i < keys.length; i++) {
|
|
console.log(`${keys[i]}:${getArray[keys[i]]}`); //value : text
|
|
var _tmp = {
|
|
text: getArray[keys[i]],
|
|
val: parseInt(keys[i]),
|
|
}
|
|
this.bed_type_items.push(_tmp);
|
|
}
|
|
}
|
|
|
|
},
|
|
initialize() {
|
|
if (this.this_id != '' && this.this_root != '' && this.this_root != '0') {
|
|
const { sortBy, sortDesc, page, itemsPerPage } = this.optionsDetail
|
|
//this.desserts_page = this.options.page ?? 1
|
|
const params = {
|
|
sortBy: sortBy[0], sortDesc: sortDesc[0],
|
|
//page: this.desserts_page, pageSize: 10,
|
|
page: 1,
|
|
pageSize: itemsPerPage,
|
|
//page: page, pageSize: itemsPerPage == -1 ? 9999 : itemsPerPage,
|
|
};
|
|
var searchBedDetail = {
|
|
bed_kind_id: this.this_id,
|
|
}
|
|
axios
|
|
.post(HTTP_HOST + 'api/bed_kind/GetDetailList', searchBedDetail, { params: params })
|
|
.then(response => {
|
|
|
|
this.desserts = response.data.list
|
|
this.desserts_count = response.data.count
|
|
})
|
|
.catch(
|
|
error => console.log(error)
|
|
)
|
|
}
|
|
|
|
},
|
|
editItem(item) {
|
|
this.editedIndex = this.desserts.indexOf(item);
|
|
this.editedItem = Object.assign({}, item);
|
|
},
|
|
deleteItem(item) {
|
|
if (confirm('確定要刪除此筆資料嗎?')) {
|
|
const index = this.desserts.indexOf(item);
|
|
if (item.num > 0) {
|
|
if (index != -1) {
|
|
axios
|
|
.delete(HTTP_HOST + 'api/bed_kind/DeleteBedKindDetail/' + item.num)
|
|
.then(response => {
|
|
console.log("del", item);
|
|
this.desserts.splice(index, 1)
|
|
this.desserts_count = this.desserts_count - 1;
|
|
})
|
|
.catch(error => console.log(error))
|
|
}
|
|
} else {
|
|
this.desserts.splice(index, 1)
|
|
}
|
|
}
|
|
},
|
|
cancel() {
|
|
|
|
|
|
this.spliceNullData();
|
|
this.close();
|
|
|
|
},
|
|
spliceNullData() {
|
|
|
|
//if new data ,then splice it
|
|
if (this.editedItem.num == 0) {
|
|
|
|
for (var i = 0; i < this.desserts.map(x => x.id).length; i++) {
|
|
if (this.desserts[i].id == this.editedItem.id) {
|
|
this.desserts.splice(i, 1); break;
|
|
}
|
|
}
|
|
}
|
|
},
|
|
close() {
|
|
setTimeout(() => {
|
|
this.editedItem = Object.assign({}, this.defaultItem);
|
|
this.editedIndex = -1;
|
|
}, 300)
|
|
},
|
|
addNew() {
|
|
this.spliceNullData();
|
|
//addObj.id = this.desserts.length + 1;
|
|
this.editedIndex = -1;
|
|
var keysArr = [];
|
|
for (var i = 0; i < this.desserts.map(x => x.id).length; i++) {
|
|
//console.log(this.desserts[i].id)
|
|
keysArr.push(parseInt(this.desserts[i].id));
|
|
}
|
|
var _c = Math.max.apply(null, keysArr);
|
|
|
|
const addObj = Object.assign({}, this.defaultItem);
|
|
addObj.id = (isFinite(_c) ? _c : 0) + 1;
|
|
this.desserts.unshift(addObj);
|
|
this.editItem(addObj);
|
|
},
|
|
save() {
|
|
if (this.editedIndex > -1) {
|
|
if (this.this_id != '') {
|
|
//chcck necessary params
|
|
if (this.editedItem.bed_name != '' && this.editedItem.bed_type >0 ) {
|
|
//insert or update data
|
|
var kind_detail =
|
|
{
|
|
num: this.editedItem.num,
|
|
bed_kind_id: this.this_id,
|
|
bed_name: this.editedItem.bed_name,
|
|
bed_type: this.editedItem.bed_type,
|
|
demo: this.editedItem.demo,
|
|
|
|
}
|
|
axios
|
|
.post(HTTP_HOST + 'api/bed_kind/SaveBedKindDetail', kind_detail)
|
|
.then(response => {
|
|
this.editedItem.num = response.data;
|
|
//處理下拉文字
|
|
this.editedItem.bed_type_txt = this.bed_type_items[this.editedItem.bed_type].text;
|
|
Object.assign(this.desserts[this.editedIndex], this.editedItem)
|
|
this.close()
|
|
})
|
|
.catch(
|
|
error => console.log(error)
|
|
)
|
|
|
|
} else {
|
|
this.snackbar.text = "必填項目未填寫完整";
|
|
this.snackbar.show = true
|
|
}
|
|
} else {
|
|
this.snackbar.text = "房號錯誤";
|
|
this.snackbar.show = true
|
|
}
|
|
|
|
}
|
|
},
|
|
},
|
|
computed: {
|
|
},
|
|
|
|
})
|
|
</script>
|
|
</asp:Content>
|
|
<asp:Content ID="Content3" ContentPlaceHolderID="page_nav" runat="Server">
|
|
<nav class="mb-1">
|
|
<asp:LinkButton ID="ImageButton4" runat="server" CausesValidation="False" OnClick="ImageButton4_Click" CssClass="btn btn-primary"><i class="mdi mdi-plus"></i> 新增樓層</asp:LinkButton>
|
|
<asp:LinkButton ID="sortButton" runat="server" Visible="false" CssClass="btn btn-primary" OnClick="sortButton_Click">
|
|
<i class="mdi mdi-sort"></i> 排序選項</asp:LinkButton>
|
|
</nav>
|
|
<nav class="mb-1">
|
|
<asp:Button ID="edit" runat="server" Text="修改" Visible="false" OnClick="edit_Click" CssClass="btn btn-primary" />
|
|
<asp:Button ID="add" runat="server" Text="新增" Visible="false" OnClick="add_Click" CssClass="btn btn-primary" />
|
|
|
|
<asp:PlaceHolder ID="down_table" runat="server">
|
|
<asp:LinkButton ID="ImageButton5" runat="server" OnClick="ImageButton5_Click" CssClass="btn btn-outline-secondary" CausesValidation="False"><i class="mdi mdi-arrow-down-right"></i> 建立房號</asp:LinkButton>
|
|
<asp:LinkButton ID="ImageButton6" runat="server" OnClientClick="return msgconfirm('是否確定刪除這筆資料？<br>注意！資料刪除後將一併刪除此資料的子選項！',this);" OnClick="ImageButton6_Click" CssClass="btn btn-outline-secondary"><i class="mdi mdi-trash-can"></i> 刪除</asp:LinkButton>
|
|
</asp:PlaceHolder>
|
|
</nav>
|
|
</asp:Content>
|
|
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
|
|
<uc1:alert runat="server" ID="L_msg" Text="" />
|
|
<div id="content" class="container-fluid pb-4">
|
|
<div class="row">
|
|
<div class="col-sm-4 col-lg-3">
|
|
<div class="card shadow-sm my-2" id="sec1">
|
|
<div class="card-header">選擇分類</div>
|
|
<div class="card-body">
|
|
<asp:TreeView ID="TreeView2" runat="server" CssClass="aspxTree" ImageSet="Arrows"
|
|
SkipLinkText="" ShowLines="false" EnableTheming="False" ShowExpandCollapse="True">
|
|
</asp:TreeView>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-8 col-lg-9">
|
|
<asp:Panel ID="table" runat="server" CssClass="card shadow-sm my-2">
|
|
<div class="card-header">
|
|
<div>
|
|
<asp:Label ID="start" runat="server" CssClass="text-danger" Display="Dynamic"></asp:Label>
|
|
</div>
|
|
<div>
|
|
<asp:Label ID="title_msg" runat="server" CssClass="" ForeColor=""></asp:Label>
|
|
</div>
|
|
</div>
|
|
<div class="card-body form-horizontal" role="form">
|
|
<div>
|
|
<div class="form-text text-muted">以下 * 欄位為必填欄位</div>
|
|
</div>
|
|
<div class="row mb-1 label-sm-right">
|
|
<label class="col-sm-2 col-md-2 col-form-label">* <asp:Literal ID="Literal1" runat="server" Text="樓層名稱"></asp:Literal></label>
|
|
<div class="col-sm-10 " v-bind:class="[this_root !='' && this_root !='0' ? ' col-md-10' : ' col-md-4']">
|
|
<asp:TextBox ID="item_name" runat="server" CssClass="form-control" MaxLength="100" placeholder="請輸入樓層名稱"></asp:TextBox>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="item_name" ErrorMessage="必填！" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>
|
|
</div>
|
|
<asp:PlaceHolder ID="sexPlaceHolder" runat="server">
|
|
<label class="col-sm-2 col-md-2 col-form-label">* 樓層類型</label>
|
|
<div class="col-sm-10 col-md-4">
|
|
<asp:DropDownList ID="sex" CssClass="form-select" runat="server">
|
|
<asp:ListItem Value="" Text="請選擇"></asp:ListItem>
|
|
<asp:ListItem Value="男眾" Text="男眾"></asp:ListItem>
|
|
<asp:ListItem Value="女眾" Text="女眾"></asp:ListItem>
|
|
</asp:DropDownList>
|
|
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="sex" runat="server"
|
|
ErrorMessage="必填！" Display="Dynamic" SetFocusOnError="true"></asp:RequiredFieldValidator>
|
|
</div>
|
|
</asp:PlaceHolder>
|
|
</div>
|
|
|
|
|
|
<div class="row mb-1">
|
|
<label class="col-form-label">備註</label>
|
|
<div class="col-sm-12">
|
|
<asp:TextBox ID="demo" runat="server" CssClass="form-control" TextMode="MultiLine" Rows="3" placeholder="請輸入備註"></asp:TextBox>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<v-card class="mx-auto mt-10" outlined v-if="this_id!='' && this_root !='' && this_root !='0'">
|
|
<v-data-table
|
|
:headers="headersDetail"
|
|
:items="desserts"
|
|
:search="searchDetail"
|
|
:options.sync="optionsDetail" class="elevation-1" fixed-header height="350px"
|
|
<%-- :server-items-length="desserts_count"
|
|
:page.sync="desserts_page"--%>
|
|
>
|
|
<v-divider inset></v-divider>
|
|
<template v-slot:top>
|
|
<v-toolbar flat color="white">
|
|
<div class="d-flex w-100">
|
|
<v-text-field v-model="searchDetail" append-icon="mdi-magnify" label="查詢" dense outlined single-line hide-details></v-text-field>
|
|
<v-btn
|
|
color="primary"
|
|
class="ml-2 white--text"
|
|
@click="addNew">
|
|
<v-icon dark>mdi-plus</v-icon>新增
|
|
</v-btn>
|
|
</div>
|
|
</v-toolbar>
|
|
</template>
|
|
<template v-slot:item.bed_name="{ item }">
|
|
<v-text-field v-model="editedItem.bed_name" :hide-details="true" dense single-line v-if="item.id === editedItem.id" :maxlength=50 ></v-text-field>
|
|
<span v-else>{{item.bed_name}}</span>
|
|
<span v-if="item.num==0" class="text-danger">(預設資料,未存檔)</span>
|
|
</template>
|
|
<template v-slot:item.bed_type_txt="{ item }">
|
|
<v-select
|
|
item-text="text"
|
|
item-value="val"
|
|
v-model="editedItem.bed_type"
|
|
:items="bed_type_items"
|
|
v-if="item.id === editedItem.id"
|
|
></v-select>
|
|
<span v-else>{{item.bed_type_txt}}</span>
|
|
</template>
|
|
<template v-slot:item.demo="{ item }">
|
|
<v-text-field v-model="editedItem.demo" :hide-details="true" dense single-line v-if="item.id === editedItem.id" ></v-text-field>
|
|
<span v-else>{{item.demo}}</span>
|
|
</template>
|
|
<template v-slot:item.actions="{ item }">
|
|
<div v-if="item.id === editedItem.id">
|
|
<v-icon color="red" class="mr-3" @click="cancel">
|
|
mdi-window-close
|
|
</v-icon>
|
|
<v-icon color="green" @click="save">
|
|
mdi-content-save
|
|
</v-icon>
|
|
</div>
|
|
<div v-else>
|
|
<v-icon color="green" class="mr-3" @click="editItem(item);">
|
|
mdi-pencil
|
|
</v-icon>
|
|
<v-icon color="red" @click="deleteItem(item)">
|
|
mdi-delete
|
|
</v-icon>
|
|
</div>
|
|
</template>
|
|
|
|
</v-data-table>
|
|
</v-card>
|
|
|
|
|
|
|
|
<div class="form-group">
|
|
<div class="col-sm-offset-3 col-md-offset-2 col-sm-9 col-md-10">
|
|
<asp:HiddenField ID="HiddenField1" runat="server" />
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
</asp:Panel>
|
|
</div>
|
|
</div>
|
|
|
|
<v-snackbar
|
|
v-model="snackbar.show"
|
|
timeout="2000"
|
|
>
|
|
{{ snackbar.text }}
|
|
<template v-slot:action="{ attrs }">
|
|
<v-btn
|
|
text
|
|
v-bind="attrs"
|
|
@click="snackbar.show = false"
|
|
>
|
|
關閉
|
|
</v-btn>
|
|
</template>
|
|
</v-snackbar>
|
|
</div>
|
|
|
|
</asp:Content>
|
|
|