|
@@ -4,61 +4,91 @@
|
|
|
<div class="hotelr-head">
|
|
|
<div class="hotelr-head-li">
|
|
|
<label>团组名称:</label>
|
|
|
- <el-select @change="Receivables" v-model="value" filterable placeholder="请选择">
|
|
|
- <el-option v-for="item in options" :key="item.id" :label="item.groupName" :value="item.id">
|
|
|
+ <el-select @change="delegationSelectChange" v-model="OpHotelReservationsData.diid" clearable filterable
|
|
|
+ placeholder="请选择">
|
|
|
+ <el-option v-for="item in delegationInfoList" :key="item.id" :label="item.teamName"
|
|
|
+ :value="item.id">
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
<div class="hotelr-info">
|
|
|
<div class="hotelr-info-li">
|
|
|
<label>团 号:</label>
|
|
|
- <span>团 号:</span>
|
|
|
+ <span>{{ delegationInfo.tourCode }}</span>
|
|
|
</div>
|
|
|
<div class="hotelr-info-li">
|
|
|
<label>客 户:</label>
|
|
|
- <span>客 户:</span>
|
|
|
+ <span>{{ delegationInfo.clientName }}</span>
|
|
|
</div>
|
|
|
<div class="hotelr-info-li">
|
|
|
<label>出访国家:</label>
|
|
|
- <span>出访国家:</span>
|
|
|
+ <span>{{ delegationInfo.visitCountry }}</span>
|
|
|
</div>
|
|
|
<div class="hotelr-info-li">
|
|
|
<label>起止日期:</label>
|
|
|
- <span> 起止日期:</span>
|
|
|
+ <span>{{ VisitDate }}</span>
|
|
|
</div>
|
|
|
<div class="hotelr-info-li">
|
|
|
<label>天数/人数:</label>
|
|
|
- <span>天数/人数:</span>
|
|
|
+ <span>{{ delegationInfo.visitDays }}/{{ delegationInfo.visitPNumber }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="hotelr-table">
|
|
|
- <el-table :data="tableData" border style="width: 100%">
|
|
|
+ <el-table :data="tableDatas.slice((currentPage - 1) * pageSize, currentPage * pageSize)" border
|
|
|
+ style="width: 100%" v-loading="loading" element-loading-text="拼命加载中...">
|
|
|
<el-table-column type="index" label="序号" width="50">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="date" label="预定号" width="180">
|
|
|
+ <el-table-column prop="reservationsNo" label="预定号" width="180">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="酒店名称" width="180">
|
|
|
+ <el-table-column prop="hotelName" label="酒店名称" width="180">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="date" label="入住日期" width="120">
|
|
|
+ <el-table-column prop="checkInDate" label="入住日期" width="120">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="date" label="退房日期" width="120">
|
|
|
+ <el-table-column prop="checkOutDate" label="退房日期" width="120">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="付款金额" width="100">
|
|
|
+ <el-table-column prop="payMoney" label="付款金额" width="180">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.row.payMoney }}({{ scope.row.paymentCurrency }})
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="操作人" width="100">
|
|
|
+ <el-table-column prop="createUserName" label="操作人" width="120">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="操作时间" width="180">
|
|
|
+ <el-table-column prop="createTime" label="操作时间" width="180">
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="附 件" width="80">
|
|
|
+ <el-table-column prop="attachment" label="附 件" width="80">
|
|
|
+ <template>
|
|
|
+ <i>下载附件</i>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column prop="name" label="是否审核" width="100">
|
|
|
+ <el-table-column prop="isAuditGM" label="是否审核" width="100">
|
|
|
+ <template slot-scope="isAuditGM">
|
|
|
+ <span v-if="isAuditGM.row.isAuditGM == 1">已通过</span>
|
|
|
+ <span v-else-if="isAuditGM.row.isAuditGM == 0">未审核</span>
|
|
|
+ <span v-else-if="isAuditGM.row.isAuditGM == 2">未通过</span>
|
|
|
+ <span v-else>自动审核通过</span>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="name" label="操 作" width="140">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button-group>
|
|
|
+ <el-button type="primary" size="mini" icon="el-icon-edit"
|
|
|
+ @click="upDate(scope.$index, scope.row)"></el-button>
|
|
|
+ <el-button type="danger" size="mini" icon="el-icon-delete"
|
|
|
+ @click="del(scope.$index, scope.row)"></el-button>
|
|
|
+ </el-button-group>
|
|
|
+ </template>
|
|
|
</el-table-column>
|
|
|
<el-table-column prop="address" label="VOUCHER">
|
|
|
+ <i>生成</i>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
+ <div class="block">
|
|
|
+ <el-pagination align='center' @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage" :page-sizes="[3, 5, 7, 9]" :page-size="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next" :total="tableDatas.length">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="hotelr-form">
|
|
|
<div class="form-head">
|
|
@@ -78,197 +108,278 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="form-foundationone select-bz">
|
|
|
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="110px" class="demo-ruleForm">
|
|
|
+ <el-form :model="OpHotelReservationsData" :rules="rules" ref="OpHotelReservationsData"
|
|
|
+ label-width="110px" class="demo-OpHotelReservationsData">
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="客人类型" prop="region">
|
|
|
- <el-select size="medium" v-model="ruleForm.region" placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:350px ;" label="客人类型" prop="gTId">
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.gTId" placeholder="请选择客人类型">
|
|
|
+ <el-option v-for="item in guestType" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
<el-form-item style="width:350px ;" label="计算费用币种" prop="region">
|
|
|
- <el-select size="medium" v-model="ruleForm.region" placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.budgetCurrency"
|
|
|
+ placeholder="请选择币种">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="汇率">
|
|
|
+ <el-form-item label="当前币种团组汇率" label-width="150px">
|
|
|
<span>7.52</span>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="入住卷号码" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="入住卷号码" prop="checkNumber">
|
|
|
+ <el-input size="medium" type="text"
|
|
|
+ v-model="OpHotelReservationsData.checkNumber"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="预订网站" prop="region">
|
|
|
- <el-select size="medium" v-model="ruleForm.region" placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:350px ;" label="预订网站" prop="reservationsWebsite">
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.reservationsWebsite"
|
|
|
+ placeholder="预订网站">
|
|
|
+ <el-option v-for="item in bookingWebsite" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="预订号码" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="酒店确定号码" prop="determineNo">
|
|
|
+ <el-input size="medium" type="text"
|
|
|
+ v-model="OpHotelReservationsData.determineNo"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="酒店确定号码" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;flex-wrap: wrap;">
|
|
|
+ <el-form-item style="width:100% ;" label="预订号码" prop="reservationsNo">
|
|
|
+ <el-input :rows="1" type="textarea"
|
|
|
+ v-model="OpHotelReservationsData.reservationsNo"></el-input>
|
|
|
+
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="所在城市" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="所在城市" prop="city">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.city"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="酒店名称" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="酒店名称" prop="hotelName">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.hotelName"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="酒店电话" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="酒店电话" prop="hotelTel">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.hotelTel"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
- <el-form-item label="酒店地址" prop="desc">
|
|
|
- <el-input :rows="1" type="textarea" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item label="酒店地址" prop="hotelAddress">
|
|
|
+ <el-input :rows="1" type="textarea" v-model="OpHotelReservationsData.hotelAddress"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="客人姓名" prop="desc">
|
|
|
- <el-input :rows="1" type="textarea" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item label="客人姓名" prop="guestName">
|
|
|
+ <el-input :rows="1" type="textarea" v-model="OpHotelReservationsData.guestName"></el-input>
|
|
|
</el-form-item>
|
|
|
<div class="remcss" style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item prop="date1" style="width:350px ;" label="入住时间" required>
|
|
|
- <el-date-picker size="medium" type="date" placeholder="选择日期" v-model="ruleForm.date1"
|
|
|
- style="width: 100%;"></el-date-picker>
|
|
|
+ <el-form-item prop="checkInDate" style="width:350px ;" label="入住时间" required>
|
|
|
+ <el-date-picker size="medium" type="date" placeholder="选择日期"
|
|
|
+ v-model="OpHotelReservationsData.checkInDate" style="width: 100%;"></el-date-picker>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="离店时间" prop="date2">
|
|
|
- <el-date-picker size="medium" type="date" placeholder="选择时间" v-model="ruleForm.date2"
|
|
|
- style="width: 100%;"></el-date-picker>
|
|
|
+ <el-form-item style="width:350px ;" label="离店时间" prop="checkOutDate">
|
|
|
+ <el-date-picker size="medium" type="date" placeholder="选择时间"
|
|
|
+ v-model="OpHotelReservationsData.checkOutDate" style="width: 100%;"></el-date-picker>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="酒店单间" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="酒店单间" prop="predictSingleRoom">
|
|
|
<el-input-number style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
+ v-model="OpHotelReservationsData.predictSingleRoom"></el-input-number>
|
|
|
<span>间</span>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="酒店双间" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="酒店双间" prop="predictDoubleRoom">
|
|
|
<el-input-number style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
+ v-model="OpHotelReservationsData.predictDoubleRoom"></el-input-number>
|
|
|
<span>间</span>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="酒店套房" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="酒店套房" prop="predictSuiteRoom">
|
|
|
<el-input-number style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
+ v-model="OpHotelReservationsData.predictSuiteRoom"></el-input-number>
|
|
|
<span>间</span>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="其他房型" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="其他房型" prop="predictOtherRoom">
|
|
|
<el-input-number style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
+ v-model="OpHotelReservationsData.predictOtherRoom"></el-input-number>
|
|
|
<span>间</span>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<div class="form-foundationone">
|
|
|
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
+ <el-form :model="OpHotelReservationsData" :rules="rules" ref="OpHotelReservationsData"
|
|
|
+ label-width="100px" class="demo-OpHotelReservationsData">
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item label-width="100px" style="width:350px ;" label="信用卡金额" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:25% ;" label="酒店单间" prop="singleRoomCount">
|
|
|
+ <el-input-number style="width:50px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.singleRoomCount"></el-input-number>
|
|
|
+ <span>间</span>
|
|
|
+ <el-input-number style="width:80px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.singleRoomPrice"></el-input-number>
|
|
|
+ <span>单价</span>
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.budgetCurrency"
|
|
|
+ style="width: 80px;" :disabled="true" placeholder="">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label-width="10px" prop="region">
|
|
|
- <el-select size="medium" v-model="ruleForm.region" placeholder="请选择活动区域">
|
|
|
- <el-option label="美元卡" value="shanghai"></el-option>
|
|
|
- <el-option label="欧元卡" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:25% ;" label="酒店双间" prop="desc">
|
|
|
+ <el-input-number style="width:50px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.doubleRoomCount"></el-input-number>
|
|
|
+ <span>间</span>
|
|
|
+ <el-input-number style="width:80px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.doubleRoomPrice"></el-input-number>
|
|
|
+ <span>单价</span>
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.budgetCurrency"
|
|
|
+ style="width: 80px;" :disabled="true" placeholder="">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="width:25% ;" label="酒店套房" prop="suiteRoomCount">
|
|
|
+ <el-input-number style="width:50px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.suiteRoomCount"></el-input-number>
|
|
|
+ <span>间</span>
|
|
|
+ <el-input-number style="width:80px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.suiteRoomPrice"></el-input-number>
|
|
|
+ <span>单价</span>
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.budgetCurrency"
|
|
|
+ style="width: 80px;" :disabled="true" placeholder="">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="width:25% ;" label="其他房型" prop="otherRoomCount">
|
|
|
+ <el-input-number style="width:50px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.otherRoomCount"></el-input-number>
|
|
|
+ <span>间</span>
|
|
|
+ <el-input-number style="width:80px ;" size="medium" :controls="false"
|
|
|
+ v-model="OpHotelReservationsData.fangnum"></el-input-number>
|
|
|
+ <span>单价</span>
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.otherRoomPrice"
|
|
|
+ style="width: 80px;" :disabled="true" placeholder="">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="地税" prop="desc">
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;flex-wrap: wrap;">
|
|
|
+ <el-form-item label-width="100px" style="width:350px ;" label="信用卡金额" prop="cardPrice">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.cardPrice"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label-width="10px" prop="cTDId">
|
|
|
+ <el-select size="medium" v-model="OpHotelReservationsData.cTDId" placeholder="请选择信用卡">
|
|
|
+ <el-option v-for="item in bankCard" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="width:350px ;" label="地税" prop="governmentRent">
|
|
|
<el-input-number :precision="2" style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
- <el-select style="width:100px ;" size="medium" v-model="ruleForm.region" placeholder="请选择">
|
|
|
- <el-option label="CNY" value="shanghai"></el-option>
|
|
|
- <el-option label="USD" value="beijing"></el-option>
|
|
|
+ v-model="OpHotelReservationsData.governmentRent"></el-input-number>
|
|
|
+ <el-select style="width:100px ;" size="medium"
|
|
|
+ v-model="OpHotelReservationsData.governmentRentCurrency" placeholder="请选择">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="城市税" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="城市税" prop="cityTax">
|
|
|
<el-input-number :precision="2" style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
- <el-select style="width:100px ;" size="medium" v-model="ruleForm.region" placeholder="请选择">
|
|
|
- <el-option label="CNY" value="shanghai"></el-option>
|
|
|
- <el-option label="USD" value="beijing"></el-option>
|
|
|
+ v-model="OpHotelReservationsData.fangnum"></el-input-number>
|
|
|
+ <el-select style="width:100px ;" size="medium" v-model="OpHotelReservationsData.cityTax"
|
|
|
+ placeholder="请选择">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item label-width="100px" style="width:350px ;" label="入住类型" prop="region">
|
|
|
- <el-select style="width: 100%;" size="medium" v-model="ruleForm.region"
|
|
|
- placeholder="请选择活动区域">
|
|
|
- <el-option label="客人房" value="shanghai"></el-option>
|
|
|
- <el-option label="导游房" value="beijing"></el-option>
|
|
|
+ <el-form-item label-width="100px" style="width:350px ;" label="入住类型" prop="checkType">
|
|
|
+ <el-select style="width: 100%;" size="medium" v-model="OpHotelReservationsData.checkType"
|
|
|
+ placeholder="请选择入住人类型">
|
|
|
+ <el-option v-for="item in CheckType" :key="item.value" :label="item.name"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
- <el-form-item label="酒店地址" prop="desc">
|
|
|
- <el-input :rows="1" type="textarea" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item label="房间说明" prop="roomExplanation">
|
|
|
+ <el-input :rows="1" type="textarea"
|
|
|
+ v-model="OpHotelReservationsData.roomExplanation"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="附件" prop="desc">
|
|
|
+ <el-form-item label="附件" prop="attachment">
|
|
|
<input type="file" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="备注" prop="desc">
|
|
|
- <el-input :rows="3" type="textarea" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item label="备注" prop="remark">
|
|
|
+ <el-input :rows="3" type="textarea" v-model="OpHotelReservationsData.remark"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
<div class="form-foundationone">
|
|
|
<div>付款信息</div>
|
|
|
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
|
|
+ <el-form :model="OpHotelReservationsData" :rules="rules" ref="OpHotelReservationsData"
|
|
|
+ label-width="100px" class="demo-OpHotelReservationsData">
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="支付方式" prop="region">
|
|
|
- <el-select style="width: 100%;" size="medium" v-model="ruleForm.region"
|
|
|
- placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:350px ;" label="支付方式" prop="payDId">
|
|
|
+ <el-select style="width: 100%;" size="medium" v-model="OpHotelReservationsData.payDId"
|
|
|
+ placeholder="请选择支付方式">
|
|
|
+ <el-option v-for="item in payment" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="消费方式" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="消费方式" prop="consumptionPatterns">
|
|
|
+ <el-input size="medium" type="text"
|
|
|
+ v-model="OpHotelReservationsData.consumptionPatterns"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item prop="date1" style="width:350px ;" label="消费日期" required>
|
|
|
- <el-date-picker size="medium" type="date" placeholder="选择日期" v-model="ruleForm.date1"
|
|
|
- style="width: 100%;"></el-date-picker>
|
|
|
+ <el-form-item prop="consumptionDate" style="width:350px ;" label="消费日期" required>
|
|
|
+ <el-date-picker size="medium" type="date" placeholder="选择日期"
|
|
|
+ v-model="OpHotelReservationsData.consumptionDate" style="width: 100%;"></el-date-picker>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="付款金额" prop="desc">
|
|
|
+ <el-form-item style="width:350px ;" label="付款金额" prop="cardPrices">
|
|
|
<el-input-number :precision="2" style="width:100px ;" size="medium" :controls="false"
|
|
|
- v-model="ruleForm.fangnum"></el-input-number>
|
|
|
- <el-select style="width:100px ;" size="medium" v-model="ruleForm.region" placeholder="请选择">
|
|
|
- <el-option label="CNY" value="shanghai"></el-option>
|
|
|
- <el-option label="USD" value="beijing"></el-option>
|
|
|
+ v-model="OpHotelReservationsData.cardPrice"></el-input-number>
|
|
|
+ <el-select style="width:100px ;" size="medium"
|
|
|
+ v-model="OpHotelReservationsData.budgetCurrency" placeholder="请选择">
|
|
|
+ <el-option v-for="item in currencyList" :key="item.id" :label="item.name"
|
|
|
+ :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="卡类型" prop="region">
|
|
|
- <el-select style="width: 100%;" size="medium" v-model="ruleForm.region"
|
|
|
- placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:350px ;" label="卡类型" prop="cTDId">
|
|
|
+ <el-select style="width: 100%;" size="medium" v-model="OpHotelReservationsData.cTDId"
|
|
|
+ placeholder="请选择卡类型">
|
|
|
+ <el-option v-for="item in bankCard" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="银行卡号" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item style="width:350px ;" label="银行卡号" prop="bankNo">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.bankNo"></el-input>
|
|
|
</el-form-item>
|
|
|
- <el-form-item prop="date1" style="width:350px ;" label="持卡人姓名" required>
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-form-item prop="cardholderName" style="width:350px ;" label="持卡人姓名" required>
|
|
|
+ <el-input size="medium" type="text"
|
|
|
+ v-model="OpHotelReservationsData.cardholderName"></el-input>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<div style="display: flex;flex-wrap: wrap;">
|
|
|
- <el-form-item style="width:350px ;" label="收款方" prop="desc">
|
|
|
- <el-input size="medium" type="text" v-model="ruleForm.desc"></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item style="width:350px ;" label="费用标识" prop="region">
|
|
|
- <el-select style="width: 100%;" size="medium" v-model="ruleForm.region"
|
|
|
- placeholder="请选择活动区域">
|
|
|
- <el-option label="区域一" value="shanghai"></el-option>
|
|
|
- <el-option label="区域二" value="beijing"></el-option>
|
|
|
+ <el-form-item style="width:350px ;" label="收款方" prop="payee">
|
|
|
+ <el-input size="medium" type="text" v-model="OpHotelReservationsData.payee"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item style="width:350px ;" label="费用标识" prop="orbitalPrivateTransfer">
|
|
|
+ <el-select style="width: 100%;" size="medium"
|
|
|
+ v-model="OpHotelReservationsData.orbitalPrivateTransfer" placeholder="请选择费用标识">
|
|
|
+ <el-option label="公转" :value="0"></el-option>
|
|
|
+ <el-option label="私转" :value="1"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
<el-form-item label="备注" prop="desc">
|
|
|
- <el-input :rows="3" type="textarea" v-model="ruleForm.desc"></el-input>
|
|
|
+ <el-input :rows="3" type="textarea" v-model="OpHotelReservationsData.desc"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
@@ -280,78 +391,216 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- tableData: [{
|
|
|
- date: '2016-05-02',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-04',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1517 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-01',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1519 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-03',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1516 弄'
|
|
|
- }],
|
|
|
- gridData: [{
|
|
|
- date: '2016-05-02',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-04',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-01',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }, {
|
|
|
- date: '2016-05-03',
|
|
|
- name: '王小虎',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄'
|
|
|
- }],
|
|
|
- ruleForm: {
|
|
|
- name: '',
|
|
|
- region: '',
|
|
|
- date1: '',
|
|
|
- date2: '',
|
|
|
- delivery: false,
|
|
|
- type: [],
|
|
|
- resource: '',
|
|
|
- desc: '',
|
|
|
- fangnum: '',
|
|
|
+ tableData: [],
|
|
|
+ tableDatas: [],
|
|
|
+ currentPage: 1, // 当前页码
|
|
|
+ pageSize: 5,// 每页的数据条数
|
|
|
+ gridData: [],
|
|
|
+ delegationInfoList: [],
|
|
|
+ delegationInfo: {},
|
|
|
+ guestType: [],//客人类型
|
|
|
+ currencyList: [],//币种下拉框
|
|
|
+ bankCard: [],//卡类型下拉框
|
|
|
+ payment: [],//支付方式下拉框
|
|
|
+ bookingWebsite: [],//预订网站
|
|
|
+ CheckType: [
|
|
|
+ {
|
|
|
+ name: '客人房',
|
|
|
+ value: '',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '司机房',
|
|
|
+ value: 'D',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '导游房',
|
|
|
+ value: 'G',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '司机导游房',
|
|
|
+ value: 'D&G',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ OpHotelReservationsData: {
|
|
|
+ status: 0,
|
|
|
+ id: 0,
|
|
|
+ diId: 0,
|
|
|
+ gtId: 0,
|
|
|
+ checkNumber: '',
|
|
|
+ reservationsWebsite: 0,
|
|
|
+ reservationsNo: '',
|
|
|
+ determineNo: '',
|
|
|
+ city: '',
|
|
|
+ hotelName: '',
|
|
|
+ hotelAddress: '',
|
|
|
+ hotelTel: '',
|
|
|
+ guestName: '',
|
|
|
+ checkInDate: '',
|
|
|
+ checkOutDate: '',
|
|
|
+ budget: 0,
|
|
|
+ budgetCurrency: '',
|
|
|
+ singleRoomCount: 0,
|
|
|
+ singleRoomPrice: 0,
|
|
|
+ doubleRoomCount: 0,
|
|
|
+ doubleRoomPrice: 0,
|
|
|
+ suiteRoomCount: 0,
|
|
|
+ suiteRoomPrice: 0,
|
|
|
+ otherRoomCount: 0,
|
|
|
+ otherRoomPrice: 0,
|
|
|
+ roomExplanation: '',
|
|
|
+ attachment: '',
|
|
|
+ cardPrice: 0,
|
|
|
+ isCardPrice: 0,
|
|
|
+ predictSingleRoom: 0,
|
|
|
+ predictDoubleRoom: 0,
|
|
|
+ predictSuiteRoom: 0,
|
|
|
+ predictOtherRoom: 0,
|
|
|
+ governmentRent: 0,
|
|
|
+ governmentRentCurrency: 0,
|
|
|
+ cityTax: 0,
|
|
|
+ cityTaxCurrency: 0,
|
|
|
+ checkType: '',
|
|
|
+ myProperty: 0,
|
|
|
+ createUserId: 0,
|
|
|
+ remark: '',
|
|
|
+ payDId: '',
|
|
|
+ consumptionPatterns: '',
|
|
|
+ consumptionDate: '',
|
|
|
+ ctdId: 0,
|
|
|
+ companyBankNo: '',
|
|
|
+ otherBankName: '',
|
|
|
+ otherSideNo: '',
|
|
|
+ otherSideName: '',
|
|
|
+ bankNo: '',
|
|
|
+ cardholderName: '',
|
|
|
+ payee: '',
|
|
|
+ orbitalPrivateTransfer: 0,
|
|
|
+ cRemark: ''
|
|
|
},
|
|
|
rules: {
|
|
|
- name: [
|
|
|
- { required: true, message: '请输入活动名称', trigger: 'blur' },
|
|
|
- { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
|
|
|
- ],
|
|
|
- region: [
|
|
|
- { required: true, message: '请选择活动区域', trigger: 'change' }
|
|
|
- ],
|
|
|
- date1: [
|
|
|
+ checkInDate: [
|
|
|
{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }
|
|
|
],
|
|
|
- date2: [
|
|
|
- { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
|
|
|
- ],
|
|
|
- type: [
|
|
|
- { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
|
|
|
- ],
|
|
|
- resource: [
|
|
|
- { required: true, message: '请选择活动资源', trigger: 'change' }
|
|
|
- ],
|
|
|
- desc: [
|
|
|
- { required: true, message: '请填写活动形式', trigger: 'blur' }
|
|
|
- ]
|
|
|
- }
|
|
|
+ },
|
|
|
+ VisitDate: '',
|
|
|
+ dateFormat: function (value) {
|
|
|
+
|
|
|
+ // 将value转换为Date对象
|
|
|
+ var date = new Date(value);
|
|
|
+ // 获取年、月、日
|
|
|
+ var year = date.getFullYear();
|
|
|
+ var month = date.getMonth() + 1;
|
|
|
+ var day = date.getDate();
|
|
|
+ // 将月份和日期转换为两位数的格式
|
|
|
+
|
|
|
+ if (month < 10) {
|
|
|
+ month = '0' + month;
|
|
|
+ }
|
|
|
+ if (day < 10) {
|
|
|
+ day = '0' + day;
|
|
|
+ }
|
|
|
+ // 返回格式化后的日期字符串
|
|
|
+ return year + '-' + month + '-' + day;
|
|
|
+ },
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ //每页条数改变时触发 选择一页显示多少行
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.currentPage = 1;
|
|
|
+ this.pageSize = val;
|
|
|
+ },
|
|
|
+ //当前页改变时触发 跳转其他页
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.currentPage = val;
|
|
|
+ },
|
|
|
+ HotelReservationsInitialize() {
|
|
|
+ var url = "/api/Groups/HotelReservationsInitialize"
|
|
|
+ var that = this
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: url,
|
|
|
+ headers: {
|
|
|
+ Authorization: 'Bearer ' + this.token
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ UserId: that.userId,
|
|
|
+ }
|
|
|
+ }).then(function (res) {
|
|
|
+ if (res.data.code == 200) {
|
|
|
+ debugger
|
|
|
+ that.guestType = res.data.data.guestType//客人类型
|
|
|
+ that.currencyList = res.data.data.currencyList//币种下拉框
|
|
|
+ that.bankCard = res.data.data.bankCard//卡类型下拉框
|
|
|
+ that.payment = res.data.data.payment//支付方式下拉框
|
|
|
+ that.bookingWebsite = res.data.data.bookingWebsite//预订网站
|
|
|
+
|
|
|
+ that.delegationInfoList = res.data.data.delegations;
|
|
|
+ that.OpHotelReservationsData.diid = that.$route.query.diId
|
|
|
+ if (that.OpHotelReservationsData.diid == undefined) {
|
|
|
+ that.delegationInfo = that.delegationInfoList[0]
|
|
|
+ that.OpHotelReservationsData.diid = that.delegationInfoList[0].id;
|
|
|
+ that.VisitDate = that.dateFormat(that.delegationInfo.visitStartDate) + '至' + that.dateFormat(that.delegationInfo.visitEndDate);
|
|
|
+ } else {
|
|
|
+ for (let index = 0; index < that.delegationInfoList.length; index++) {
|
|
|
+ debugger
|
|
|
+ if (that.delegationInfoList[index].id == that.OpHotelReservationsData.diid) {
|
|
|
+ that.delegationInfo = that.delegationInfoList[index];
|
|
|
+ that.OpHotelReservationsData.diid = that.delegationInfoList[index].id;
|
|
|
+ that.VisitDate = that.dateFormat(that.delegationInfo.visitStartDate) + '至' + that.dateFormat(that.delegationInfo.visitEndDate);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ that.HotelReservationsByDiId();
|
|
|
+ }
|
|
|
+ }).catch(function (error) {
|
|
|
+ that.$message.error("网络错误,请稍后重试");
|
|
|
+ });
|
|
|
+ },
|
|
|
+ delegationSelectChange() {
|
|
|
+ for (let index = 0; index < this.delegationInfoList.length; index++) {
|
|
|
+ debugger
|
|
|
+ if (this.delegationInfoList[index].id == this.OpHotelReservationsData.diid) {
|
|
|
+ this.delegationInfo = this.delegationInfoList[index];
|
|
|
+ this.OpHotelReservationsData.diid = this.delegationInfoList[index].id;
|
|
|
+ this.VisitDate = this.dateFormat(this.delegationInfo.visitStartDate) + '至' + this.dateFormat(this.delegationInfo.visitEndDate);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.HotelReservationsByDiId();
|
|
|
+ },
|
|
|
+ HotelReservationsByDiId() {
|
|
|
+ var url = "/api/Groups/HotelReservationsByDiId"
|
|
|
+ var that = this
|
|
|
+ this.$axios({
|
|
|
+ method: 'post',
|
|
|
+ url: url,
|
|
|
+ headers: {
|
|
|
+ Authorization: 'Bearer ' + this.token
|
|
|
+ },
|
|
|
+ data: {
|
|
|
+ pageIndex: 0,
|
|
|
+ pageSize: 0,
|
|
|
+ portType: 1,
|
|
|
+ diId: that.OpHotelReservationsData.diid,
|
|
|
+ }
|
|
|
+ }).then(function (res) {
|
|
|
+ if (res.data.code == 200) {
|
|
|
+ that.tableDatas = res.data.data;
|
|
|
+ that.tableData = that.tableDatas
|
|
|
+ if (that.tableDatas.length != 0) {
|
|
|
+ if (that.tableDatas.slice((that.currentPage - 1) * that.pageSize, that.currentPage * that.pageSize).length == 0) {
|
|
|
+ if (that.currentPage > 1) {
|
|
|
+ that.currentPage = that.currentPage - 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).catch(function (error) {
|
|
|
+ that.$message.error("网络错误,请稍后重试");
|
|
|
+ });
|
|
|
+ },
|
|
|
submitForm(formName) {
|
|
|
this.$refs[formName].validate((valid) => {
|
|
|
if (valid) {
|
|
@@ -364,7 +613,14 @@ export default {
|
|
|
},
|
|
|
resetForm(formName) {
|
|
|
this.$refs[formName].resetFields();
|
|
|
- }
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.token = JSON.parse(localStorage.getItem('userinif')).token;
|
|
|
+ this.userId = JSON.parse(localStorage.getItem('userinif')).userInfo.userId
|
|
|
+ this.HotelReservationsInitialize();
|
|
|
+ //this.AirTicketResList()
|
|
|
}
|
|
|
}
|
|
|
</script>
|