把资料库产色的几个文件提交，汇出挂单功能的数据，状态数据要有才能运行
This commit is contained in:
198
web/admin/guadan/guest/index.aspx
Normal file
198
web/admin/guadan/guest/index.aspx
Normal file
@@ -0,0 +1,198 @@
|
||||
<%@ Page Title="" Language="C#" MasterPageFile="~/admin/Templates/TBS5ADM001/MasterPage.master" AutoEventWireup="true" CodeFile="index.aspx.cs" Inherits="admin_guadan_guest_index" %>
|
||||
|
||||
<asp:Content ID="Content1" ContentPlaceHolderID="page_header" Runat="Server">
|
||||
</asp:Content>
|
||||
<asp:Content ID="Content2" ContentPlaceHolderID="page_nav" Runat="Server">
|
||||
<nav class="search-bar">
|
||||
<div class="form-item">
|
||||
<label>姓名：</label>
|
||||
<input v-model="search.searchName" type="text" placeholder="请输入姓名">
|
||||
</div>
|
||||
|
||||
<div class="form-item">
|
||||
<label>入住日期：</label>
|
||||
<input v-model="search.date" type="date">
|
||||
</div>
|
||||
|
||||
<div class="form-item">
|
||||
<button @click="handleSearch" type="button">查询</button>
|
||||
<button type="button" @click="clearSearch">清除查询条件</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
</asp:Content>
|
||||
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
|
||||
<div>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="guests"
|
||||
:options.sync="options"
|
||||
:server-items-length="total"
|
||||
:loading="loading"
|
||||
hide-default-footer
|
||||
class="elevation-1"
|
||||
>
|
||||
<template v-slot:top>
|
||||
<v-toolbar flat>
|
||||
<v-toolbar-title>入住人列表</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
</v-toolbar>
|
||||
</template>
|
||||
<template #item.checkindate ="{item}">
|
||||
{{item.checkindate|timeString('YYYY-MM-DD')}}
|
||||
</template>
|
||||
<template #item.checkoutdate ="{item}">
|
||||
{{item.checkoutdate|timeString('YYYY-MM-DD')}}
|
||||
</template>
|
||||
</v-data-table>
|
||||
<v-container>
|
||||
<v-row class="align-baseline" wrap>
|
||||
<v-col cols="12" md="9">
|
||||
<v-pagination
|
||||
v-model="options.page"
|
||||
:length="pageCount">
|
||||
</v-pagination>
|
||||
</v-col>
|
||||
<v-col class="text-truncate text-right" cols="12" md="2">
|
||||
共 {{ }} 筆, 頁數:
|
||||
</v-col>
|
||||
<v-col cols="6" md="1">
|
||||
<v-text-field
|
||||
v-model="options.page"
|
||||
type="number"
|
||||
hide-details
|
||||
dense
|
||||
min="1"
|
||||
:max="pageCount"
|
||||
@input="options.page = parseInt($event, 10)"
|
||||
></v-text-field>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
|
||||
</asp:Content>
|
||||
<asp:Content ID="Content4" ContentPlaceHolderID="offCanvasRight" Runat="Server">
|
||||
</asp:Content>
|
||||
<asp:Content ID="Content5" ContentPlaceHolderID="footer_script" Runat="Server">
|
||||
<style>
|
||||
.search-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 10px;
|
||||
background: #f9f9f9;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 4px 8px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 6px 14px;
|
||||
background: #409eff;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background: #66b1ff;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
Vue.filter('timeString', function (value, myFormat) {
|
||||
return value == null || value == "" ? "" : moment(value).format(myFormat || 'YYYY-MM-DD, HH:mm:ss');
|
||||
});
|
||||
new Vue({
|
||||
el: '#app',
|
||||
vuetify: new Vuetify(vuetify_options),
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
search: {
|
||||
searchName: null,
|
||||
|
||||
},
|
||||
options: {
|
||||
page: 1, // 当前页
|
||||
itemsPerPage: 1, // 每页条数
|
||||
sortBy: [],
|
||||
sortDesc: []
|
||||
},
|
||||
headers: [
|
||||
{ text: '姓名', value: 'name' },
|
||||
{ text: '挂单单号', value: 'guadanorderno'},
|
||||
{ text: '入住日期', value: 'checkindate' },
|
||||
{ text: '退房日期', value: 'checkoutdate'},
|
||||
{ text: '房间号', value: 'roomName' },
|
||||
|
||||
],
|
||||
guests: [], // 表格数据
|
||||
total: 0,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
resetTableOptions() {
|
||||
this.options = {
|
||||
page: 1,
|
||||
itemsPerPage: 10,
|
||||
sortBy: [],
|
||||
sortDesc: []
|
||||
};
|
||||
},
|
||||
handleSearch() {
|
||||
this.resetTableOptions();
|
||||
},
|
||||
clearSearch() {
|
||||
this.search.searchName = null;
|
||||
this.resetTableOptions();
|
||||
},
|
||||
fetchGuests() {
|
||||
if (this.loading) return;
|
||||
this.loading = true;
|
||||
axios.post('/api/guadan/guest/query/list',
|
||||
{
|
||||
page: this.options.page,
|
||||
pageSize: this.options.itemsPerPage,
|
||||
searchName: this.search.searchName,
|
||||
date: this.search.date
|
||||
}).then(res => {
|
||||
this.guests = res.data.items; // 数据
|
||||
this.total = res.data.total; // 总数
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
options: {
|
||||
handler() {
|
||||
this.fetchGuests(); // 监听分页、排序变化，自动加载数据
|
||||
},
|
||||
deep: true,
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
pageCount() {
|
||||
return Math.ceil(this.total / this.options.itemsPerPage)
|
||||
},
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</asp:Content>
|
||||
|
||||
14
web/admin/guadan/guest/index.aspx.cs
Normal file
14
web/admin/guadan/guest/index.aspx.cs
Normal file
@@ -0,0 +1,14 @@
|
||||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Web;
|
||||
using System.Web.UI;
|
||||
using System.Web.UI.WebControls;
|
||||
|
||||
public partial class admin_guadan_guest_index : MyWeb.config
|
||||
{
|
||||
protected void Page_Load(object sender, EventArgs e)
|
||||
{
|
||||
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user