Skip to content

S
SuperMan
Commit 036d6bc6 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 2c0d4df8
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1172 additions and 1509 deletions
src/components/newTravelmanager/TravelGroupControl/UpgradedVersion/components/featureControls.vue
View file @ 036d6bc6
<template>
<div class="featureControls">
<div class="row-aic featureControls-bottom featureControls-bottomOne"
v-if="ControlsType=='row'">
<div class="row-aic featureControls-bottom featureControls-bottomOne" v-if="ControlsType=='row'">
<el-tooltip class="item" effect="dark" content="添加页面" placement="top">
<div @click="toAddPages">
<i class="el-icon-plus"></i>
......@@ -13,23 +12,21 @@
</div>
</el-tooltip>
</div>
<div class="column featureControls-bottom featureControls-bottomTwo"
v-else>
<div class="column featureControls-bottom featureControls-bottomTwo" v-else>
<div v-if="isTemplate">
<el-tooltip class="item" effect="dark" content="选模版" placement="top">
<el-popover trigger="hover" placement="right">
<div class="featureControls-Template">
<div class="Template-img relative" v-for="(item,index) in TemplateList"
@click="setTemplate(item)">
<img :src="item.url"/>
<div v-if="item.id==TemplateType" class="Template-imgSelect absolute row-ajc el-icon-success"></div>
<el-popover trigger="hover" placement="right">
<div class="featureControls-Template">
<div class="Template-img relative" v-for="(item,index) in TemplateList" @click="setTemplate(item)">
<img :src="item.url" />
<div v-if="item.id==TemplateType" class="Template-imgSelect absolute row-ajc el-icon-success"></div>
</div>
</div>
</div>
<div slot="reference" style="padding: 0;">
<i class="el-icon-copy-document"></i>
</div>
</el-popover>
</el-tooltip>
<div slot="reference" style="padding: 0;">
<i class="el-icon-copy-document"></i>
</div>
</el-popover>
</el-tooltip>
</div>
<el-tooltip class="item" effect="dark" content="上传图" placement="top">
<div @click="toUploadImg" v-if="isUploadImg">
......@@ -38,18 +35,18 @@
</el-tooltip>
<el-tooltip class="item" effect="dark" content="选图" placement="top">
<div @click="toSelectImg" v-if="isSelectImg">
<i class="el-icon-search"></i>
<i class="el-icon-search"></i>
</div>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="添加图" placement="top">
<div @click="toAddImg" v-if="isAddImg">
<i class="el-icon-plus"></i>
</div>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="删除图" placement="top">
<div @click="toDeleteImg" v-if="isDeleteImg">
<i class="el-icon-delete"></i>
</div>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="添加图" placement="top">
<div @click="toAddImg" v-if="isAddImg">
<i class="el-icon-plus"></i>
</div>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="删除图" placement="top">
<div @click="toDeleteImg" v-if="isDeleteImg">
<i class="el-icon-delete"></i>
</div>
</el-tooltip>
</div>
</div>
......@@ -60,50 +57,50 @@
components: {
},
props: ['index','FeatureData','ControlsType','pagesType','isDeletePage',
'isUploadImg','isSelectImg','isAddImg','isDeleteImg','isTemplate','Template'],
props: ['index', 'FeatureData', 'ControlsType', 'pagesType', 'isDeletePage',
'isUploadImg', 'isSelectImg', 'isAddImg', 'isDeleteImg', 'isTemplate', 'Template'
],
data() {
return {
TemplateType: 1,
TemplateList:[
{
url:'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateOne.png',
id:1,
TemplateList: [{
url: 'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateOne.png',
id: 1,
},
{
url:'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateTwo.png',
id:2,
url: 'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateTwo.png',
id: 2,
},
{
url:'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateThree.png',
id:3,
url: 'http://192.168.10.214:8130/Upload/NewTripFeature/featureTemplateThree.png',
id: 3,
}
]
};
},
methods: {
setTemplate(item){
setTemplate(item) {
this.TemplateType = item.id
this.$emit('setTemplate',this.TemplateType)
this.$emit('setTemplate', this.TemplateType)
},
toUploadImg(){
toUploadImg() {
this.$emit('toUploadImg')
},
toSelectImg(){
toSelectImg() {
this.$emit('toSelectImg')
},
toAddImg(){
toAddImg() {
this.$emit('toAddImg')
},
toDeleteImg(){
toDeleteImg() {
this.$emit('toDeleteImg')
},
toAddPages(){
toAddPages() {
// this.pagesType 1 首页 2 介绍 3餐食介绍 4宿 5食 6景
this.$emit('toAddPages',this.index,this.FeatureData)
this.$emit('toAddPages', this.index, this.FeatureData)
},
toDeletePages(){
this.$emit('toDeletePages',this.index,this.FeatureData)
toDeletePages() {
this.$emit('toDeletePages', this.index, this.FeatureData)
},
},
computed: {},
......@@ -131,60 +128,71 @@
</script>
<style>
.featureControls{
opacity: 0;
transition: opacity 2s ease;
-webkit-transition: opacity 2s ease;
-moz-transition: opacity 2s ease;
-ms-transition: opacity 2s ease;
-o-transition: opacity 2s ease;
}
.featureControls-bottom{
font-size: 20px;
color: #fff;
cursor: pointer;
background: rgba(0, 0, 0, 0.7);
border-radius: 2px;
}
.featureControls-bottomOne{
padding: 1px 10px;
}
.featureControls-bottomTwo{
padding: 5px 0;
}
.featureControls-bottomOne div{
padding: 0 5px;
}
.featureControls-bottomTwo div{
padding: 5px;
}
.featureControls-Template{
width: 150px;
top: -5px;
left: 85px;
background: #fff;
border: 4px;
}
.featureControls-Template div{
padding: 0;
}
.Template-img{
background: #e6e6e6;
margin: 5px 8px;
border-radius: 4px;
overflow: hidden;
}
.Template-img img{
width: 100%;
padding: 10px;
display: block;
}
.Template-imgSelect{
background: rgba(0, 0, 0, 0.7);
left: 0;
top: 0;
right: 0;
bottom: 0;
color: #e95252;
}
.featureControls {
opacity: 0;
transition: opacity 2s ease;
-webkit-transition: opacity 2s ease;
-moz-transition: opacity 2s ease;
-ms-transition: opacity 2s ease;
-o-transition: opacity 2s ease;
}
.featureControls-bottom {
font-size: 20px;
color: #fff;
cursor: pointer;
background: rgba(0, 0, 0, 0.7);
border-radius: 2px;
}
.featureControls-bottomOne {
padding: 1px 10px;
}
.featureControls-bottomTwo {
padding: 5px 0;
}
.featureControls-bottomOne div {
padding: 0 5px;
}
.featureControls-bottomTwo div {
padding: 5px;
}
.featureControls-Template {
width: 150px;
top: -5px;
left: 85px;
background: #fff;
border: 4px;
}
.featureControls-Template div {
padding: 0;
}
.Template-img {
background: #e6e6e6;
margin: 5px 8px;
border-radius: 4px;
overflow: hidden;
}
.Template-img img {
width: 100%;
padding: 10px;
display: block;
}
.Template-imgSelect {
background: rgba(0, 0, 0, 0.7);
left: 0;
top: 0;
right: 0;
bottom: 0;
color: #e95252;
}
</style>
src/components/newTravelmanager/TravelGroupControl/UpgradedVersion/components/headerTitle.vue
View file @ 036d6bc6
<template>
<div class="UpgradedVersion-headerTitle">
<div class="UpgradedVersion-headerTitle-one absolute z-index1">
<vEditDiv :canEdit='canEdit' v-model="first"></vEditDiv>
<vEditDiv :canEdit='canEdit' v-model="FeatureItem.dataObj.LtName"></vEditDiv>
</div>
<div class="UpgradedVersion-headerTitle-two absolute z-index2">
<vEditDiv :canEdit='canEdit1' v-model="first1"></vEditDiv>
<vEditDiv :canEdit='canEdit1' v-model="FeatureItem.dataObj.Title"></vEditDiv>
</div>
<div class="UpgradedVersion-headerTitle-three absolute z-index1" :style="{'background':backgroundColor}">&nbsp;
</div>
<div class="UpgradedVersion-headerTitle-three absolute z-index1"
:style="{'background':backgroundColor}">&nbsp;</div>
<!-- <img class="UpgradedVersion-headerTitle-three absolute z-index1"
src="http://192.168.10.214:8130/Upload/NewTripFeature/textBj.png" /> -->
</div>
......@@ -21,12 +21,11 @@
},
props: [
'TripColor',
'FeatureData'
'FeatureItem'
],
data() {
return {
first: '森之京都~椿山庄.风景美术馆日本平系列',
first1: '温泉.美食.叡山铁道秋枫漫游之旅',
canEdit: true,
canEdit1: true,
backgroundColor: null
......@@ -39,7 +38,7 @@
watch: {
TripColor: {
handler(val, oldVal) {
this.backgroundColor = this.hexToRgb(val,0.6)
this.backgroundColor = this.hexToRgb(val, 0.6)
},
deep: false,
immediate: true
......@@ -53,40 +52,47 @@
</script>
<style>
.UpgradedVersion-headerTitle{
text-align: center;
}
.UpgradedVersion-headerTitle-one{
top: 139px;
left: 124px;
right: 124px;
height: 53px;
font-size: 49px;
font-family: FZCuSong-B09S;
font-weight: 400;
color: #2A2A2A;
}
.UpgradedVersion-headerTitle-two{
top: 205px;
left: 144px;
right: 144px;
font-size: 34px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #2A2A2A;
}
.UpgradedVersion-headerTitle-one .edit_div,.UpgradedVersion-headerTitle-two .edit_div{
white-space: nowrap;
overflow: hidden;
}
.UpgradedVersion-headerTitle-two .edit_div{
height: 40px;
}
.UpgradedVersion-headerTitle-three{
top: 237px;
left: 370px;
width: 379px;
height: 14px;
border-radius: 7px;
}
.UpgradedVersion-headerTitle {
text-align: center;
}
.UpgradedVersion-headerTitle-one {
top: 139px;
left: 124px;
right: 124px;
height: 53px;
font-size: 49px;
font-family: FZCuSong-B09S;
font-weight: 400;
color: #2A2A2A;
}
.UpgradedVersion-headerTitle-two {
top: 205px;
left: 144px;
right: 144px;
font-size: 34px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #2A2A2A;
}
.UpgradedVersion-headerTitle-one .edit_div,
.UpgradedVersion-headerTitle-two .edit_div {
white-space: nowrap;
overflow: hidden;
}
.UpgradedVersion-headerTitle-two .edit_div {
height: 40px;
}
.UpgradedVersion-headerTitle-three {
top: 237px;
left: 370px;
width: 379px;
height: 14px;
border-radius: 7px;
}
</style>
src/components/newTravelmanager/TravelGroupControl/UpgradedVersion/index.vue
View file @ 036d6bc6
......@@ -10,11 +10,10 @@
@toAddPages="AddPages" @toDeletePages="DeletePages"></featureHome>
<!-- 其余页 -->
<div v-else>
<headerTitle :FeatureData="item" :TripColor="TripColor"></headerTitle>
<headerTitle :FeatureItem="item" :TripColor="TripColor"></headerTitle>
<!-- 介绍、宿食景页 -->
<otherJourney :index="index" :FeatureData="item" :TripColor="TripColor" @toAddPages="AddPages"
@toDeletePages="DeletePages" @setTemplate="setTemplate"
v-if="item.name=='介绍'||item.name=='宿'||item.name=='食'||item.name=='景'"></otherJourney>
<otherJourney :index="index" :FeatureItem="item" :TripColor="TripColor" @toAddPages="AddPages"
@toDeletePages="DeletePages" @setTemplate="setTemplate" v-if="item.pageType!=1"></otherJourney>
<!-- 食详情页 -->
<UpgradedVersionDetails :index="index" :FeatureData="item" :TripColor="TripColor" @toAddPages="AddPages"
@toDeletePages="DeletePages" v-if="item.name=='食详情'"></UpgradedVersionDetails>
......@@ -71,43 +70,38 @@
dataObj: {},
},
{
name: '介绍',
id: 2,
type: 2,
Template: 0,
pageTitle: '介绍',
pageType: 2,
pageTemplate: 0,
isDeletePage: false,
dataObj: {},
},
{
name: '食详情',
id: 3,
type: 3,
Template: 0,
pageTitle: '食详情',
pageType: 3,
pageTemplate: 0,
isDeletePage: false,
dataObj: {},
},
{
name: '宿',
id: 4,
type: 4,
pageTitle: '宿',
pageType: 4,
isDeletePage: false,
Template: 1,
pageTemplate: 1,
dataObj: {},
},
{
name: '食',
id: 5,
type: 5,
pageTitle: '食',
pageType: 5,
isDeletePage: false,
Template: 2,
pageTemplate: 2,
dataObj: {},
},
{
name: '景',
id: 6,
type: 6,
pageTitle: '景',
pageType: 6,
isDeletePage: false,
Template: 3,
pageTemplate: 3,
dataObj: {},
}
]
......@@ -156,15 +150,30 @@
Title: this.FeatureData.Title,
AreaName: "大阪 京都 富士山 伊豆 都 H", //地区
AreaName2: "冲绳 大阪城公园湖 伊豆 H", //地区
IndexName: "名称",
ImgList: [{url:"https://imgfile.oytour.com/Upload/Temporary/202308161225403150000000099.jpg"}],
IndexDesc: "描述信息",
IndexName: "浅草寺 Senso-ji Temple",
ImgList: [{
url: "http://imgfile.oytour.com/Upload/DMC/DsrkBYw5MnQnzk2WzksZ4knrrKFbeP3a.jpg"
}],
IndexDesc: "东京最著名、最古老的寺庙，也是日本的门脸、浅草的象征。频繁的庙会活动让你零距离感受日本江户风俗。据说寺内有一座在公元628年偶然被当地渔民打捞上来的观音金像，每年都有许多人前来寺庙祈福保平安。院内有雷门、五重塔等著名古迹；还有90余家商铺的仲见世商店街，可以买到当地特产和吉祥物。在浅草寺可以求签问凶吉，如果不走运抽到了“凶”，和当地人一样系在抽签的地方就可以驱散霉运了。",
};
}
//介绍页面
else if (pItem.pageType == 2) {
pItem.dataObj = {
LtName: this.FeatureData.LtName,
Title: this.FeatureData.Title,
MainName: "日本旅行专家",
SubName: "『印象日本』日本豪华游代名词",
ImgList: [{
url: "http://imgfile.oytour.com/Upload/DMC/a2Fn2zajwMsxNHaWPdD5idKJD8RyCG5H.jpg"
}],
IndexDesc: "印象日本独家使用京 都 车 站旁 的 京都 千 饭店 ~酒店房间 37 平 方公 尺！ 房型 多样 设 计， 京都千饭店外观为京町家的格子风格，非常引人注目。饭店以「Personal Comfort Hotel」为概念所打造，意思就是追求每个人入住时的舒适感。从有着庭院的大厅穿过以京町家的内庭长廊为主题所建的信道，便可看见用玻璃纱创作的艺术装置随风轻柔地飘动着。再往旁边一看，眼前只见充满开放感的挑高空间。有如通往神社寺庙大门般的大型阶梯充满了存在感。在柔和的光线包围下，一瞬间忘了自己是身处在建筑物之中。让人联想到京都传统建筑的内部装潢没有刻意的高调奢华，但连小细节都做得非常精致，散发出古都特有的风情。低調沉穩的寬敞客房。讓入住者可以從陽台或窗邊觀賞庭園的綠色景緻，同時享受頂級的休閒時光。 ",
};
}
});
}
console.log("this.pageList",this.pageList);
console.log("this.pageList", this.pageList);
},
},
computed: {
......@@ -181,7 +190,7 @@
mounted() {
//调用初始化信息提示
var that = this;
that.initFeature();
that.initFeature();
that.MsgBus.$on("comUpTravel", function () {
that.initFeature();
});
......
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