Skip to content

S
SuperMan
Commit 09c0e5e5 authored by 黄奎's avatar 黄奎
Browse files
Options

11

parent be2612ce
Hide whitespace changes
Inline Side-by-side
Showing with 523 additions and 483 deletions
src/components/Hotel/singleProduct/components/ListCar.vue
View file @ 09c0e5e5
<template> <template>
<div> <div>
<div class="ListCar-form"></div> <div class="ListCar-form"></div>
<div class="ListCar-form-box"> <div class="ListCar-form-box">
<div class="ListCar-box"> <div class="ListCar-box">
<div class="normalBtn ListCar-close" @click="close"> <div class="normalBtn ListCar-close" @click="close">
<i class="el-icon-close"></i> <i class="el-icon-close"></i>
</div> </div>
<div class="row-JCSB ListCar-header paddinglr15"> <div class="row-JCSB ListCar-header paddinglr15">
<span class="fz16 fbold">{{$t('objFill.jiudiancgd')}}</span> <span class="fz16 fbold">{{$t('objFill.jiudiancgd')}}</span>
<div class="ListCar-header-right fz12"> <div class="ListCar-header-right fz12">
{{$t('objFill.bencixingcheng')}} {{$t('objFill.bencixingcheng')}}
<span class="colore65100">{{cars&&cars.length}}</span> <span class="colore65100">{{cars&&cars.length}}</span>
{{$t('objFill.tianruzhu')}} {{$t('objFill.tianruzhu')}}
<span class="color009ef7">{{HotelLength}}</span> <span class="color009ef7">{{HotelLength}}</span>
{{$t('objFill.gejiudianm')}} {{$t('objFill.gejiudianm')}}
</div> </div>
</div>
<div class="ListCar-content">
<div class="ListCar-list" v-for="(x,xi) in cars">
<div class="colorffffff list-time">{{ x.Date }}</div>
<div class="list-content-box" v-for="(y,i) in x.Hotels">
<div class="list-operation">
<div>
<button v-if="x.Date>=OptionalTime" class="hollowFixedBtn" type="primary"
@click="setEditorHandler(y)">
<i class="el-icon-edit"></i>
</button>
<button class="normalBtn" type="primary" @click="removeHotelHandler(xi,i)">
<i class="el-icon-delete"></i>
</button>
</div> </div>
<div class="ListCar-content"> </div>
<div class="ListCar-list" v-for="(x,xi) in cars"> <div class="list-content">
<div class="colorffffff list-time">{{ x.Date }}</div> <div class="color009ef7 row-JCSB list-content-title">
<div class="list-content-box" v-for="(y,i) in x.Hotels"> <span class="fbold content-title fz15">{{ y.HotelName }}</span>
<div class="list-operation"> <div class="fz12 fbold">
<div> {{$t('fnc.yixuan')}}
<span class="coloref44336">{{ y.SumPeople }}</span>
<button v-if="x.Date>=OptionalTime" class="hollowFixedBtn" type="primary" @click="setEditorHandler(y)"> {{$t('Operation.Op_people')}}
<i class="el-icon-edit"></i> <span class="coloref1416c">{{ y.Total }}</span>
</button> {{$t('hotel.hotel_room')}}
<button class="normalBtn" type="primary" @click="removeHotelHandler(xi,i)"> </div>
<i class="el-icon-delete"></i>
</button>
</div>
</div>
<div class="list-content">
<div class="color009ef7 row-JCSB list-content-title">
<span class="fbold content-title fz15">{{ y.HotelName }}</span>
<div class="fz12 fbold">
{{$t('fnc.yixuan')}}
<span class="coloref44336">{{ y.SumPeople }}</span>
{{$t('Operation.Op_people')}}
<span class="coloref1416c">{{ y.Total }}</span>
{{$t('hotel.hotel_room')}}
</div>
</div>
<div class="list-content-rooms fz14">
<div v-for="z in y.DetailList">
<el-row :gutter="20">
<el-col :span="6">{{ z.RoomName }}</el-col>
<el-col :span="6">
{{ moneyFormat(z.Unit_Price) }}/{{$t('Operation.Op_people')}}
</el-col>
<el-col :span="5">
{{ z.PeopleNumber }}{{$t('Operation.Op_people')}}{{ z.Number }}{{$t('hotel.hotel_room')}}
</el-col>
<el-col :span="7" class="row-JCE">
<span>{{$t('ground.xiaoji')}}：{{ moneyFormat(z.Unit_Price * z.PeopleNumber) }}</span>
</el-col>
</el-row>
</div>
</div>
<div class="row-JCE color009ef7 fz14 list-content-num">
<span>{{$t('fnc.a_heji')}}：{{ moneyFormat(y.Money) }}</span>
</div>
</div>
</div>
</div>
<div v-if="cars.length==0" style="text-align: center;padding: 20px 0;">{{$t('system.content_noData')}}</div>
</div> </div>
<div class="list-content-rooms fz14">
<div v-for="z in y.DetailList">
<el-row :gutter="20">
<el-col :span="6">{{ z.RoomName }}</el-col>
<el-col :span="6">
{{ moneyFormat(z.Unit_Price) }}/{{$t('Operation.Op_people')}}
</el-col>
<el-col :span="5">
{{ z.PeopleNumber }}{{$t('Operation.Op_people')}}{{ z.Number }}{{$t('hotel.hotel_room')}}
</el-col>
<el-col :span="7" class="row-JCE">
<span>{{$t('ground.xiaoji')}}：{{ moneyFormat(z.Unit_Price * z.PeopleNumber) }}</span>
</el-col>
</el-row>
</div>
<div class="ListCar-bottom" v-if="cars.length>0">
<div v-if="crmOrderObj" style="margin-bottom: 10px;">
<span style="color: red;">{{$t('objFill.yinliuren')}}：{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/{{$t('objFill.keren')}}：{{crmOrderObj.CRMGuestName}}</span>
</div>
<el-form label-width="70px" :model="parameters" :rules="rules" ref="parameters">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item :label="$t('system.query_type')" prop="OrderType">
<el-select v-model="parameters.OrderType">
<el-option v-for="item in cacheHotels" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
</el-select>
</el-form-item>
</el-col>
<template v-if="parameters.OrderType==1">
<el-col :span="12">
<el-form-item :label="$t('system.query_name')" prop="ContactName">
<el-input v-model="parameters.ContactName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('hotel.table_tel')" prop="ContactNumber">
<el-input v-model="parameters.ContactNumber"></el-input>
</el-form-item>
</el-col>
</template>
<el-col :span="12" v-else>
<el-form-item :label="$t('visa.v_tuanhao')" prop="TCNum">
<el-input v-model="parameters.TCNum"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('pub.pubRemark')" prop="">
<el-input type="textarea" :rows="1"
:placeholder="$t('rule.EnterMark')" v-model="parameters.Remark"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="row-JCSB bottom-num">
<div>
<span class="coloref1416c fz12">{{$t('objFill.dindianfukuan')}}：</span>
<span class="coloref1416c fbold">
<span class="fz18">{{parameters.Money}}</span>
<span class="fz13"><!-- ¥ -->{{cars[0].CurrencyName}}</span>
</span>
</div>
<div>
<button :class="{'normalBtn':!loading,'hollowFixedBtn':loading}" type="primary" @click="submit">
{{$t('objFill.querenxiaddan')}}
</button>
</div>
</div>
</div> </div>
<div class="row-JCE color009ef7 fz14 list-content-num">
<span>{{$t('fnc.a_heji')}}：{{ moneyFormat(y.Money) }}</span>
</div>
</div>
</div>
</div>
<div v-if="cars&&cars.length==0" style="text-align: center;padding: 20px 0;">{{$t('system.content_noData')}}
</div>
</div>
<div class="ListCar-bottom" v-if="cars&&cars.length>0">
<div v-if="crmOrderObj" style="margin-bottom: 10px;">
<span style="color: red;">{{$t('objFill.yinliuren')}}：{{crmOrderObj.LureEmpNmae}} </span>
<span style="color: #2AAEF2;">/{{$t('objFill.keren')}}：{{crmOrderObj.CRMGuestName}}</span>
</div>
<el-form label-width="70px" :model="parameters" :rules="rules" ref="parameters">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item :label="$t('system.query_type')" prop="OrderType">
<el-select v-model="parameters.OrderType">
<el-option v-for="item in cacheHotels" :key="item.ID" :label="item.Name" :value="item.ID">
</el-option>
</el-select>
</el-form-item>
</el-col>
<template v-if="parameters.OrderType==1">
<el-col :span="12">
<el-form-item :label="$t('system.query_name')" prop="ContactName">
<el-input v-model="parameters.ContactName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('hotel.table_tel')" prop="ContactNumber">
<el-input v-model="parameters.ContactNumber"></el-input>
</el-form-item>
</el-col>
</template>
<el-col :span="12" v-else>
<el-form-item :label="$t('visa.v_tuanhao')" prop="TCNum">
<el-input v-model="parameters.TCNum"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('pub.pubRemark')" prop="">
<el-input type="textarea" :rows="1" :placeholder="$t('rule.EnterMark')" v-model="parameters.Remark">
</el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="row-JCSB bottom-num">
<div>
<span class="coloref1416c fz12">{{$t('objFill.dindianfukuan')}}：</span>
<span class="coloref1416c fbold">
<span class="fz18">{{parameters.Money}}</span>
<span class="fz13">
<!-- ¥ -->{{cars[0].CurrencyName}}</span>
</span>
</div>
<div>
<button :class="{'normalBtn':!loading,'hollowFixedBtn':loading}" type="primary" @click="submit">
{{$t('objFill.querenxiaddan')}}
</button>
</div> </div>
</div>
</div> </div>
</div>
</div> </div>
</template> </div>
<script> </template>
export default { <script>
props: { export default {
// crmOrderObj: { props: {
// type: Object, HotelRow: {
// require: false type: Object,
// }, require: false
HotelRow: {
type: Object,
require: false
},
hotelInfor: {
type: Object,
require: false
}
}, },
data() { hotelInfor: {
return { type: Object,
crmOrderObj:null, require: false
OptionalTime: this.getBeforeDate(0,new Date().Format('yyyy-MM-dd')),//可编辑时间 }
cars: [], },
HotelLength: 0, data() {
addNum: 1, return {
parameters: { crmOrderObj: null,
Money: 0, OptionalTime: this.getBeforeDate(0, new Date().Format('yyyy-MM-dd')), //可编辑时间
DetailList: [], cars: [],
Remark: '', HotelLength: 0,
OrderType: 1, //订单类型 1散客 2团队 addNum: 1,
TCNum: '', //=团队时 传递 组团号
ContactName: '', //=散客时 传递 联系人
ContactNumber: '', //=散客时 传递 联系人电话
OrderId: 0,
LureEmpId: 0,
CRMGuestId: 0,
},
currentIndex: 0,
currentI: 0,
currentS: 0,
RemainingInventory: 0,
loading: false,
cacheHotels: [
{ Name: this.$t('objFill.shanke'), ID: 1 },
{ Name: this.$t('active.cl_team'), ID: 2 }
],
rules:{
OrderType: [{
required: true,
message: this.$t('system.ph_type'),
trigger: 'change'
}],
ContactName: [{
required: true,
message: this.$t('objFill.qingshuruskxm'),
trigger: 'blur'
}],
ContactNumber: [
{ required: true, message: this.$t('rule.EnterPnum'), trigger: "blur" },
// {
// pattern: this.$commonUtils.Regex.el_ISphone,
// message: this.$t('rule.EnterRightNum')
// }
],
TCNum: [{
required: true,
message: this.$t('salesModule.EnterTnum'),
trigger: 'blur'
}],
}
};
},
watch: {
// crmOrderObj: {
// handler: function (val, oldVal) {
// this.crmOrderObj = val
// if(this.crmOrderObj){
// this.parameters.LureEmpId = val.LureEmpId//引流id
// this.parameters.CRMGuestId = val.CRMGuestId //客人ID
// }
// },
// deep: true,
// immediate: true
// },
cars: {
handler: function (val, oldVal) {
this.HotelLength = this.cars.length
localStorage.setItem("HotelLength",this.HotelLength)
this.getMoney()
},
deep: true
},
parameters: { parameters: {
handler: function (val, oldVal) { Money: 0,
DetailList: [],
Remark: '',
OrderType: 1, //订单类型 1散客 2团队
TCNum: '', //=团队时 传递 组团号
ContactName: '', //=散客时 传递 联系人
ContactNumber: '', //=散客时 传递 联系人电话
OrderId: 0,
LureEmpId: 0,
CRMGuestId: 0,
},
currentIndex: 0,
currentI: 0,
currentS: 0,
RemainingInventory: 0,
loading: false,
cacheHotels: [{
Name: this.$t('objFill.shanke'),
ID: 1
},
{
Name: this.$t('active.cl_team'),
ID: 2
}
],
rules: {
OrderType: [{
required: true,
message: this.$t('system.ph_type'),
trigger: 'change'
}],
ContactName: [{
required: true,
message: this.$t('objFill.qingshuruskxm'),
trigger: 'blur'
}],
ContactNumber: [{
required: true,
message: this.$t('rule.EnterPnum'),
trigger: "blur"
}, },
deep: true // {
// pattern: this.$commonUtils.Regex.el_ISphone,
// message: this.$t('rule.EnterRightNum')
// }
],
TCNum: [{
required: true,
message: this.$t('salesModule.EnterTnum'),
trigger: 'blur'
}],
} }
};
},
watch: {
cars: {
handler: function (val, oldVal) {
if (this.cars && this.cars.length > 0) {
this.HotelLength = this.cars.length
} else {
this.HotelLength = 0;
}
localStorage.setItem("HotelLength", this.HotelLength)
this.getMoney()
},
deep: true
}, },
created() { parameters: {
// crm自动登陆传过来的参数 handler: function (val, oldVal) {
if(this.$route.query.crmOrderObj){
let crmOrderObj = JSON.parse(this.$route.query.crmOrderObj) },
this.crmOrderObj = crmOrderObj deep: true
this.parameters.LureEmpId = crmOrderObj.LureEmpId//引流id }
this.parameters.CRMGuestId = crmOrderObj.CRMGuestId //客人ID },
created() {
// crm自动登陆传过来的参数
if (this.$route.query.crmOrderObj) {
let crmOrderObj = JSON.parse(this.$route.query.crmOrderObj)
this.crmOrderObj = crmOrderObj
this.parameters.LureEmpId = crmOrderObj.LureEmpId //引流id
this.parameters.CRMGuestId = crmOrderObj.CRMGuestId //客人ID
}
this.cars = JSON.parse(localStorage.getItem("cars"))
this.HotelLength = localStorage.getItem("HotelLength")
},
mounted() {
},
methods: {
// 关闭购物车
close() {
localStorage.removeItem('editor')
this.$emit('close')
},
// 合计
getMoney() {
this.parameters.Money = 0;
if (this.cars && this.cars.length > 0) {
this.cars.forEach((item) => {
item.Hotels.forEach((t) => {
this.parameters.Money += t.Money
})
})
} }
this.cars = JSON.parse(localStorage.getItem("cars"))
this.HotelLength = localStorage.getItem("HotelLength")
}, },
mounted() { // 确定下单
submit() {
this.$refs['parameters'].validate((valid) => {
if (valid) {
this.setFormMsg()
} else {
return false;
}
});
},
setFormMsg() {
let temp = JSON.parse(JSON.stringify(this.cars))
if (this.loading || this.cars.length == 0) return
this.loading = true
this.parameters.DetailList = []
temp.forEach((x) => {
x.Hotels.forEach((y) => {
y.RoomList = JSON.parse(JSON.stringify(y.DetailList))
delete y.DetailList
this.parameters.DetailList.push(y)
})
})
this.apipost("dict_post_SetSaleCustomerOrder", this.parameters,
res => {
this.loading = false;
if (res.data.resultCode == 1) {
this.Success(`${this.$t('sm.xiadan')}${this.$t('objFill.chenggong')}`);
localStorage.removeItem('cars')
localStorage.removeItem('editor')
localStorage.removeItem('HotelLength')
this.cars = []
this.HotelLength = 0
this.$emit('success')
} else {
this.Error(`${this.$t('sm.xiadan')}${this.$t('objFill.shibai')}`)
}
},
err => {
this.Error(err.message)
this.loading = false
}
);
}, },
methods: { removeHotelHandler(x, y) {
// 关闭购物车 let that = this
close(){ that.$confirm(this.$t('objFill.shifouquedinsc'), this.$t('tips.tips'), {
localStorage.removeItem('editor') confirmButtonText: this.$t('pub.sureBtn'),
this.$emit('close') cancelButtonText: this.$t('pub.cancelBtn'),
}, type: 'warning'
// 合计 }).then(() => {
getMoney() { if (this.cars[x].Hotels.length == 1) {
this.parameters.Money = 0 this.cars.splice(x, 1)
this.cars.forEach((item) => { } else {
item.Hotels.forEach((t) => { this.cars[x].Hotels.splice(y, 1)
this.parameters.Money += t.Money }
}) if (this.cars && this.cars.length) {
}) this.HotelLength = this.cars.length;
}, }
// 确定下单 localStorage.removeItem('cars')
submit() { localStorage.setItem('cars', JSON.stringify(this.cars))
this.$refs['parameters'].validate((valid) => { localStorage.removeItem('HotelLength')
if (valid) { localStorage.setItem('HotelLength', JSON.stringify(this.HotelLength))
this.setFormMsg() }).catch(() => {
} else {
return false;
}
});
},
setFormMsg(){
let temp = JSON.parse(JSON.stringify(this.cars))
if(this.loading||this.cars.length==0) return
this.loading = true
this.parameters.DetailList = []
temp.forEach((x)=>{
x.Hotels.forEach((y)=>{
y.RoomList = JSON.parse(JSON.stringify(y.DetailList))
delete y.DetailList
this.parameters.DetailList.push(y)
})
})
this.apipost("dict_post_SetSaleCustomerOrder", this.parameters, });
res => { },
this.loading = false; // 编辑
if (res.data.resultCode == 1) { setEditorHandler(x) {
this.Success(`${this.$t('sm.xiadan')}${this.$t('objFill.chenggong')}`); localStorage.setItem('editor', JSON.stringify(x))
localStorage.removeItem('cars') this.$emit('editor', x)
localStorage.removeItem('editor')
localStorage.removeItem('HotelLength')
this.cars=[]
this.HotelLength = 0
this.$emit('success')
} else {
this.Error(`${this.$t('sm.xiadan')}${this.$t('objFill.shibai')}`)
}
},
err => {
this.Error(err.message)
this.loading = false
}
);
},
removeHotelHandler(x,y){
let that = this
that.$confirm(this.$t('objFill.shifouquedinsc'), this.$t('tips.tips'), {
confirmButtonText: this.$t('pub.sureBtn'),
cancelButtonText: this.$t('pub.cancelBtn'),
type: 'warning'
}).then(() => {
if(this.cars[x].Hotels.length==1){
this.cars.splice(x,1)
}else{
this.cars[x].Hotels.splice(y,1)
}
this.HotelLength = this.cars.length
localStorage.removeItem('cars')
localStorage.setItem('cars',JSON.stringify(this.cars))
localStorage.removeItem('HotelLength')
localStorage.setItem('HotelLength',JSON.stringify(this.HotelLength))
}).catch(() => {
});
},
// 编辑
setEditorHandler(x){
localStorage.setItem('editor',JSON.stringify(x))
this.$emit('editor',x)
}
} }
}; }
};
</script> </script>
<style scoped> <style scoped>
.fz12{ .fz12 {
font-size: 12px; font-size: 12px;
} }
.fz13{
font-size: 13px; .fz13 {
} font-size: 13px;
.fz14{ }
font-size: 14px;
} .fz14 {
.fz15{ font-size: 14px;
font-size: 15px; }
}
.fz16{ .fz15 {
font-size: 16px; font-size: 15px;
} }
.fz18{
font-size: 18px; .fz16 {
} font-size: 16px;
.fbold{ }
font-weight: bold;
} .fz18 {
.paddinglr15{ font-size: 18px;
padding: 0 15px; }
}
.row-JCSB{ .fbold {
display: flex; font-weight: bold;
justify-content: space-between; }
}
.row-JCE{ .paddinglr15 {
display: flex; padding: 0 15px;
justify-content: end; }
}
.colorffffff{ .row-JCSB {
color: #ffffff; display: flex;
} justify-content: space-between;
.color009ef7{ }
color: #009ef7;
} .row-JCE {
.colore65100{ display: flex;
color: #e65100; justify-content: end;
} }
.coloref44336{
color: #f44336; .colorffffff {
} color: #ffffff;
.coloref1416c{ }
color: #f1416c;
} .color009ef7 {
.ListCar-form{ color: #009ef7;
position: fixed; }
top: 0;
left: 0; .colore65100 {
right: 0; color: #e65100;
bottom: 0; }
background: rgba(23,23,23,.5);
z-index: 3; .coloref44336 {
} color: #f44336;
.ListCar-form-box{ }
position: fixed;
top: 0; .coloref1416c {
right: 0; color: #f1416c;
bottom: 0; }
width: 550px;
background: #ffffff; .ListCar-form {
z-index: 100; position: fixed;
} top: 0;
.ListCar-box{ left: 0;
width: 100%; right: 0;
height: 100%; bottom: 0;
position: relative; background: rgba(23, 23, 23, .5);
} z-index: 3;
.ListCar-close{ }
position: absolute;
left: -47px; .ListCar-form-box {
top: 20%; position: fixed;
line-height: 26px; top: 0;
} right: 0;
.ListCar-close i{ bottom: 0;
margin-left: 3px; width: 550px;
} background: #ffffff;
.normalBtn.ListCar-close{ z-index: 100;
border-top-right-radius: 0; }
border-bottom-right-radius: 0;
padding: 0 8px !important; .ListCar-box {
} width: 100%;
.ListCar-box{ height: 100%;
padding: 15px 0; position: relative;
} }
.ListCar-header{
border-bottom: -; .ListCar-close {
} position: absolute;
.ListCar-header-right{ left: -47px;
border-radius: 3px; top: 20%;
padding: 5px 8px; line-height: 26px;
background: #fff3e0; }
}
.ListCar-content{ .ListCar-close i {
padding: 20px 15px; margin-left: 3px;
height: calc(100% - 230px); }
overflow: auto;
} .normalBtn.ListCar-close {
.ListCar-list{ border-top-right-radius: 0;
border-radius: 3px; border-bottom-right-radius: 0;
background: black; padding: 0 8px !important;
padding: 0 10px 10px 10px; }
margin: 0 0 10px 0;
} .ListCar-box {
.list-time{ padding: 15px 0;
padding: 10px 0 5px 0; }
}
.list-content-box{ .ListCar-header {
background: #e1f5fe; border-bottom: -;
position: relative; }
border-radius: 3px;
cursor: pointer; .ListCar-header-right {
margin-bottom: 5px; border-radius: 3px;
} padding: 5px 8px;
.list-content-box:last-child{ background: #fff3e0;
margin-bottom: 0; }
}
.list-content{ .ListCar-content {
padding: 8px 10px; padding: 20px 15px;
} height: calc(100% - 230px);
.list-content-title{ overflow: auto;
border-bottom: 1px dashed #009ef7; }
padding: 0 0 8px 0;
} .ListCar-list {
.content-title{ border-radius: 3px;
width: 300px; background: black;
overflow: hidden; padding: 0 10px 10px 10px;
white-space: nowrap; margin: 0 0 10px 0;
text-overflow: ellipsis; }
}
.list-content-rooms{ .list-time {
border-bottom: 1px dashed #009ef7; padding: 10px 0 5px 0;
padding: 6px 0; }
}
.list-content-rooms>div{ .list-content-box {
margin-bottom: 5px; background: #e1f5fe;
} position: relative;
.list-content-rooms>div:last-child{ border-radius: 3px;
margin-bottom: 0; cursor: pointer;
} margin-bottom: 5px;
.list-content-num{ }
padding: 6px 0 0 0;
} .list-content-box:last-child {
.list-operation{ margin-bottom: 0;
position: absolute; }
top: 0;
left: 0; .list-content {
bottom: 0; padding: 8px 10px;
right: 0; }
background: rgba(23,23,23,.5);
border-radius: 3px; .list-content-title {
display: none; border-bottom: 1px dashed #009ef7;
z-index: 1; padding: 0 0 8px 0;
} }
.list-operation div{
height: 100%; .content-title {
display: flex; width: 300px;
justify-content: center; overflow: hidden;
align-items: center; white-space: nowrap;
} text-overflow: ellipsis;
.list-content-box:hover .list-operation{ }
display: block;
} .list-content-rooms {
.ListCar-bottom{ border-bottom: 1px dashed #009ef7;
padding: 15px 15px 0 15px; padding: 6px 0;
} }
.bottom-num{
align-items: center; .list-content-rooms>div {
} margin-bottom: 5px;
}
.list-content-rooms>div:last-child {
margin-bottom: 0;
}
.list-content-num {
padding: 6px 0 0 0;
}
.list-operation {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(23, 23, 23, .5);
border-radius: 3px;
display: none;
z-index: 1;
}
.list-operation div {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.list-content-box:hover .list-operation {
display: block;
}
.ListCar-bottom {
padding: 15px 15px 0 15px;
}
.bottom-num {
align-items: center;
}
</style> </style>
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