Commit 0c50e933 authored by youjie's avatar youjie

no message

parent 74fa740e
// 用户数据通用 Mixin // 用户相关数据通用 Mixin
export const userMixin = { export const userMixin = {
data() { data() {
return { return {
......
<style scoped>
.image-slot {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.time-box.time-box2 .time-box-width span {
width: auto;
}
.flexOne {
margin: auto;
width: 70%;
min-width: 1300px;
display: flex;
justify-content: space-between;
margin-top: 15px;
align-items: flex-start;
}
.flexOne-left {
flex-grow: 1;
}
.flexOne-form-bj {
border-radius: 5px;
background: #ffffff;
padding: 15px;
margin-bottom: 20px;
}
.flexOne-form-bj h3 {
font-size: 18px;
color: black;
padding: 0 0 20px 0;
font-weight: 400;
}
.listone-form {
padding: 5px 0 15px 0;
border-radius: 5px;
background: #ffffff;
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 10px;
overflow: hidden;
border-bottom: 1px solid #eeeeee;
}
.listone-img {
width: 130px;
flex-shrink: 0;
margin-right: 15px;
border-radius: 5px;
display: block;
}
.listone-list {
flex-grow: 1;
display: flex;
justify-content: space-between;
}
.list-left h6,
.card-centent h6 {
font-size: 16px;
margin-bottom: 5px;
cursor: pointer;
}
.list-left div {
color: #7E8299;
font-size: 13px;
margin-top: 7px;
}
.list-left div a {
color: #009EF7;
font-size: 12px;
margin-left: 15px;
cursor: pointer;
}
.flexOne-time {
padding: 20px;
}
.time-box {
display: flex;
flex-direction: row;
margin-bottom: 15px;
border: 0 !important;
}
.time-box.center {
align-items: center;
}
.time-box>span {
/* width: 100px; */
flex-shrink: 0;
font-size: 13px;
color: #181C32;
margin-right: 40px;
}
.flexOne-type {
display: flex;
align-items: center;
padding: 0 0 20px 0;
}
.flexOne-type b {
font-size: 13px;
width: 100px;
flex-shrink: 0;
}
.flexOne-type div {
display: flex;
}
.flexOne-description {
padding: 15px 15px;
border-radius: 5px;
background: #E1F5FE;
margin-bottom: 20px;
}
.flexOne-description b {
font-size: 14px;
}
.flexOne-description p {
font-size: 12px;
color: #4C5759;
padding: 10px 0 0 0;
}
.flexOne-infor-box b {
font-size: 13px;
}
.infor-list {
display: flex;
flex-direction: column;
}
.list-title {
padding: 20px 0;
border-bottom: 1px dashed #eeeeee;
color: #7E8299;
font-size: 13px;
}
.list-title,
.list-centent {
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
.infor-list li {
width: 25%;
}
.list-centent li {
width: 33.33%;
}
.list-centent.active li {
width: 25%;
}
.bottom .el-form-item {
margin-bottom: 0;
}
.notice {
border-radius: 5px;
border: 1px dashed #FFA500;
background: #FFF3E0;
margin-bottom: 15px;
padding: 15px;
}
.notice b {
font-size: 13px;
}
.notice p {
color: #5E6278;
font-size: 12px;
padding: 10px 0 0 0;
}
.flexOne-right {
width: 300px;
flex-shrink: 0;
margin-left: 20px;
border-radius: 5px;
background: #ffffff;
padding: 15px;
}
.flexOne-right h4 {
padding: 10px 0 20px 0;
color: #181C32;
}
.right-text {
border: 1px dashed #F1416C;
padding: 15px 10px;
background: #FFEBEE;
font-size: 13px;
color: black;
margin-bottom: 20px;
border-radius: 5px;
}
.right-text p {
color: #6D6E83;
font-size: 12px;
padding: 10px 0 0 0;
}
.right-form {
border-top: 1px dashed #EEEEEE;
border-bottom: 1px dashed #EEEEEE;
padding: 20px 0;
}
.right-form h6 {
font-size: 14px;
color: black;
}
.noData {
text-align: center;
color: #7E8299;
font-size: 14px;
}
.right-form-list {
padding: 20px 0;
}
.right-list {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 6px;
}
.right-list-right {
font-size: 13px;
color: #181C32;
padding: 0 0 0 5px;
}
.right-Money {
padding: 20px 0;
font-size: 14px;
color: #181C32;
}
.right-Money b {
font-size: 18px;
color: #F1416C;
margin-left: 5px;
}
.right-Money,
.right-Submit {
display: flex;
flex-direction: row-reverse;
}
/deep/.el-input-number {
width: 200px;
height: 32px;
line-height: 32px;
}
/deep/.el-input-number .el-input__inner {
text-align: center;
height: 34px;
}
/deep/.line-heigh .el-input-number {
line-height: 32px;
}
</style>
<template>
<div class="flexOne">
<div class="flexOne-left">
<div class="flexOne-form-bj">
<h3>{{$t('objFill.piaoquanxinxi')}}</h3>
<div class="listone-form">
<el-image v-if="detailsObj.PicPathList" class="listone-img" :src="detailsObj.PicPathList[0]" fit="contain">
<div slot="placeholder" class="image-slot">
<span>
{{$t('objFill.jiazazhong')}}<span class="dot">...</span>
</span>
</div>
<div slot="error" class="image-slot">
<i class="el-icon-picture-outline"></i>
</div>
</el-image>
<div class="listone-list">
<div class="list-left">
<h6 @click="showCardHandler">{{detailsObj.Name}}</h6>
<p style="color: #9e9e9e;font-size: 13px;">{{$t('objFill.qingzaiqytwcyd')}}</p>
<div v-if="crmOrderObj">
<span style="color: red;">{{$t('objFill.yinliuren')}}{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/{{$t('objFill.keren')}}{{crmOrderObj.CRMGuestName}}</span>
</div>
<!-- <div>
<span>{{$t('admin.admin_address')}}{{detailsObj.CityName}} {{detailsObj.Address}}</span>
<a @click="showCardHandler"><i class="el-icon-map-location"></i> {{$t('objFill.ditu')}}</a>
</div> -->
</div>
</div>
</div>
<div class="flexOne-time">
<div class="time-box center">
<span>{{$t('objFill.youwanriqi')}}</span>
<div>
<el-date-picker class="w150" v-model='msg.UseDate' format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="date" :picker-options="beforeCheck" :laceholder="$t('objFill.menpiaoriqi')" @change="getInfo">
</el-date-picker>
</div>
</div>
<div class="time-box time-box2 center">
<span>{{$t('objFill.xuanzhepiaoxing')}}</span>
<div style="display: flex;flex-wrap: wrap;">
<template v-for="x in types">
<el-tag class="time-box-width" :type="x.checked?'':'info'"
style="margin-right: 10px;margin-bottom: 5px; cursor: pointer;" @click="changeDetailListHandler(x)">
<a>{{ x.TicketName }}</a>
<p style="display: inline-block;margin-left: 5px;">
<a
style="display: inline-block;border-left: 1px solid #E9E9EB;line-height: 17px;padding: 0 0 0 8px;">
{{x.B2BPrice.toFixed(2)}}</a>
</p>
</el-tag>
</template>
</div>
</div>
<div class="time-box">
<span>{{$t('objFill.goumaizhangshu')}}:</span>
<div style="display: flex;flex-direction: column;">
<template v-for="x in types">
<div style="flex-direction: row;" v-if="x.checked">
{{x.TicketName}}
<el-input-number v-model="x.num" @change="changePeople" :min="1" :label="$t('objFill.goumaishuliang')"
style="margin-bottom: 10px;"></el-input-number>
</div>
</template>
</div>
</div>
</div>
</div>
<div class="flexOne-form-bj">
<h3>{{$t('objFill.qupiaofanshi')}}</h3>
<div class="flexOne-type">
<b>{{$t('objFill.qupiaofanshi')}}:</b>
<div>
<el-radio v-model="msg.MailingState" label="1" @change="changePeople">{{$t('objFill.zixingqupiao')}}</el-radio>
<el-radio v-model="msg.MailingState" label="2" @change="changePeople">{{$t('objFill.youjipiaoquan')}}</el-radio>
<el-radio v-model="msg.MailingState" label="4" @change="changePeople">{{$t('objFill.dianziquan')}}</el-radio>
</div>
</div>
<div class="flexOne-description" v-if="msg.MailingState==1">
<b>{{$t('objFill.zixingqupiaosm')}}</b>
<!-- <p>自行前往指定位置取票,當您完成付款後我們將通過郵件通知您取票的門票訊息</p> -->
<p>{{$t('objFill.ziqudizhi')}}:{{SelffetchAddress}}</p>
</div>
<div class="flexOne-infor-box">
<b> {{msg.MailingState==1?$t('objFill.kerenxunxi'):msg.MailingState==2?$t('objFill.youjixunxi'):''}}</b>
<el-form v-if="msg.MailingState!=4" label-width="80px" :model="msg" :rules="rules" ref="msg">
<div class="infor-list">
<div class="list-centent" :class="{'active':msg.MailingState==1}">
<li>
<el-form-item :label="$t('admin.admin_Surname')" prop="Name">
<el-input v-model="msg.Name" :placeholder="$t('system.ph_name')" />
</el-form-item>
</li>
<li>
<el-form-item :label="$t('admin.admin_EnSurname')" prop="EName">
<el-input v-model="msg.EName" :placeholder="$t('rule.qsrywm')" />
</el-form-item>
</li>
<li>
<el-form-item :label="$t('hotel.table_tel')" prop="">
<el-input type="Number" v-model="msg.Mobile" :placeholder="$t('visaT.qsrphone')" />
</el-form-item>
</li>
<li v-if="msg.MailingState==2">
<el-popover trigger="click" placement="MailingAddress">
<el-input type="textarea" v-model="msg.MailingAddress" :autosize="{ minRows: 3, maxRows: 100}"
:placeholder="$t('objFill.shuruyoujidizhi')" />
<div slot="reference" class="name-wrapper">
<el-form-item :label="$t('objFill.youjidizhi')" prop="MailingAddress">
<el-input v-model="msg.MailingAddress" :placeholder="$t('objFill.shuruyoujidizhi')" readonly />
</el-form-item>
</div>
</el-popover>
</li>
<li class="bottom">
<el-form-item :label="$t('system.table_sex')" prop="Sex">
<el-radio v-model="msg.Sex" label="1">{{$t('visaT.boy')}}</el-radio>
<el-radio v-model="msg.Sex" label="2">{{$t('visaT.girl')}}</el-radio>
</el-form-item>
</li>
</div>
</div>
</el-form>
<div style="margin-top: 20px;">
<el-input style="width: 100%;" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" v-model="msg.Remark"
:placeholder="$t('visaT.Orderremark')" />
</div>
</div>
</div>
<div class="notice">
<b>{{$t('objFill.yudinxuzhi')}}</b>
<p>{{detailsObj.BookingInfo}}</p>
</div>
</div>
<div class="flexOne-right">
<h4>{{$t('objFill.jiesuanzhangdan')}}</h4>
<div class="right-text">
<b>{{$t('objFill.tuipiaoxianzhi')}}</b>
<p>{{$t('objFill.weixiaofeiketuits')}}</p>
</div>
<div class="right-form">
<h6>{{$t('objFill.dindanmingxi')}}</h6>
<div class="right-form-list">
<template v-if="isCheck">
<template v-for="x in types">
<div class="right-list" v-if="x.checked">
<div>
<el-tag size="mini" type="danger">{{x.TicketName}}</el-tag>
</div>
<div class="right-list-right">
{{x.B2BPrice.toFixed(2)}} x {{x.num}} {{$t('ground.zhang')}}
</div>
</div>
</template>
</template>
<div v-else class="noData">{{$t('objFill.meiyxuanzhepq')}}</div>
<div class="right-list" v-if="msg.MailingMoney>0&&msg.Money>msg.MailingMoney">
<div>
<el-tag size="mini" type="warning">{{$t('objFill.youjifei')}}</el-tag>
</div>
<div class="right-list-right">
{{msg.MailingMoney}}
</div>
</div>
</div>
</div>
<div class="right-Money">
<div>
<span>{{$t('objFill.dindianfukuan')}}:</span>
<b>{{ msg.Money>msg.MailingMoney?msg.Money.toFixed(2):0.0 }}
<span class="fz12" v-if="types&&types.length>0">
<template v-for="x in types" v-if="checkedTyps==1&&x.checked">
{{x.CurrencyName}}
</template>
<template v-if="checkedTyps>1">
{{types[0].CurrencyName}}
</template>
</span></b>
</div>
</div>
<div class="right-Submit">
<!-- <button v-else class="normalBtn" type="primary" @click="submit">
提交订单
</button> -->
<el-button :disabled="!isCheck" :loading="loading" class="normalBtn" type="primary" @click="submit">
{{$t('objFill.tijiaodindan')}}
</el-button>
</div>
</div>
<!-- 门票详情信息 -->
<el-dialog custom-class="w800" :title="$t('objFill.menpiaoxiangqing')" :visible.sync="showDetails" center @close="showDetails=false">
<ticket-card :ticket="detailsRow"></ticket-card>
</el-dialog>
</div>
</template>
<script>
import TicketCard from './components/OrderDetails.vue'
export default {
components: {
TicketCard
},
data() {
return {
checkedTyps: 0, //记录选多币种票型
isCheck: true,
showDetails: false,
loading: false,
SelffetchAddress: '',
msg: {
OrderId: 0,
Money: 0.0,
Remark: '',
MailingState: '1', //邮寄状态 1自取 2邮寄
MailingAddress: '', //MailingState =2 填写邮寄
MailingMoney: null,
SelffetchAddress: '', //自取地址
UseDate: '', //门票日期
Name: '',
EName: '',
Sex: '1', //1男2女
Birthday: '',
Mobile: '',
CouponsId: '', //景点id
DetailList: [],
LureEmpId: 0,
CRMGuestId: 0,
},
types: [],
isCheck: false,
OpenTime: '',
detailsObj: {},
beforeCheck: {
disabledDate: time => {
let endTime = new Date(this.getBeforeDate(1, new Date().Format("yyyy-MM-dd")));
return time && endTime.getTime() >= time.getTime();
}
},
rules: {
Name: [{
required: true,
message: this.$t('rule.qsrzwm'),
trigger: 'blur'
}],
EName: [{
required: true,
message: this.$t('rule.qsrywm'),
trigger: 'blur'
}],
Mobile: [{
required: true,
message: this.$t('rule.EnterPNum'),
trigger: "blur"
},
{
pattern: this.$commonUtils.Regex.el_ISphone,
message: this.$t('rule.EnterRightNum')
}
],
MailingAddress: [{
required: true,
message: this.$t('objFill.qinshuruyoujidz'),
trigger: 'blur'
}],
},
detailsRow: null,
crmOrderObj: null
};
},
methods: {
submit() {
if (this.msg.MailingState != 4) {
this.$refs['msg'].validate((valid) => {
if (valid) {
this.setFormMsg()
} else {
return false;
}
});
} else {
this.setFormMsg()
}
},
setFormMsg() {
if (this.msg.MailingState != '2') {
this.msg.MailingAddress = ''
this.msg.MailingMoney = null
}
if (this.msg.MailingState != '1') {
this.msg.SelffetchAddress = ''
}
this.msg.DetailList = []
this.types.forEach(x => {
if (x.checked) {
let y = {
TicketType: x.TicketCouponsType,
TicketName: x.TicketName,
Unit_Price: x.B2BPrice,
Num: x.num,
Money: x.B2BPrice * x.num,
TicketId: x.TicketID
}
this.msg.DetailList.push(y)
}
})
this.loading = true
this.apipost("ticket_post_SetSaleTicketOrder", this.msg,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.Success(`${this.$t('sm.xiadan')}${this.$t('objFill.chenggong')}`);
this.$router.push({
path: "/SingleticketOrderList",
});
} else {
this.Error(`${this.$t('sm.xiadan')}${this.$t('objFill.shibai')}`)
}
},
err => {
this.Error(err.message)
});
},
changePeople(val) {
this.getNum()
},
getNum() {
// 控制门票张数
// this.types.forEach(x=>{
// if(x.num>x.RemainingInventory){
// x.num = x.RemainingInventory
// }
// })
setTimeout(() => {
this.calcMoneyHandler()
}, 50)
},
calcMoneyHandler() {
this.msg.Money = 0.0
let Money = 0
if (this.msg.MailingState == 2) {
this.msg.MailingMoney = this.detailsObj.MailingMoney
} else {
this.msg.MailingMoney = 0
}
this.types.forEach(x => {
if (x.checked) {
Money += x.B2BPrice * x.num
}
})
this.msg.Money = Number(Money) + Number(this.msg.MailingMoney)
},
changeDetailListHandler(e) {
e.checked = !e.checked
this.isCheck = this.types.findIndex(x => x.checked) > -1
this.checkedTyps = 0
this.types.forEach(item => {
if (item.checked == true) {
this.checkedTyps++
}
})
if (this.isCheck) {
this.calcMoneyHandler()
} else {
this.msg.Money = 0.0
}
},
getInfo() {
let time
if (this.OpenTime != this.msg.UseDate) {
time = this.msg.UseDate
} else {
time = this.OpenTime
}
if (time) {
this.apipost(
"ticket_post_GetTicketCouponsInfo", {
CouponsId: this.msg.CouponsId,
OpenTime: time,
},
res => {
if (res.data.resultCode == 1) {
this.detailsObj = res.data.data;
this.msg.SelffetchAddress = this.detailsObj.SelffetchAddress
this.SelffetchAddress = this.detailsObj.SelffetchAddress
let addList = function (arr) {
arr.forEach(item => {
item.checked = false
item.num = 1
});
};
addList(res.data.data.TicketPriceList);
this.msg.Money = 0.00
this.types = res.data.data.TicketPriceList.filter(x => {
return x.B2BPrice > 0
})
if (this.types && this.types.length > 0) {
this.changeDetailListHandler(this.types[0])
}
if (this.types && this.types.length == 0) {
this.Error(`${this.$t('objFill.zhanwubaojiawfxd')}`)
}
} else {
this.Error(res.data.message)
}
},
err => {}
);
}
},
showCardHandler() {
this.detailsRow = JSON.parse(JSON.stringify(this.detailsObj))
this.showDetails = true
},
getProvinceList(ID, type) {
//根据省份获取城市
let msg = {
Id: ID
};
if (type == 1) {
this.msg.QProvince = 0;
this.msg.QCity = 0;
this.provinceList = [];
this.cityList = [];
} else if (type == 2) {
this.msg.City = 0;
this.cityList = [];
}
this.apipost(
"dict_post_Destination_GetChildList",
msg,
res => {
if (type == 1) {
this.provinceList = res.data.data;
} else if (type == 2) {
this.cityList = res.data.data;
}
},
err => {}
);
},
},
mounted() {
// crm自动登陆传过来的参数
if (this.$route.query.crmOrderObj) {
this.crmOrderObj = JSON.parse(this.$route.query.crmOrderObj)
this.msg.LureEmpId = this.crmOrderObj.LureEmpId
this.msg.CRMGuestId = this.crmOrderObj.CRMGuestId
}
},
created() {
this.msg.CouponsId = this.$route.query.id
this.OpenTime = this.$route.query.OpenTime
this.msg.UseDate = this.$route.query.OpenTime
this.getInfo()
}
};
</script>
...@@ -141,7 +141,7 @@ ...@@ -141,7 +141,7 @@
<!-- 抽屉插槽 --> <!-- 抽屉插槽 -->
<template slot="drawer" slot-scope="{ visible, close }"> <template slot="drawer" slot-scope="{ visible, close }">
<CruiseShipInfo v-if="visible&&userInfo.SimpleEasy==1&&ShowType==1" <CruiseShipInfo v-if="visible&&ShowType==1"
:isDrawerMode="true" :details="selectedSpotData" :isDrawerMode="true" :details="selectedSpotData"
@close="close" @save-success="handleSaveSuccess"/> @close="close" @save-success="handleSaveSuccess"/>
...@@ -336,6 +336,7 @@ export default { ...@@ -336,6 +336,7 @@ export default {
}, },
// 制作单据 // 制作单据
makeAdocument(row, index, num, Offset) { makeAdocument(row, index, num, Offset) {
if ((num == 2 || num == 3) && (row.Income+row.PlatformMoney) <= 0) { if ((num == 2 || num == 3) && (row.Income+row.PlatformMoney) <= 0) {
this.Info(this.$t('objFill.qinxianzhidanzaizhicbtkdj')) this.Info(this.$t('objFill.qinxianzhidanzaizhicbtkdj'))
return return
...@@ -362,6 +363,8 @@ export default { ...@@ -362,6 +363,8 @@ export default {
} }
if (Offset) { if (Offset) {
this.ShowType = 6 this.ShowType = 6
}else{
this.ShowType = 0
} }
query = { query = {
blank: "y", blank: "y",
......
<template>
<div class="scenic-spot-list-new">
<BaseListManager
ref="listManager"
:columns="tableColumns"
:action-column="actionColumn"
:data-list="dataList"
:loading="loading"
:pagination="pagination"
:table-config="tableConfig"
:advanced-search-config="advancedSearchConfig"
:tool-actions="toolActions"
:drawer-config="drawerConfig"
:add-action-config="addActionConfig"
@filter-change="handleFilterChange"
@advanced-search="handleAdvancedSearch"
@page-change="handlePageChange"
@tool-command="handleToolCommand"
@add-click="addSpot"
>
<!-- 景点名称插槽 -->
<template slot="scenicName" slot-scope="{ row }">
<span class="name-link" @click="goToPrice(row)">
{{ row.Name }}
</span>
</template>
<!-- 操作插槽 -->
<template slot="actions" slot-scope="{ row }">
<el-button type="text" size="mini" @click="manageData(row)">邮轮</el-button>
<el-button type="text" size="mini" @click="editSpot(row)">编辑</el-button>
<el-button
type="text"
size="mini"
class="delete-btn"
@click="deleteSpot(row)"
>删除</el-button
>
</template>
<!-- 抽屉插槽 -->
<template slot="drawer" slot-scope="{ visible, close }">
<SupplierInfo v-if="visible" :isDrawerMode="true" @close="close" @save-success="handleSaveSuccess"/>
<!-- <div v-if="visible" class="drawer-content">
<h3>邮轮信息编辑</h3>
<p>邮轮ID: {{ selectedSpotId }}</p>
<p>功能待实现...</p>
</div> -->
</template>
</BaseListManager>
</div>
</template>
<script>
import BaseListManager from "../../common/BaseListManager.vue";
import { listManagerMixin } from "../../common/mixins/listManagerMixin.js";
import scenicSpotListConfig from "./cruiseSupplierConfig.js";
import SupplierInfo from './supplierInfo.vue'
export default {
name: "ScenicSpotListNew",
mixins: [listManagerMixin],
components: {
BaseListManager,
SupplierInfo
},
data() {
return {
// 基础数据
countryList: [],
provinceList: [],
cityList: [],
districtList: [],
ticketTypeList: [],
// 选中的景点
selectedSpotId: null,
selectedSpotData: null,
// 查询参数 - 使用配置的默认参数
queryParams: {
...scenicSpotListConfig.defaultQueryParams
}
};
},
computed: {
// 表格配置
tableConfig() {
return scenicSpotListConfig.tableConfig;
},
// 表格列配置
tableColumns() {
return scenicSpotListConfig.createColumns({
cityList: this.cityList.map(city => ({
label: city.Name,
value: city.ID
})),
ticketTypeList: this.ticketTypeList.map(item => ({
label: item.Name,
value: item.ID
}))
});
},
// 操作列配置
actionColumn() {
scenicSpotListConfig.actionColumn.width = 170
return scenicSpotListConfig.actionColumn;
},
// 高级查询配置
advancedSearchConfig() {
const config = { ...scenicSpotListConfig.advancedSearchConfig };
// 动态更新选项
config.fields = config.fields.map(field => {
switch (field.key) {
case "QCountry":
return {
...field,
options: this.countryList.map(item => ({
label: item.Name,
value: item.ID
}))
};
case "QProvince":
return {
...field,
options: this.provinceList.map(item => ({
label: item.Name,
value: item.ID
}))
};
case "QCity":
return {
...field,
options: this.cityList.map(item => ({
label: item.Name,
value: item.ID
}))
};
case "TicketType":
return {
...field,
options: [
{ label: "不限", value: "-1" },
...this.ticketTypeList.map(item => ({
label: item.Name,
value: item.ID
}))
]
};
default:
return field;
}
});
return config;
},
// 工具操作配置
toolActions() {
return scenicSpotListConfig.toolActions;
},
// 抽屉配置
drawerConfig() {
return scenicSpotListConfig.drawerConfig;
},
//新增按钮
addActionConfig() {
return {
buttonText: "新增邮轮",
width: 100
}
},
},
methods: {
handleSaveSuccess() {
this.$refs.listManager.handleDrawerClose();
this.loadListData();
this.$message.success('保存成功');
},
// 重置分页索引
resetPageIndex() {
this.queryParams.pageIndex = 1;
this.pagination.currentPage = 1;
},
// 加载地区列表
loadRegionList(parentId, type) {
if (!parentId) return;
this.apipost(
scenicSpotListConfig.apiConfig.provinceList,
{ Id: parentId },
res => {
if (res.data.resultCode == 1) {
const data = res.data.data || [];
switch (type) {
case 1: // 省份
this.provinceList = data;
break;
case 2: // 城市
this.cityList = data;
break;
case 3: // 区域
this.districtList = data;
break;
}
}
},
error => {
console.error("加载地区列表失败:", error);
}
);
},
// 重写 mixin 中的筛选处理方法
handleFilterChange({ key, value }) {
// 映射列筛选器 key 到查询参数 key
const keyMapping = {
CityFilter: "QCity",
TicketTypeFilter: "TicketType",
NameFilter: "Name",
StatusFilter: "Status"
};
const actualKey = keyMapping[key] || key;
if (value === null || value === undefined) {
delete this.queryParams[actualKey];
} else {
// 处理不同类型的筛选值
let newValue = value;
// 如果是数组类型的多选筛选,转换为逗号分隔的字符串
if (Array.isArray(value)) {
newValue = value.join(",");
}
// 处理地区级联筛选
if (actualKey === "QCountry" && value !== this.queryParams.QCountry) {
this.loadRegionList(value, 1);
// 清空下级选项
delete this.queryParams.QProvince;
delete this.queryParams.QCity;
delete this.queryParams.QDistrict;
} else if (
actualKey === "QProvince" &&
value !== this.queryParams.QProvince
) {
this.loadRegionList(value, 2);
// 清空下级选项
delete this.queryParams.QCity;
delete this.queryParams.QDistrict;
} else if (actualKey === "QCity" && value !== this.queryParams.QCity) {
this.loadRegionList(value, 3);
// 清空下级选项
delete this.queryParams.QDistrict;
}
this.queryParams[actualKey] = newValue;
}
// 重置分页并重新加载数据
this.resetPageIndex();
this.loadListData();
},
handleAdvancedSearch() {
// 合并高级筛选条件到查询参数
Object.keys(filters).forEach(key => {
const value = filters[key];
if (value !== '' && value !== null && value !== undefined) {
this.queryParams[key] = value;
} else {
delete this.queryParams[key];
}
});
this.queryParams.pageIndex = 1;
this.pagination.currentPage = 1;
this.loadListData();
},
handlePageChange(page) {
this.queryParams.pageIndex = page;
this.pagination.currentPage = page;
this.loadListData();
},
// 数据加载 - 重写mixin中的方法
loadListData() {
this.loading = true;
this.apipost(
scenicSpotListConfig.apiConfig.list,
this.queryParams,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
let tempData = res.data.data.pageData || [];
this.pagination.total = res.data.data.count || 0;
// 处理景点标签数据
tempData = this.processSceniSpotData(tempData);
this.dataList = tempData;
} else {
this.$message.error(res.data.message || "加载数据失败");
}
},
error => {
this.loading = false;
this.$message.error("网络请求失败");
console.error("数据加载失败:", error);
}
);
},
// 处理景点数据
processSceniSpotData(data) {
return data.map(x => {
// 处理景点标签
if (x.ScenicSpotTag) {
const tags = x.ScenicSpotTag.split(",");
x.newAr = tags.map(tag => ({
Aname: tag.slice(0, 3),
Bname: tag
}));
}
return x;
});
},
// 初始化基础数据
async initializeData() {
await Promise.all([
this.loadCountryList(),
this.loadTypeList(),
this.loadCities()
]);
},
// 加载国家列表
loadCountryList() {
return new Promise(resolve => {
this.apipost(
scenicSpotListConfig.apiConfig.countryList,
{},
res => {
if (res.data.resultCode == 1) {
this.countryList = res.data.data || [];
}
resolve();
},
error => {
console.error("加载国家列表失败:", error);
resolve();
}
);
});
},
loadCities() {
return new Promise(resolve => {
this.apipost(
scenicSpotListConfig.apiConfig.cityList,
{},
res => {
if (res.data.resultCode == 1) {
this.cityList = res.data.data || [];
}
resolve();
},
error => {
console.error("加载国家列表失败:", error);
resolve();
}
);
});
},
// 加载门票类型列表
loadTypeList() {
return new Promise(resolve => {
this.apipost(
scenicSpotListConfig.apiConfig.ticketTypeList,
{},
res => {
if (res.data.resultCode == 1) {
this.ticketTypeList = res.data.data || [];
}
resolve();
},
error => {
console.error("加载门票类型列表失败:", error);
resolve();
}
);
});
},
// 工具命令处理
handleToolCommand(command) {
switch (command) {
case "add":
this.addSpot();
break;
case "export":
this.exportData();
break;
case "refresh":
this.loadListData();
break;
case "clearFilters":
this.clearAllFilters();
break;
default:
console.warn("未知的工具命令:", command);
}
},
// 添加景点
addSpot() {
this.selectedSpotId = null;
this.selectedSpotData = null;
this.$refs.listManager.openDrawer(null);
},
// 修改景点
editSpot(row) {
this.selectedSpotId = row.ID;
this.selectedSpotData = row;
this.$refs.listManager.openDrawer(row);
},
// 门票管理
manageData(row) {
this.$router.push({
path: "scenicAllPriceSelect",
query: {
CouponsId: row.ID,
blank: "y",
tab: "邮轮价格"
}
});
},
// 删除景点
deleteSpot(row) {
this.$confirm(`确定要删除邮轮「${row.Name}」吗?`, "删除确认", {
confirmButtonText: "确定删除",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.apipost(
scenicSpotListConfig.apiConfig.delete,
{ ID: row.ID },
res => {
if (res.data.resultCode === 1) {
this.$message.success("删除成功");
this.loadListData();
} else {
this.$message.error(res.data.message || "删除失败");
}
}
);
});
},
// 跳转到价格页面
goToPrice(row) {
this.$router.push({
path: "scenicAllPriceSelect",
query: {
CouponsId: row.ID,
blank: "y",
tab: "邮轮价格"
}
});
},
// 导出数据
exportData() {
const fileName = `邮轮信息_${new Date()
.toISOString()
.slice(0, 19)
.replace(/:/g, "-")}.xlsx`;
this.GetLocalFile(
scenicSpotListConfig.apiConfig.export,
this.queryParams,
fileName,
() => {
this.$message.success("导出成功");
},
() => {
this.$message.error("导出失败");
}
);
},
// 清除所有筛选条件
clearAllFilters() {
this.queryParams = { ...scenicSpotListConfig.defaultQueryParams };
this.pagination.currentPage = 1;
this.loadListData();
},
// 抽屉事件处理
handleDrawerClose() {
this.selectedSpotId = null;
this.selectedSpotData = null;
},
handleDrawerSaveSuccess() {
this.$message.success("保存成功");
this.handleDrawerClose();
this.loadListData();
}
},
created() {
// 初始化数据
this.initializeData();
// 处理路由参数
if (this.$route.query.ID) {
this.queryParams.ID = this.$route.query.ID;
}
},
mounted() {
// 加载数据
this.loadListData();
}
};
</script>
<style scoped>
.scenic-spot-list-new {
width: calc(100% + 38px);
margin: 0 -19px;
height: 100%;
}
.name-link {
color: #1890ff;
cursor: pointer;
text-decoration: none;
}
.name-link:hover {
color: #40a9ff;
text-decoration: underline;
}
.delete-btn {
color: #ff1869 !important;
&:hover {
color: #ff4d6d !important;
}
}
.drawer-content {
padding: 20px;
}
</style>
// 邮轮列表配置
export const scenicSpotListConfig = {
// 表格基础配置
tableConfig: {
height: '100%',
border: true,
stripe: true,
size: 'mini',
'empty-text': '暂无邮轮数据'
},
// 分页配置
paginationConfig: {
background: true,
layout: 'total, sizes, prev, pager, next, jumper',
'pager-count': 7,
'hide-on-single-page': false,
'page-sizes': [10, 14, 20, 25, 50, 100],
'page-size': 14,
'current-page': 1,
small: false,
disabled: false,
'prev-text': '',
'next-text': '',
total: 0
},
// 分页默认配置
defaultPagination: {
currentPage: 1,
pageSize: 14,
total: 0,
pageSizes: [10, 14, 20, 25, 50, 100]
},
// 列配置工厂函数
createColumns: (options = {}) => [
{
id: 'scenic-name-column',
label: '邮轮名称',
prop: 'Name',
minWidth: 150,
// fixed: 'left',
type: 'link',
slotName: 'scenicName',
filter: {
type: 'input',
key: 'NameFilter',
placeholder: '输入邮轮名称'
}
},
{
id: 'city-column',
label: '城市',
prop: 'CityName',
minWidth: 100,
slotName: 'cityName',
filter: {
type: 'select',
key: 'CityFilter',
placeholder: '选择城市',
searchable: true,
multiple: true,
options: options.cityList || []
}
},
{
id: 'ticket-type-column',
label: '邮轮类型',
prop: 'TicketTypeName',
minWidth: 120,
slotName: 'ticketType',
filter: {
type: 'select',
key: 'TicketTypeFilter',
placeholder: '选择邮轮类型',
multiple: true,
options: options.ticketTypeList || []
}
},
{
label: '邮轮名称英文',
prop: 'RealName',
minWidth: 150,
slotName: 'realName',
emptyText: '-',
filter: {
type: 'input',
key: 'EnNameFilter',
placeholder: '输入邮轮英文名称'
}
},
{
label: '营业时间',
prop: 'OpeningHours',
minWidth: 150,
slotName: 'businessHours',
emptyText: '-'
},
{
label: '最后更新时间',
prop: 'UpdateDate',
minWidth: 150,
slotName: 'updateDate',
emptyText: '-'
},
{
label: '状态',
prop: 'Status',
minWidth: 80,
slotName: 'status',
filter: {
type: 'select',
key: 'StatusFilter',
placeholder: '选择状态',
options: [
{ label: '正常', value: '0' },
{ label: '删除', value: '1' }
]
}
}
],
// 操作列配置
actionColumn: {
label: '操作',
width: 120,
fixed: 'right'
},
// 高级查询配置
advancedSearchConfig: {
title: '高级查询',
buttonText: '高级查询',
width: 600,
fields: [
{
key: 'QCountry',
label: '国家',
type: 'select',
placeholder: '选择国家',
span: 8,
options: [] // 动态填充
},
{
key: 'QProvince',
label: '省份',
type: 'select',
placeholder: '选择省份',
span: 8,
options: [] // 动态填充
}
]
},
// 工具操作配置
toolActions: [
// {
// command: 'add',
// label: '添加邮轮',
// type: 'primary',
// icon: 'el-icon-plus',
// permission: 'scenic.add'
// },
{
command: 'export',
label: '导出数据',
icon: 'el-icon-download',
permission: 'scenic.export'
},
{
command: 'importData',
label: '导入数据',
icon: 'el-icon-upload2',
permission: 'scenic.import'
},
{
command: 'refresh',
label: '刷新',
icon: 'el-icon-refresh',
type: 'default'
},
{
command: 'clearFilters',
label: '清除筛选',
icon: 'el-icon-delete',
type: 'warning'
}
],
// 抽屉配置
drawerConfig: {
title: '邮轮信息',
size: '90%',
direction: 'rtl'
},
// API 配置
apiConfig: {
list: 'ticketcoupons_post_GetPageList',
delete: 'ticketcoupons_post_Remove',
export: 'dmcstatistics_post_GetTicketCouponsExport',
import: 'ticketcoupons_post_ImportData',
countryList: 'dict_post_Destination_GetCountry',
provinceList: 'dict_post_Destination_GetChildList',
employeeList: 'admin_get_EmployeeGetList',
ticketTypeList: 'ticketcoupons_get_GetBYTicketTypeEnumList',
batchDelete: 'ticketcoupons_post_BatchRemove',
uploadTemplate: 'file_post_UploadTemplate',
cityList:'dict_post_Destination_GetCityList'
},
// 默认查询参数
defaultQueryParams: {
pageIndex: 1,
pageSize: 14,
Name: "",
QCountry: "",
QProvince: "",
QCity: "",
QDistrict: "",
Status: "0",
TicketType: "-1",
UpdateBy: 0,
SelectType: 1
},
// 分页配置工具方法
createPaginationConfig: (options = {}) => ({
...scenicSpotListConfig.paginationConfig,
...options
}),
// 验证分页参数
validatePaginationParams: (pageIndex, pageSize, total) => {
const validPageSizes = [10, 14, 20, 25, 50, 100]
const normalizedPageSize = validPageSizes.includes(pageSize) ? pageSize : 14
const maxPage = total > 0 ? Math.ceil(total / normalizedPageSize) : 1
const normalizedPageIndex = Math.max(1, Math.min(pageIndex, maxPage))
return {
pageIndex: normalizedPageIndex,
pageSize: normalizedPageSize,
isValid: pageIndex === normalizedPageIndex && pageSize === normalizedPageSize
}
}
}
// 导出默认配置
export default scenicSpotListConfig
// 导出分页配置工具方法
export const createPaginationConfig = scenicSpotListConfig.createPaginationConfig
export const validatePaginationParams = scenicSpotListConfig.validatePaginationParams
<style>
@import "../../../assets/css/DMC.css";
.drawer-mode {
display: flex;
height: 100%;
flex-direction: column;
}
/* 抽屉模式下的样式优化 */
.drawer-mode .changInfo {
padding: 0;
margin: 0;
height: 100%;
display: flex;
flex-direction: column;
}
.drawer-mode .resource-content {
padding: 0;
flex: 1;
overflow: hidden;
margin: 0 !important;
}
.drawer-mode .hotel-form-container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
/* Tabs 样式优化 */
.drawer-mode .hotel-tabs {
flex: 1;
display: flex;
flex-direction: column;
border: none;
box-shadow: none;
}
.drawer-mode .hotel-tabs .el-tabs__header {
margin: 0;
background: #f8f9fa;
border-bottom: 1px solid #e8e8e8;
}
.drawer-mode .hotel-tabs .el-tabs__nav-wrap {
padding: 0 20px;
}
.drawer-mode .hotel-tabs .el-tabs__item {
height: 40px;
line-height: 40px;
font-size: 13px;
font-weight: 500;
color: #595959;
border: none;
padding: 0 20px;
}
.drawer-mode .hotel-tabs .el-tabs__item.is-active {
color: #1890ff;
background: #fff;
border-bottom: 2px solid #1890ff;
}
.drawer-mode .hotel-tabs .el-tabs__content {
flex: 1;
overflow-y: auto;
padding: 0;
}
.drawer-mode .hotel-tabs .el-tab-pane {
height: 100%;
}
/* Tab 内容区域 */
.drawer-mode .tab-content {
padding: 20px;
height: 100%;
overflow-y: auto;
}
/* 表单样式优化 */
.drawer-mode .el-form {
padding: 0;
}
.drawer-mode .el-form-item {
margin-bottom: 16px;
}
.drawer-mode .el-form-item__label {
font-size: 13px;
font-weight: 500;
line-height: 32px;
color: #262626;
width: 120px !important;
}
/* 输入框和下拉框优化 */
.drawer-mode .el-input,
.drawer-mode .el-select {
width: 100%;
}
.drawer-mode .el-input__inner,
.drawer-mode .el-select .el-input__inner {
height: 32px;
line-height: 32px;
font-size: 13px;
border: 1px solid #d9d9d9;
border-radius: 4px;
transition: all 0.2s ease;
}
.drawer-mode .el-input__inner:focus,
.drawer-mode .el-select .el-input__inner:focus {
border-color: #1890ff;
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
}
.drawer-mode .el-textarea__inner {
font-size: 13px;
border: 1px solid #d9d9d9;
border-radius: 4px;
min-height: 60px;
}
.drawer-mode .el-textarea__inner:focus {
border-color: #1890ff;
box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
}
/* 日期选择器优化 */
.drawer-mode .el-date-editor {
width: 100%;
}
.drawer-mode .el-date-editor .el-input__inner {
height: 32px;
line-height: 32px;
}
/* 联系人区域样式 */
.drawer-mode .contact-header {
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #e8e8e8;
text-align: right;
}
.drawer-mode .contact-item {
margin-bottom: 12px;
padding: 12px;
background: #fafbfc;
border: 1px solid #e8e8e8;
border-radius: 6px;
position: relative;
display: flex;
align-items: start;
padding-bottom: 0;
}
.drawer-mode .contact-item .el-form-item__content {
margin-left: 0px !important;
}
/* 上传区域样式 */
.drawer-mode .upload-section {
display: flex;
flex-direction: column;
gap: 8px;
}
.drawer-mode .upload-section a {
color: #1890ff;
text-decoration: none;
font-size: 13px;
margin-right: 8px;
display: inline-block;
margin-bottom: 4px;
}
.drawer-mode .upload-section a:hover {
color: #40a9ff;
text-decoration: underline;
}
/* 按钮区域优化 */
.drawer-mode .btn-list {
position: sticky;
bottom: 0;
background: #fff;
padding: 16px 20px;
border-top: 1px solid #e8e8e8;
margin: 0;
z-index: 100;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
}
.drawer-mode .btn-actions {
display: flex;
justify-content: flex-end;
gap: 12px;
}
.drawer-mode .save-Btn,
.drawer-mode .cancel-Btn {
height: 36px;
padding: 0 20px;
font-size: 14px;
border-radius: 4px;
cursor: pointer;
border: 1px solid;
transition: all 0.2s ease;
}
.drawer-mode .save-Btn {
background: #1890ff;
border-color: #1890ff;
color: #fff;
}
.drawer-mode .save-Btn:hover {
background: #40a9ff;
border-color: #40a9ff;
}
.drawer-mode .save-Btn:disabled {
background: #d9d9d9;
border-color: #d9d9d9;
color: #bfbfbf;
cursor: not-allowed;
}
.drawer-mode .save-Btn:disabled:hover {
background: #d9d9d9;
border-color: #d9d9d9;
}
.drawer-mode .cancel-Btn {
background: #fff;
border-color: #d9d9d9;
color: #595959;
}
.drawer-mode .cancel-Btn:hover {
background: #f5f5f5;
border-color: #40a9ff;
color: #40a9ff;
}
/* 上传按钮优化 */
.drawer-mode .el-button--small {
height: 28px;
padding: 0 12px;
font-size: 12px;
border-radius: 4px;
}
.drawer-mode .el-button--primary.el-button--small {
background: #1890ff;
border-color: #1890ff;
}
.drawer-mode .el-button--primary.el-button--small:hover {
background: #40a9ff;
border-color: #40a9ff;
}
/* 滚动条样式 */
.drawer-mode .tab-content::-webkit-scrollbar {
width: 6px;
}
.drawer-mode .tab-content::-webkit-scrollbar-track {
background-color: #f6f8fa;
border-radius: 3px;
}
.drawer-mode .tab-content::-webkit-scrollbar-thumb {
background-color: #d0d7de;
border-radius: 3px;
}
.drawer-mode .tab-content::-webkit-scrollbar-thumb:hover {
background-color: #8c959f;
}
/* 加载状态样式 */
.loading-container {
display: flex;
align-items: center;
justify-content: center;
min-height: 300px;
padding: 40px;
}
.loading-content {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.loading-content .el-loading-spinner {
margin-bottom: 16px;
}
.loading-content .el-loading-spinner .circular {
width: 32px;
height: 32px;
color: #1890ff;
}
.loading-content p {
color: #666;
font-size: 14px;
margin: 0;
}
/* 错误状态样式 */
.error-container {
display: flex;
align-items: center;
justify-content: center;
min-height: 300px;
padding: 40px;
}
.error-content {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
max-width: 400px;
}
.error-content .el-icon-warning {
font-size: 48px;
color: #f56c6c;
margin-bottom: 16px;
}
.error-content .error-title {
color: #f56c6c;
font-size: 16px;
font-weight: 500;
margin: 0 0 8px 0;
}
.error-content .error-message {
color: #666;
font-size: 14px;
margin: 0 0 20px 0;
line-height: 1.5;
}
.error-actions {
display: flex;
gap: 12px;
}
.error-actions .el-button {
min-width: 80px;
}
/* 响应式优化 */
@media (max-width: 1200px) {
.drawer-mode .el-col[class*="span-6"] {
width: 50% !important;
}
.drawer-mode .el-col[class*="span-4"] {
width: 33.333% !important;
}
}
@media (max-width: 768px) {
.drawer-mode .el-col[class*="span-"] {
width: 100% !important;
}
.drawer-mode .tab-content {
padding: 16px;
}
.drawer-mode .el-form-item__label {
width: 100px !important;
}
.loading-container,
.error-container {
min-height: 200px;
padding: 20px;
}
.error-actions {
flex-direction: column;
width: 100%;
}
.error-actions .el-button {
width: 100%;
}
}
</style>
<template>
<div class="flexOne changInfo" :class="{ 'drawer-mode': isDrawerMode }">
<!-- 加载状态 -->
<div v-if="isLoading" class="loading-container" style="flex: 1;">
<div class="loading-content">
<p>{{ isRetrying ? '重新加载中...' : '正在加载酒店信息...' }}</p>
</div>
</div>
<!-- 错误状态 -->
<div v-else-if="loadError" class="error-container" style="flex: 1;">
<div class="error-content">
<i class="el-icon-warning"></i>
<p class="error-title">加载失败</p>
<p class="error-message">{{ loadError }}</p>
<div class="error-actions">
<el-button type="primary" @click="retryLoad" :loading="isRetrying">
{{ isRetrying ? '重试中...' : '重试' }}
</el-button>
<el-button @click="$emit('close')" v-if="isDrawerMode">关闭</el-button>
</div>
</div>
</div>
<!-- 正常内容 -->
<div v-else class="resource-content clearfix">
<el-form :model="addMsg" :rules="rules" class="h-full" ref="addMsg" label-width="120px">
<div class="hotel-form-container h-full">
<el-tabs v-model="activeTab" type="border-card" class="hotel-tabs">
<el-tab-pane label="基础资料" name="basic">
<div class="tab-content">
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="区域">
<el-select :placeholder="$t('ground.qingxuanzesheng')" filterable v-model="addMsg.Province"
@change=" GetSubAreaList(addMsg.Province,'city'),addMsg.City=0">
<el-option :label="$t('pub.unlimitedSel')" :value='SelectDefaultValue'></el-option>
<el-option v-for="childItem in ProvinceList" :key="childItem.ID" :label="childItem.Name"
:value="childItem.ID">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('hotel.hotel_city')">
<el-select :placeholder="$t('ground.qingxuanzeshi')" filterable v-model="addMsg.City">
<el-option :label="$t('pub.unlimitedSel')" :value='SelectDefaultValue'></el-option>
<el-option v-for="childItem in CityList" :key="childItem.ID" :label="childItem.Name"
:value="childItem.ID">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('hotel.hotel_starlevel')">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.Star">
<el-option :label="$t('pub.unlimitedSel')" :value='SelectDefaultValue'></el-option>
<el-option v-for="item in starList" :key="item.ID" :label="item.Content" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="总房间数">
<el-input type="text" v-model="addMsg.RoomNumber" maxlength="50"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item :label="$t('hotel.hotel_name')" prop="Name">
<el-input type="text" v-model="addMsg.Name" maxlength="100"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="开业年份">
<el-date-picker v-model="addMsg.OpenTime" type="year" placeholder="选择年">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="整修年份">
<el-date-picker v-model="addMsg.DecorationTime" type="year" placeholder="选择年">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item :label="$t('hotel.hotel_detailinfo')">
<el-input :placeholder="$t('fnc.qsrneirong')" v-model="addMsg.Address">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('hotel.hotel_website')">
<el-input v-model="addMsg.URL" maxlength="200"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="飯店編號">
<el-input v-model="addMsg.HotelCode" maxlength="50"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="成團間數">
<el-input v-model="addMsg.CTJS" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('hotel.hotel_landline')">
<el-input type="text" v-model="addMsg.Tel" maxlength="20"
:placeholder="$t('hotel.hotel_landline')"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="COD天數">
<el-input v-model="addMsg.CodDay" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="合約最終日期">
<el-date-picker v-model="addMsg.ContractTime" type="date" placeholder="选择日期"
value-format="yyyy/MM/dd">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="澡盆">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.ZaoPen">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option v-for="item in baseList" :key="`Z_`+item.ID" :label="item.Name" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="連通房">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.LTF">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option v-for="item in baseList" :key="`L_`+item.ID" :label="item.Name" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="嬰兒床">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.YRC">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option v-for="item in baseList" :key="`Y_`+item.ID" :label="item.Name" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="是否含VAT">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.VAT">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option v-for="(item) in vatList" :key="`V_`+item.ID" :label="item.Name" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="報價方式">
<el-select :placeholder="$t('pub.unlimitedSel')" v-model="addMsg.BJFS">
<el-option :label="$t('pub.unlimitedSel')" value=''></el-option>
<el-option v-for="(item) in bjfsList" :key="`B_`+item.ID" :label="item.Name" :value="item.Name">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="18">
<el-form-item label="房價備註事項">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==2" :key="index" type="textarea" v-model="item.Content" autosize>
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="行程或注意事項">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<template v-if="item.HSType==1" v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='TripNotice'">点击上传</el-button>
</el-upload>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="星等證明">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==3" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='XDZM'">点击上传</el-button>
</el-upload>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="飯店Drive">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<template v-if="item.HSType==4" v-for="(subItem,subIndex) in item.ContentList">
<el-input :key="`f_`+index+subIndex" v-model="subItem.Url">
<el-button slot="append" v-if="subIndex==0" @click="AddDrive()">添加</el-button>
<el-button slot="append" v-if="subIndex!=0" @click="DeleteDrive(subIndex)">删除</el-button>
</el-input>
</template>
</template>
</template>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="加床照片">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==6" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='JCZP'">点击上传</el-button>
</el-upload>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="24">
<el-form-item label="飯店簡介&尺寸">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==5" :key="index" type="textarea" v-model="item.Content" autosize>
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-tab-pane>
<el-tab-pane label="实用资讯" name="practical">
<div class="tab-content">
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="TWN總房間數">
<el-input v-model="addMsg.TWNRoomNum" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="加床費用">
<el-input v-model="addMsg.AddBedFee" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="FOC">
<el-input v-model="addMsg.FOC" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="DBL總房間數">
<el-input v-model="addMsg.DBLRoomNum" maxlength="50">
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="6">
<el-form-item label="早餐費用">
<el-input v-model="addMsg.BreakfastFee" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="早餐廳可容納人數">
<el-input v-model="addMsg.BreakfastPeople" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="飯店接送">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==7" :key="index" v-model="item.Content">
</el-input>
</template>
</template>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="會議室間數">
<el-input v-model="addMsg.MeetRoom" maxlength="50">
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="8">
<el-form-item label="會議室最大容納人數">
<el-input v-model="addMsg.MaxMeetRoom" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="餐廳數量">
<el-input v-model="addMsg.DinnerQuantity" maxlength="50">
</el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="内部房">
<el-input v-model="addMsg.InternalRoom" maxlength="50">
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="24">
<el-form-item label="特別房型備註">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==8" :key="index" v-model="item.Content">
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="24">
<el-form-item label="內部房規定">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==9" :key="index" v-model="item.Content">
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="24">
<el-form-item label="接送備註">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==10" :key="index" v-model="item.Content">
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-tab-pane>
<el-tab-pane label="饭店联系人" name="contact">
<div class="tab-content">
<div class="contact-header">
<el-button type="primary" size="small" @click="AddContract()">添加联系人</el-button>
</div>
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<template v-if="item.HSType==18" v-for="(subItem,subIndex) in item.ContractList">
<div class="contact-item" :key="`contact-${index}-${subIndex}`">
<el-row :gutter="16" style="flex: 1;">
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入编号" v-model="subItem.LinkNo">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入聯絡人" v-model="subItem.LinkMan">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入職稱" v-model="subItem.ZhiChen">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入E-mail" v-model="subItem.LinkEmail">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入電話" v-model="subItem.LinkTel">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-input placeholder="请输入備註" v-model="subItem.LinkRemark">
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-button style="margin-top: 8px; margin-left: 10px;" type="danger" size="mini"
@click="deleteContract(subIndex)">删除</el-button>
</div>
</template>
</template>
</template>
</div>
</el-tab-pane>
<el-tab-pane label="内部资讯" name="internal">
<div class="tab-content">
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="房價">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==11" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='PriceUrl'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="FOC規定">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==12" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='FOCDesc'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="附加費">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==13" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='FuJiaDesc'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="取消規定">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==14" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='CancelDesc'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="12">
<el-form-item label="小童備註">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==15" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='ChildDesc'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="合約資訊">
<div class="upload-section">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-if="item.HSType==17" v-for="(item,index) in addMsg.HotelDetailsList">
<template v-for="(subItem,subIndex) in item.ContentList">
<a :href="subItem.Url" target="_blank">{{subItem.Name}}</a>
</template>
</template>
</template>
<el-upload class="upload-demo" :http-request="UploadImage" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<el-button size="small" type="primary" @click="uploadType='ContractDesc'">点击上传</el-button>
</el-upload>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="16">
<el-col :span="24">
<el-form-item label="匯款資訊">
<template v-if="addMsg.HotelDetailsList&&addMsg.HotelDetailsList.length>0">
<template v-for="(item,index) in addMsg.HotelDetailsList">
<el-input v-if="item.HSType==16" :key="index" v-model="item.Content">
</el-input>
</template>
</template>
</el-form-item>
</el-col>
</el-row>
</div>
</el-tab-pane>
</el-tabs>
</div>
</el-form>
</div>
<el-dialog custom-class="resourceImgAdd" :title="$t('ground.xuanzetupian')" center :visible.sync="addimg">
<DMCchooseImg @closeImg="closeDMCchooseImg" ref="DMCchooseImg1" @headCallBack="getDMCimg" v-bind:imgType="1">
</DMCchooseImg>
</el-dialog>
<div class="btn-list">
<div class="btn-actions">
<button class="save-Btn" @click="submitForm('addMsg')" :disabled="isSaving">
<i v-if="isSaving" class="el-icon-loading" style="margin-right: 4px;"></i>
{{ isSaving ? '' : $t('pub.saveBtn') }}
</button>
<button class="cancel-Btn" @click="goUrl('HotelManagement')">
{{ isDrawerMode ? '关闭' : $t('pub.cancelBtn') }}
</button>
</div>
</div>
<viewer :images="images" :options='imageOptions' @inited="inited" class="viewer" ref="viewer">
<img v-for="src in images" :src="src" :key="src">
</viewer>
</div>
</template>
<script>
import DMCchooseImg from "../../commonPage/DMCchooseImg.vue";
export default {
props: {
hotelId: {
type: [String, Number],
default: 0
},
isDrawerMode: {
type: Boolean,
default: false
}
},
data() {
return {
activeTab: 'basic', // 默认激活基础资料标签页
isLoading: false, // 加载状态
loadError: null, // 加载错误信息
isSaving: false, // 保存状态
isRetrying: false, // 重试状态
imageOptions: {
navbar: false,
title: false
},
images: [],
//是否显示添加图片
addimg: false,
//上传的文件数组
HotelImageArray: [],
//删除的图片文件数组
DeleteImageArray: [],
//地接资源图片
imglistArry: [],
//地接图片搜索关键字
imgKeyword: "",
starslevel: "", //获取酒店星级
totalimg: "",
selecnum: 0,
imgBeforeFile: this.domainManager().ViittoFileUrl,
//下拉框默认值
SelectDefaultValue: 0,
//国家列表
CountryList: [],
//省份列表
ProvinceList: [],
//城市列表
CityList: [],
addMsg: {
ID: 0, //酒店编号
Name: "", //酒店名称
HotelCode: "", //酒店编码
Tel: "", //酒店电话
Star: 0, //星级
URL: "", //网址
Country: 0, //国家
Province: 0, //省份
City: 0, //城市
Address: "", //地址
Lng: "",
Lat: "",
RoomNumber: 0, //总房间数
ContractTime: "", //合约最终日期
OpenTime: "", //开业年份
DecorationTime: "", //整修年份
CodDay: "", //COD天数
ZaoPen: "", //澡盆
CTJS: "", //成团间数
LTF: "", //连通房
YRC: "", //婴儿床
VAT: "", //是否含VAT
BJFS: "", //报价方式
TWNRoomNum: 0, //TWN总房间数
AddBedFee: 0, //加床费用
FOC: "", //FOC
DBLRoomNum: 0, //DBL总房间数
BreakfastFee: 0, //早餐费用
BreakfastPeople: "", //早餐厅可容纳人数
MeetRoom: "", //会议室间数
MaxMeetRoom: "", //会议室最大容纳人数
DinnerQuantity: "", //餐厅数量
InternalRoom: "", //内部房
HotelDetailsList: [] //酒店其他信息列表
},
uploadType: "", //上传文件类型
baseList: [], //澡盆,婴儿床,连通房
vatList: [], //VAT配置
starList: [], //星级
bjfsList: [], //报价方式
configDetailsList: [], //酒店
rules: {
//表单必填验证
Name: [{
required: true,
message: this.$t('ground.qingtianxiemc'),
trigger: "change"
}],
Address: [{
required: true,
message: this.$t('ground.qingxuanzedz'),
trigger: "change"
}],
}
};
},
components: {
DMCchooseImg: DMCchooseImg
},
methods: {
//上传酒店图片
UploadImage(file) {
let newArr = [];
newArr.push(file.file);
let fileName = file.file.name;
var path = "/Upload/DMC/";
var that = this;
this.UploadSelfFileT(path, newArr, x => {
var sourceFileName = x.data.SourceFileName;
var imgUrl = that.domainManager().ViittoFileUrl + x.data.FilePath;
that.addMsg.HotelDetailsList.forEach(item => {
//行程或注意事项
if (that.uploadType == "TripNotice" && item.HSType == 1) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//星等证明
else if (that.uploadType == 'XDZM' && item.HSType == 3) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//加床照片
else if (that.uploadType == 'JCZP' && item.HSType == 6) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//房價图片
else if (that.uploadType == 'PriceUrl' && item.HSType == 11) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//FOC規定
else if (that.uploadType == 'FOCDesc' && item.HSType == 12) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//附加費
else if (that.uploadType == 'FuJiaDesc' && item.HSType == 13) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//取消規定
else if (that.uploadType == 'CancelDesc' && item.HSType == 14) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//小童備註
else if (that.uploadType == 'ChildDesc' && item.HSType == 15) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
//合約資訊
else if (that.uploadType == 'ContractDesc' && item.HSType == 17) {
item.ContentList[0].Name = sourceFileName;
item.ContentList[0].Url = imgUrl;
}
})
});
},
//添加Drive
AddDrive() {
if (this.addMsg.HotelDetailsList && this.addMsg.HotelDetailsList.length > 0) {
var tempObj = this.addMsg.HotelDetailsList.find(qitem => qitem.HSType == 4);
if (!tempObj) {
var contractObj = {
HSType: 4,
TextType: 2,
ContentList: [],
}
this.addMsg.HotelDetailsList.push(contractObj)
}
this.addMsg.HotelDetailsList.forEach(item => {
if (item.HSType == 4) {
if (!item.ContentList) {
item.ContentList = [];
}
var cObj = {
Name: "", //名称
Url: "", //地址
};
item.ContentList.push(cObj);
}
})
}
},
//删除Drive
DeleteDrive(index) {
if (this.addMsg.HotelDetailsList && this.addMsg.HotelDetailsList.length > 0) {
this.addMsg.HotelDetailsList.forEach(item => {
if (item.HSType == 4) {
item.ContentList.splice(index, 1);
}
})
}
},
//添加联系人
AddContract() {
if (this.addMsg.HotelDetailsList && this.addMsg.HotelDetailsList.length > 0) {
var tempObj = this.addMsg.HotelDetailsList.find(qitem => qitem.HSType == 18);
if (!tempObj) {
var contractObj = {
HSType: 18, //联系人
TextType: 2, //JSON格式
ContractList: [],
}
this.addMsg.HotelDetailsList.push(contractObj)
}
this.addMsg.HotelDetailsList.forEach(item => {
if (item.HSType == 18) {
if (!item.ContractList) {
item.ContractList = [];
}
var cObj = {
LinkNo: "", //编号
LinkMan: "", //联系人
ZhiChen: "", //职称
LinkTel: "", //电话
LinkEmail: "", //邮箱
LinkRemark: "", //备注
};
item.ContractList.push(cObj);
}
})
}
},
//删除联系人
deleteContract(index) {
if (this.addMsg.HotelDetailsList && this.addMsg.HotelDetailsList.length > 0) {
this.addMsg.HotelDetailsList.forEach(item => {
if (item.HSType == 18) {
item.ContractList.splice(index, 1);
}
})
}
},
//删除图片
delImg(index) {
var item = this.HotelImageArray[index];
this.DeleteImageArray.push(item);
this.HotelImageArray.splice(index, 1);
},
inited(viewer) {
this.$viewer = viewer
},
showImg: function (src) {
let srcArr = src.split('?')
src = srcArr[0]
let isExsit = false
this.images.forEach(x => {
if (x === src)
isExsit = true
})
if (!isExsit) {
this.images.push(src)
} else {
this.$viewer.view(this.images.indexOf(src))
}
this.$viewer.show()
},
addImgOpen() {
this.addimg = true;
this.initimgList();
},
saveResource() {
// 防重复提交
if (this.isSaving) {
return;
}
this.isSaving = true;
this.apipost(
"hotel_post_Set",
this.addMsg,
response => {
this.isSaving = false;
//修改添加接口
if (response.data.resultCode == 1) {
this.Success(this.$t('tips.saveYes'))
if (this.isDrawerMode) {
this.$emit('save-success')
} else {
this.goUrl("HotelManagement")
}
} else {
this.Error(response.data.message)
}
},
error => {
this.isSaving = false;
this.Error('保存失败,请检查网络连接');
}
)
},
selectImg(index) {
//选取弹窗图片
this.imglistArry[index].isShow = !this.imglistArry[index].isShow;
let num = 0;
if (this.imglistArry != null) {
this.imglistArry.forEach(x => {
if (x.isShow == true) {
num++;
}
this.selecnum = num;
});
}
},
initHotelData() {
// 验证酒店ID
if (!this.addMsg.ID || this.addMsg.ID <= 0) {
this.loadError = '无效的酒店ID';
return;
}
// 设置加载状态
this.isLoading = true;
this.loadError = null;
var msg = {
hotelID: this.addMsg.ID
};
var _self = this;
this.apipost(
"hotel_post_GetAll",
msg,
res => {
_self.isLoading = false;
_self.isRetrying = false;
if (res.data.resultCode == 1) {
_self.addMsg = res.data.data;
if (_self.addMsg.Province > 0) {
this.GetSubAreaList(_self.addMsg.Province, 'city');
}
} else {
_self.loadError = res.data.message || '加载酒店信息失败';
_self.Error(res.data.message);
}
},
error => {
_self.isLoading = false;
_self.isRetrying = false;
_self.loadError = '网络请求失败,请检查网络连接';
_self.Error('网络请求失败,请检查网络连接');
}
);
},
// 重试加载方法
retryLoad() {
this.isRetrying = true;
this.initHotelData();
},
goUrl(path) {
if (this.isDrawerMode) {
this.$emit('close')
} else {
this.$router.push({
path: path,
query: {
cache: true
}
})
}
},
submitForm(addMsg) {
//提交创建、修改表单
let that = this;
that.$refs[addMsg].validate(valid => {
if (valid) {
that.saveResource();
} else {
return false;
}
});
},
//选中的数组
checkImgList() {
if (this.imglistArry != null) {
this.imglistArry.forEach(x => {
if (x.isShow == true) {
var obj = this.$DMCUtils.DMCImageObj();
obj.Path = "/U" + this.$commonUtils.getCaption(x.Path, "Upload");
obj.ShowPath = x.Path;
obj.PicID = x.ID;
this.HotelImageArray.push(obj);
}
x.isShow = false;
this.selecnum = 0;
});
}
this.addimg = false;
},
closeDMCchooseImg() {
this.addimg = false;
},
getDMCimg(imgArr) {
imgArr.forEach(imgItem => {
var obj = this.$DMCUtils.DMCImageObj();
obj.ID = 0;
obj.Path = this.$commonUtils.removeDomain(imgItem.Path);
obj.PicID = imgItem.ID;
obj.ShowPath = imgItem.Path + "?x-oss-process=image/resize,l_140";
this.HotelImageArray.push(obj);
});
},
//获取国家
GetCounrty() {
var that = this;
this.apipost(
"dict_post_Destination_GetCountry", {},
res => {
var tempCountryArray = res.data.data;
if (tempCountryArray && tempCountryArray.length > 0) {
that.GetSubAreaList(tempCountryArray[0].ID, 'province')
}
}
);
},
//获取省份和城市
GetSubAreaList(ID, typeStr) {
let msg = {
Id: ID
};
this.apipost(
"dict_post_Destination_GetChildList",
msg,
res => {
if (typeStr == 'province') {
this.ProvinceList = res.data.data;
} else if (typeStr == 'city') {
this.CityList = res.data.data;
}
},
err => {}
);
},
//获取酒店配置
getHotelConfig() {
this.apipost(
"hotel_post_GetNewHotelConfig", {},
res => {
if (res.data.resultCode == 1) {
var tempData = res.data.data;
if (tempData && tempData.length > 0) {
tempData.forEach(item => {
if (item.DicKey == 'Hotel_ZLY') {
this.baseList = item.SubList
} else if (item.DicKey == "Hotel_VAT") {
this.vatList = item.SubList;
} else if (item.DicKey == "Hotel_Star") {
this.starList = item.SubList;
} else if (item.DicKey == "Hotel_BJFS") {
this.bjfsList = item.SubList;
} else if (item.DicKey == "Hotel_Info") {
this.configDetailsList = item.SubList;
if (this.addMsg.ID == 0) {
this.addMsg.HotelDetailsList = item.SubList;
}
}
})
}
}
});
}
},
created() {
this.GetCounrty();
this.getHotelConfig();
let userInfo = this.getLocalStorage();
},
mounted() {
// 从 props 或 route 获取 ID
if (this.hotelId) {
this.addMsg.ID = this.hotelId
} else if (this.$route.query && this.$route.query.id) {
this.addMsg.ID = this.$route.query.id
}
},
watch: {
hotelId: {
immediate: true,
handler(newVal) {
if (newVal && newVal !== this.addMsg.ID) {
this.addMsg.ID = newVal
if (this.addMsg.ID > 0) {
this.initHotelData()
}
}
}
}
}
};
</script>
...@@ -1913,14 +1913,6 @@ export default { ...@@ -1913,14 +1913,6 @@ export default {
title: '邮轮订单OP' title: '邮轮订单OP'
}, },
}, },
{
path: '/cruiseShipSupplier',
name: 'cruiseShipSupplier',
component: resolve => require(['@/components/cruiseShip/supplier/cruiseShipSupplier'], resolve),
meta: {
title: '邮轮供应商'
},
},
{ {
path: '/TicketManager', //机票列表 path: '/TicketManager', //机票列表
name: 'TicketManager', name: 'TicketManager',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment