Commit 169a884f authored by 黄奎's avatar 黄奎

页面修改

parent b44031a7
......@@ -602,7 +602,9 @@
position:absolute;
height:40px;
top:42%;
left:42%;
left:50%;
transform: translate3d(-50%,-50%,0);
width: 180px;
display:none;
text-align:center;
z-index:3
......@@ -611,7 +613,6 @@
display: inline-block;
width: 40px;
height: 40px;
/* display:none; */
border-radius: 50%;
line-height: 40px;
color: #fff;
......
......@@ -17,6 +17,7 @@
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[0])"><i class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(0,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="text">
......@@ -61,6 +62,8 @@
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[1])"><i class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(1,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(1,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-fiveText">
......@@ -104,6 +107,8 @@
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[2])"><i class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(2,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(2,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-fiveText">
......@@ -146,6 +151,8 @@
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[3])"><i class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(3,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(3,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-fiveText">
......@@ -154,7 +161,6 @@
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[3].CouponsName" placeholder="请输入景点名称"></el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[3].PlayTimeHour" @keyup.native="checkInteger(scenicArray[3],'PlayTimeHour')" placeholder="小时"></el-input>
......@@ -190,6 +196,7 @@
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[4])"><i class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(4,0)"><i class="iconfont icon-zuoyi"></i></span>
</div>
</div>
<div class="TC-fiveText">
......@@ -246,6 +253,10 @@
};
},
methods: {
//左移右移
ToMoveScenicItem(index, type) {
this.$parent.MoveScenicItem(this.DayNum, index,type);
},
//获取当前点击的Item
GetClickItem(obj) {
this.ClickItem = obj;
......
<style>
.TC-OneDayImg{
height:452px;
width:660px;
float:left;
.TC-OneDayImg {
height: 452px;
width: 660px;
float: left;
position: relative;
border:1px solid #d1d1d1;
border: 1px solid #d1d1d1;
}
.TC-OneDayImg img{width:100%;min-height: 449px;}
.TC-OneDayImg:hover .TC_uploadDiv{
display:block;
.TC-OneDayImg img {
width: 100%;
min-height: 449px;
}
.TC-OneDayImg:hover .TC_uploadDiv {
display: block;
}
.TC-FourTextArea .el-textarea__inner{
width: 288px!important;
.TC-FourTextArea .el-textarea__inner {
width: 288px !important;
height: 158px;
}
</style>
<template>
<div class="TC-ThreeContent">
<div class="TC-ScencContent clearfix">
<div class="TC-OneDayImg" :id='"boxs_"+DayNum+"_"+0'>
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+0' tabindex="0" :w="660" :h="449" :resizable='false' :x="scenicArray[0].ScenicJson.x"
:y="scenicArray[0].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(0)">
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+0' tabindex="0" :w="660" :h="449" :resizable='false'
:x="scenicArray[0].ScenicJson.x" :y="scenicArray[0].ScenicJson.y" :z="2" :active="false" :parent="false"
@dragstop="onDragImagestop" @activated="onActivated(0)">
<img :src='compressImg(scenicArray[0].NewImaArray[0].Url, "filt", 660, "")' :id='"bodys_"+DayNum+"_"+0' />
</VueDraggableResizable>
<div class="TC_uploadDiv">
......@@ -33,26 +41,32 @@
</span>
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[0])"><i class="iconfont icon-img_cz"></i></span>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[0])"><i
class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(0,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-OneDetail">
<div class="TC_text_inside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[0].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[0].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[0].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeHour" @keyup.native="checkInteger(scenicArray[0],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[0],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[0].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[0],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[0],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[0].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[0].Description" resize="none" class="TC-TextArea" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[0].Description" resize="none" class="TC-TextArea"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead">
{{scenicArray[0].Description}}
......@@ -63,8 +77,9 @@
<div class="_flex_space_between">
<div class="TC-fourChildContent">
<div class="image" :id='"boxs_"+DayNum+"_"+1'>
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+1' tabindex="0" :w="321" :h="246" :resizable='false' :x="scenicArray[1].ScenicJson.x"
:y="scenicArray[1].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(1)">
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+1' tabindex="0" :w="321" :h="246"
:resizable='false' :x="scenicArray[1].ScenicJson.x" :y="scenicArray[1].ScenicJson.y" :z="2" :active="false"
:parent="false" @dragstop="onDragImagestop" @activated="onActivated(1)">
<img :src='compressImg(scenicArray[1].NewImaArray[0].Url, "filt", 321, "")' :id='"bodys_"+DayNum+"_"+1' />
</VueDraggableResizable>
......@@ -77,26 +92,33 @@
</span>
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[1])"><i class="iconfont icon-img_cz"></i></span>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[1])"><i
class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(1,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(1,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="text">
<div class="text_inside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[1].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[1].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[1].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeHour" @keyup.native="checkInteger(scenicArray[1],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[1],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[1].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[1],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[1],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[1].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[1].Description" resize="none" class="TC-FourTextArea" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[1].Description" resize="none" class="TC-FourTextArea"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead" style="width:284px;height:151px;overflow:hidden;">
{{scenicArray[1].Description}}
......@@ -106,13 +128,11 @@
</div>
<div class="TC-fourChildContent">
<div class="image" :id='"boxs_"+DayNum+"_"+2'>
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+2' tabindex="0" :w="321" :h="246" :resizable='false' :x="scenicArray[2].ScenicJson.x"
:y="scenicArray[2].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(2)">
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+2' tabindex="0" :w="321" :h="246"
:resizable='false' :x="scenicArray[2].ScenicJson.x" :y="scenicArray[2].ScenicJson.y" :z="2" :active="false"
:parent="false" @dragstop="onDragImagestop" @activated="onActivated(2)">
<img :src='compressImg(scenicArray[2].NewImaArray[0].Url, "filt", 321, "")' :id='"bodys_"+DayNum+"_"+2' />
</VueDraggableResizable>
<!-- <img v-if="scenicArray[2].NewImaArray.length>0&&scenicArray[2].NewImaArray[0].Url" :src="scenicArray[2].NewImaArray[0].Url" alt="" />
<div v-else class="_noData_img" src=""></div> -->
<div class="TC_uploadDiv">
<el-form-item>
<el-upload :file-list="scenicArray[2].NewImaArray" action :http-request="uploadImg"
......@@ -122,26 +142,33 @@
</span>
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[2])"><i class="iconfont icon-img_cz"></i></span>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[2])"><i
class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(2,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(2,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="text">
<div class="text_inside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[2].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[2].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[2].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[2].PlayTimeHour" @keyup.native="checkInteger(scenicArray[2],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[2].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[2],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[2].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[2].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[2],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[2].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[2],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[2].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[2].Description" resize="none" class="TC-FourTextArea" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[2].Description" resize="none" class="TC-FourTextArea"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead">
{{scenicArray[2].Description}}
......@@ -151,8 +178,9 @@
</div>
<div class="TC-fourChildContent">
<div class="image" :id='"boxs_"+DayNum+"_"+3'>
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+3' tabindex="0" :w="321" :h="246" :resizable='false' :x="scenicArray[3].ScenicJson.x"
:y="scenicArray[3].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(3)">
<VueDraggableResizable axis="y" :ref='"fourDay_"+DayNum+"_"+3' tabindex="0" :w="321" :h="246"
:resizable='false' :x="scenicArray[3].ScenicJson.x" :y="scenicArray[3].ScenicJson.y" :z="2" :active="false"
:parent="false" @dragstop="onDragImagestop" @activated="onActivated(3)">
<img :src='compressImg(scenicArray[3].NewImaArray[0].Url, "filt", 321, "")' :id='"bodys_"+DayNum+"_"+3' />
</VueDraggableResizable>
<div class="TC_uploadDiv">
......@@ -164,26 +192,32 @@
</span>
</el-upload>
</el-form-item>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[3])"><i class="iconfont icon-img_cz"></i></span>
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[3])"><i
class="iconfont icon-img_cz"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(3,0)"><i class="iconfont icon-zuoyi"></i></span>
</div>
</div>
<div class="text">
<div class="text_inside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[3].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[3].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[3].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[3].PlayTimeHour" @keyup.native="checkInteger(scenicArray[3],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[3].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[3],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[3].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[3].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[3],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[3].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[3],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[3].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[3].Description" resize="none" class="TC-FourTextArea" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[3].Description" resize="none" class="TC-FourTextArea"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead">
{{scenicArray[3].Description}}
......@@ -194,8 +228,8 @@
</div>
<el-dialog custom-class="TC_comDMCchoose" title="选择图片" center :visible.sync="isShowScenicImg">
<!--imgType:1-酒店,2-餐厅,3-景点,4-票务,5-车辆,6-领队,7-购物店,isCheckmore:是否多选图片-->
<DMCchooseImg @closeImg="closeDMCchooseImg" ref="DMCchooseImg1" @headCallBack="getDMCimg" v-bind:queryItem="queryItem" v-bind:isCheckmore="1"
v-bind:imgType="3" v-bind:IsShowAdd="true"></DMCchooseImg>
<DMCchooseImg @closeImg="closeDMCchooseImg" ref="DMCchooseImg1" @headCallBack="getDMCimg"
v-bind:queryItem="queryItem" v-bind:isCheckmore="1" v-bind:imgType="3" v-bind:IsShowAdd="true"></DMCchooseImg>
</el-dialog>
</div>
</template>
......@@ -204,7 +238,7 @@
import DMCchooseImg from "../../commonPage/DMCchooseImg.vue";
export default {
/*IsDirect:1直采,0非直采*/
props: ["scenicArray", "IsDirect","isRead","DayNum"],
props: ["scenicArray", "IsDirect", "isRead", "DayNum"],
data() {
return {
//当前点击景点项
......@@ -212,15 +246,19 @@
//是否显示选择图片框
isShowScenicImg: false,
//点击传递对象
queryItem:{
queryName:'',
queryId:0,
queryItem: {
queryName: '',
queryId: 0,
},
//当前拖动的图片索引
currentChooseIndex:0,
currentChooseIndex: 0,
};
},
methods: {
//左移右移
ToMoveScenicItem(index, type) {
this.$parent.MoveScenicItem(this.DayNum, index, type);
},
//获取当前点击的Item
GetClickItem(obj) {
this.ClickItem = obj;
......@@ -266,16 +304,16 @@
this.ClickItem.NewScenicImg = JSON.stringify(array);
});
},
onDragImagestop(x,y){
let imgHeight=document.querySelector("#bodys_"+this.DayNum+"_"+this.currentChooseIndex).height;
var obj=document.querySelector("#boxs_"+this.DayNum+"_"+this.currentChooseIndex);
let boxHeight=document.querySelector("#boxs_"+this.DayNum+"_"+this.currentChooseIndex).offsetHeight;
let cha=boxHeight-imgHeight
onDragImagestop(x, y) {
let imgHeight = document.querySelector("#bodys_" + this.DayNum + "_" + this.currentChooseIndex).height;
var obj = document.querySelector("#boxs_" + this.DayNum + "_" + this.currentChooseIndex);
let boxHeight = document.querySelector("#boxs_" + this.DayNum + "_" + this.currentChooseIndex).offsetHeight;
let cha = boxHeight - imgHeight
if (cha <= 0) {
if(y < 0 && y < cha) {
y=cha
if (y < 0 && y < cha) {
y = cha
} else if (y > 0) {
y=0
y = 0
}
} else {
if (y < 0) {
......@@ -285,28 +323,26 @@
}
}
this.scenicArray[this.currentChooseIndex].ScenicJson.y = y;
this.$refs["fourDay_"+this.DayNum+"_"+this.currentChooseIndex]._data.top=y;
this.$refs["fourDay_" + this.DayNum + "_" + this.currentChooseIndex]._data.top = y;
},
//获取选中的图片索引
onActivated(currentIndex){
this.currentChooseIndex=currentIndex;
onActivated(currentIndex) {
this.currentChooseIndex = currentIndex;
},
},
components: {
DMCchooseImg,
VueDraggableResizable
},
watch:{
scenicArray:{
handler: function(newValue, oldValue) {
},
watch: {
scenicArray: {
handler: function (newValue, oldValue) {},
deep: true
}
},
created() {
// this.scenicArray.forEach(x=>{
// x.ScenicJson = typeof(x.ScenicJsonStr) === 'string' ? JSON.parse(x.ScenicJsonStr) : { x:0, y:0 };
// })
},
};
</script>
......@@ -35,6 +35,7 @@
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[0])">
<i class="iconfont icon-img_cz"></i>
</span>
<span class="re-delte" @click="ToMoveScenicItem(0,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-OneDetail">
......@@ -102,6 +103,8 @@
<span class="TC-find">
<i class="iconfont icon-img_cz" @click="isShowScenicImg=true,GetClickItem(scenicArray[1])"></i>
</span>
<span class="re-delte" @click="ToMoveScenicItem(1,0)"><i class="iconfont icon-zuoyi"></i></span>
<span class="re-delte" @click="ToMoveScenicItem(1,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
</div>
......@@ -123,6 +126,7 @@
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[2])">
<i class="iconfont icon-img_cz"></i>
</span>
<span class="re-delte" @click="ToMoveScenicItem(2,0)"><i class="iconfont icon-zuoyi"></i></span>
</div>
</div>
<div class="TC-Threemid Tremind">
......@@ -178,7 +182,10 @@
};
},
methods: {
//左移右移
ToMoveScenicItem(index, type) {
this.$parent.MoveScenicItem(this.DayNum, index,type);
},
//获取当前点击的Item
GetClickItem(obj) {
this.ClickItem = obj;
......
<style>
.TC-twoimage:hover .TC_uploadDiv{
display:block;
.TC-twoimage:hover .TC_uploadDiv {
display: block;
}
</style>
<template>
<div class="TC-TwoContent clearfix">
<div class="TC-twoCombox">
<div class="TC-twoimage" :id='"boxs_"+DayNum+"_"+0'>
<VueDraggableResizable axis="y" :ref='"twoDay_"+DayNum+"_"+0' tabindex="0" :w="486" :resizable='false' :x="scenicArray[0].ScenicJson.x"
:y="scenicArray[0].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(0)">
<VueDraggableResizable axis="y" :ref='"twoDay_"+DayNum+"_"+0' tabindex="0" :w="486" :resizable='false'
:x="scenicArray[0].ScenicJson.x" :y="scenicArray[0].ScenicJson.y" :z="2" :active="false" :parent="false"
@dragstop="onDragImagestop" @activated="onActivated(0)">
<img :src='compressImg(scenicArray[0].NewImaArray[0].Url, "filt", 486, "")' :id='"bodys_"+DayNum+"_"+0' />
</VueDraggableResizable>
<div class="TC_uploadDiv">
......@@ -24,25 +26,30 @@
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[0])">
<i class="iconfont icon-img_cz"></i>
</span>
<span class="re-delte" @click="ToMoveScenicItem(0,1)"><i class="iconfont icon-youyi"></i></span>
</div>
</div>
<div class="TC-twotext">
<div class="TC-Tinside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[0].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[0].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[0].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeHour" @keyup.native="checkInteger(scenicArray[0],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[0],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[0].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[0],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[0].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[0],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[0].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[0].Description" resize="none" class="TC-LongText" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[0].Description" resize="none" class="TC-LongText"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead" style="height:90px;overflow:hidden;width:413px">
{{scenicArray[0].Description}}
......@@ -52,8 +59,9 @@
</div>
<div class="TC-twoCombox">
<div class="TC-twoimage" :id='"boxs_"+DayNum+"_"+1'>
<VueDraggableResizable axis="y" :ref='"twoDay_"+DayNum+"_"+1' tabindex="0" :w="486" :resizable='false' :x="scenicArray[1].ScenicJson.x"
:y="scenicArray[1].ScenicJson.y" :z="2" :active="false" :parent="false" @dragstop="onDragImagestop" @activated="onActivated(1)">
<VueDraggableResizable axis="y" :ref='"twoDay_"+DayNum+"_"+1' tabindex="0" :w="486" :resizable='false'
:x="scenicArray[1].ScenicJson.x" :y="scenicArray[1].ScenicJson.y" :z="2" :active="false" :parent="false"
@dragstop="onDragImagestop" @activated="onActivated(1)">
<img :src='compressImg(scenicArray[1].NewImaArray[0].Url, "filt", 486, "")' :id='"bodys_"+DayNum+"_"+1' />
</VueDraggableResizable>
<div class="TC_uploadDiv">
......@@ -68,25 +76,30 @@
<span class="TC-find" @click="isShowScenicImg=true,GetClickItem(scenicArray[1])">
<i class="iconfont icon-img_cz"></i>
</span>
<span class="re-delte" @click="ToMoveScenicItem(1,0)"><i class="iconfont icon-zuoyi"></i></span>
</div>
</div>
<div class="TC-twotext">
<div class="TC-Tinside">
<h3 class="TC-comh3" v-if="IsDirect==1||isRead">{{scenicArray[1].CouponsName}}</h3>
<div v-if="!isRead">
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[1].CouponsName" placeholder="请输入景点名称"></el-input>
<el-input class="w260" v-if="IsDirect==0" v-model="scenicArray[1].CouponsName" placeholder="请输入景点名称">
</el-input>
</div>
<div class="TC-playTime">
<span>游玩时间</span>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeHour" @keyup.native="checkInteger(scenicArray[1],'PlayTimeHour')" placeholder="小时"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeHour"
@keyup.native="checkInteger(scenicArray[1],'PlayTimeHour')" placeholder="小时"></el-input>
<span v-if="isRead">{{scenicArray[1].PlayTimeHour}}</span>
&nbsp;小时&nbsp;
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeMinutes" @keyup.native="checkInteger(scenicArray[1],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<el-input class="w69" v-if="!isRead" v-model="scenicArray[1].PlayTimeMinutes"
@keyup.native="checkInteger(scenicArray[1],'PlayTimeMinutes')" placeholder="分钟"></el-input>
<span v-if="isRead">{{scenicArray[1].PlayTimeMinutes}}</span>
&nbsp;分钟
</div>
<span class="TC-comspan" v-if="!isRead">
<el-input type="textarea" v-model="scenicArray[1].Description" resize="none" class="TC-LongText" placeholder="请输入景点介绍"></el-input>
<el-input type="textarea" v-model="scenicArray[1].Description" resize="none" class="TC-LongText"
placeholder="请输入景点介绍"></el-input>
</span>
<span class="TC-comspan" v-if="isRead" style="height:90px;overflow:hidden;width:413px">
{{scenicArray[1].Description}}
......@@ -96,8 +109,8 @@
</div>
<el-dialog custom-class="TC_comDMCchoose" title="选择图片" center :visible.sync="isShowScenicImg">
<!--imgType:1-酒店,2-餐厅,3-景点,4-票务,5-车辆,6-领队,7-购物店,isCheckmore:是否多选图片-->
<DMCchooseImg @closeImg="closeDMCchooseImg" ref="DMCchooseImg1" @headCallBack="getDMCimg" v-bind:queryItem="queryItem" v-bind:isCheckmore="1"
v-bind:imgType="3" v-bind:IsShowAdd="true"></DMCchooseImg>
<DMCchooseImg @closeImg="closeDMCchooseImg" ref="DMCchooseImg1" @headCallBack="getDMCimg"
v-bind:queryItem="queryItem" v-bind:isCheckmore="1" v-bind:imgType="3" v-bind:IsShowAdd="true"></DMCchooseImg>
</el-dialog>
</div>
</template>
......@@ -106,7 +119,7 @@
import DMCchooseImg from "../../commonPage/DMCchooseImg.vue";
export default {
/*IsDirect:1直采,0非直采*/
props: ["scenicArray","IsDirect","isRead","DayNum"],
props: ["scenicArray", "IsDirect", "isRead", "DayNum"],
data() {
return {
//当前点击景点项
......@@ -114,15 +127,19 @@
//是否显示选择图片框
isShowScenicImg: false,
//点击传递对象
queryItem:{
queryName:'',
queryId:0,
queryItem: {
queryName: '',
queryId: 0,
},
//当前拖动的图片索引
currentChooseIndex:0,
currentChooseIndex: 0,
};
},
methods: {
//左移右移
ToMoveScenicItem(index, type) {
this.$parent.MoveScenicItem(this.DayNum, index, type);
},
//获取当前点击的Item
GetClickItem(obj) {
this.ClickItem = obj;
......@@ -169,16 +186,16 @@
this.ClickItem.NewScenicImg = JSON.stringify(array);
});
},
onDragImagestop(x,y){
let imgHeight=document.querySelector("#bodys_"+this.DayNum+"_"+this.currentChooseIndex).height;
var obj=document.querySelector("#boxs_"+this.DayNum+"_"+this.currentChooseIndex);
let boxHeight=document.querySelector("#boxs_"+this.DayNum+"_"+this.currentChooseIndex).offsetHeight;
let cha=boxHeight-imgHeight
onDragImagestop(x, y) {
let imgHeight = document.querySelector("#bodys_" + this.DayNum + "_" + this.currentChooseIndex).height;
var obj = document.querySelector("#boxs_" + this.DayNum + "_" + this.currentChooseIndex);
let boxHeight = document.querySelector("#boxs_" + this.DayNum + "_" + this.currentChooseIndex).offsetHeight;
let cha = boxHeight - imgHeight
if (cha <= 0) {
if(y < 0 && y < cha) {
y=cha
if (y < 0 && y < cha) {
y = cha
} else if (y > 0) {
y=0
y = 0
}
} else {
if (y < 0) {
......@@ -188,18 +205,16 @@
}
}
this.scenicArray[this.currentChooseIndex].ScenicJson.y = y;
this.$refs["twoDay_"+this.DayNum+"_"+this.currentChooseIndex]._data.top=y;
this.$refs["twoDay_" + this.DayNum + "_" + this.currentChooseIndex]._data.top = y;
},
//获取选中的图片索引
onActivated(currentIndex){
this.currentChooseIndex=currentIndex;
onActivated(currentIndex) {
this.currentChooseIndex = currentIndex;
},
},
created(){
},
mounted() {
},
created() {},
mounted() {},
created() {
// this.scenicArray.forEach(x=>{
// x.ScenicJson = typeof(x.ScenicJsonStr) === 'string' ? JSON.parse(x.ScenicJsonStr) : { x:0, y:0 };
......
......@@ -133,7 +133,8 @@
<div class="TC-titlebox">
<span class="TC-TitleSpan" v-if="!dayObj.isRead">
<el-form-item>
<el-input type="textarea" :autosize="{minRows: 1, maxRows: 8 }" resize="none" class="w700" placeholder="请输入行程大点信息" v-model="dayObj.TitleObj.Title"></el-input>
<el-input type="textarea" :autosize="{minRows: 1, maxRows: 8 }" resize="none" class="w700"
placeholder="请输入行程大点信息" v-model="dayObj.TitleObj.Title"></el-input>
</el-form-item>
</span>
<span class="TC-spanTitle" v-if="dayObj.isRead">{{dayObj.TitleObj.Title}}</span>
......@@ -142,9 +143,8 @@
<div class="TC-Comtitlediv">
<trifficTrip v-bind:trafficObj="dayObj.TrafficObj" :isOpenGroup="isOpenGroup" v-bind:AllCityList="AllCityList"
v-bind:UseTypeArray="UseTypeArray" v-bind:AirPickUp="AirPickUp" v-bind:AirSend="AirSend"
v-bind:StartCity="StartCity"
v-bind:CurrentIndex="CurrentIndex" v-bind:TotalCount="TotalCount" v-bind:dayObj="dayObj"
:isRead="dayObj.isRead"></trifficTrip>
v-bind:StartCity="StartCity" v-bind:CurrentIndex="CurrentIndex" v-bind:TotalCount="TotalCount"
v-bind:dayObj="dayObj" :isRead="dayObj.isRead"></trifficTrip>
</div>
<div class="TC-Comtitlediv">
<div class="partName">
......@@ -153,19 +153,17 @@
<div class="TC-titlebox">
<el-checkbox v-model="ishasScenic" border size="mini" @change="hasScenicChange">景点</el-checkbox>
<el-select v-if="ishasScenic&&NoticeParameters.IsDirect==1" class="w600 Ht_hotelSelect" size="mini"
:placeholder="$t('pub.pleaseSel')" :multiple-limit="5" v-model="ChooseScenicArray" multiple
filterable
:placeholder="$t('pub.pleaseSel')" :multiple-limit="5" v-model="ChooseScenicArray" multiple filterable
@visible-change="getQScenicList($event)">
<el-option v-for="item in QScenicList" :label="item.Name" :value="item.ID" :key="item.ID">
<span style="float: left">{{ item.Name }}</span>
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.Inventory }}</span>
</el-option>
</el-select>
<el-popover placement="right" width="430" trigger="click" >
<el-popover placement="right" width="430" trigger="click" v-if="NoticeParameters.IsDirect==1">
<scenicTraffic :ref="'scenicTraffic'+dayObj.DayNum+''" :ScenicArray="dayObj.ScenicArray"
:trafficObj="dayObj.TrafficObj" :ishasScenic="ishasScenic"
:CurrentDayNum="dayObj.DayNum" :totalDayNum="subConfig.DayNum"
>
:trafficObj="dayObj.TrafficObj" :ishasScenic="ishasScenic" :CurrentDayNum="dayObj.DayNum"
:totalDayNum="subConfig.DayNum">
</scenicTraffic>
<span slot="reference" class="TC-tripTitle" style="padding-left:5px;cursor:pointer;display:none;">路线信息</span>
</el-popover>
......@@ -200,24 +198,24 @@
<div class="TC-ComInfoDiv" :class="scenicCheck>0||dayObj.ScenicArray.length>0?'_margin_bottom':''">
<onedayList :class="{'showOther':TeamType==3}"
v-if="(NoticeParameters.IsDirect==1 && dayObj.ScenicArray.length==1)||(scenicCheck==1 && NoticeParameters.IsDirect==0)"
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray"
:IsDirect="NoticeParameters.IsDirect" :DayNum="dayObj.DayNum"></onedayList>
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray" :IsDirect="NoticeParameters.IsDirect"
:DayNum="dayObj.DayNum"></onedayList>
<twodayList :class="{'showOther':TeamType==3}"
v-if="(NoticeParameters.IsDirect==1 && dayObj.ScenicArray.length==2)||(scenicCheck==2 && NoticeParameters.IsDirect==0)"
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray"
:IsDirect="NoticeParameters.IsDirect" :DayNum="dayObj.DayNum"></twodayList>
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray" :IsDirect="NoticeParameters.IsDirect"
:DayNum="dayObj.DayNum"></twodayList>
<threedayList :class="{'showOther':TeamType==3}"
v-if="(NoticeParameters.IsDirect==1 && dayObj.ScenicArray.length==3)||(scenicCheck==3 && NoticeParameters.IsDirect==0)"
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray"
:IsDirect="NoticeParameters.IsDirect" :DayNum="dayObj.DayNum"></threedayList>
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray" :IsDirect="NoticeParameters.IsDirect"
:DayNum="dayObj.DayNum"></threedayList>
<fourdayList :class="{'showOther':TeamType==3}"
v-if="(NoticeParameters.IsDirect==1 && dayObj.ScenicArray.length==4)||(scenicCheck==4 && NoticeParameters.IsDirect==0)"
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray"
:IsDirect="NoticeParameters.IsDirect" :DayNum="dayObj.DayNum"></fourdayList>
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray" :IsDirect="NoticeParameters.IsDirect"
:DayNum="dayObj.DayNum"></fourdayList>
<fivedayList :class="{'showOther':TeamType==3}"
v-if="(NoticeParameters.IsDirect==1 && dayObj.ScenicArray.length==5)||(scenicCheck==5 && NoticeParameters.IsDirect==0)"
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray"
:IsDirect="NoticeParameters.IsDirect" :DayNum="dayObj.DayNum"></fivedayList>
:isRead="dayObj.isRead" :scenicArray="dayObj.ScenicArray" :IsDirect="NoticeParameters.IsDirect"
:DayNum="dayObj.DayNum"></fivedayList>
</div>
<div class="TC-warmTips TC-Comtitlediv" v-if="!dayObj.isRead" :class="{'showOther':TeamType==3}">
<div class="TC-SpecialInstruction clearfix">
......@@ -225,9 +223,8 @@
<div class="TC-rightContent">
<!--<el-input type="textarea" v-model="dayObj.WarmTipObj.Description"></el-input>-->
<my-edit v-on:edit-value="dayObj.WarmTipObj.Description = arguments[0]"
v-bind:editValue="dayObj.WarmTipObj.Description"
v-bind:toolbarShow="toolbar" v-bind:referenceList="DefaultList"
></my-edit>
v-bind:editValue="dayObj.WarmTipObj.Description" v-bind:toolbarShow="toolbar"
v-bind:referenceList="DefaultList"></my-edit>
</div>
</div>
</div>
......@@ -238,7 +235,8 @@
</div>
</div>
<hotelTrip :dayObj="dayObj" :CurrentIndex="CurrentIndex" :DayList="DayList" :WarmTripDescribe="WarmTripDescribe"
:IsDirect="NoticeParameters.IsDirect" :subConfig="subConfig" :TeamType="TeamType" :IsOpenHotel="IsOpenHotel"></hotelTrip>
:IsDirect="NoticeParameters.IsDirect" :subConfig="subConfig" :TeamType="TeamType" :IsOpenHotel="IsOpenHotel">
</hotelTrip>
<div class="TD_OperaContent">
<div class="TD_ComIcon">
<i v-if="!dayObj.isRead" class="iconfont icon-chakan" @click="getRead"></i>
......@@ -305,7 +303,7 @@
},
toolbar: {
//narrative: true, //叙述,
showToolBar:false
showToolBar: false
},
DefaultList: []
};
......@@ -359,7 +357,7 @@
this.dayObj.ScenicArray = newArray;
}
}
this.dayObj.ScenicArray.forEach(x=>{
this.dayObj.ScenicArray.forEach(x => {
// x.ScenicJson.y=0;
});
},
......@@ -413,8 +411,7 @@
this.QScenicList = res.data.data;
}
},
err => {
}
err => {}
);
},
getItemLabel(item) {
......@@ -451,6 +448,30 @@
}
}
},
//景点左移右移
MoveScenicItem(dayNum, index, type) {
var currentItem = {};
this.subConfig.DayList.forEach(dayItem => {
if (dayItem.DayNum == dayNum) {
currentItem = dayItem;
}
});
if (currentItem && currentItem.ScenicArray && currentItem.ScenicArray.length > 0) {
var cScenicItem = currentItem.ScenicArray[index];
//左移
if (type == 0) {
var leftItem = currentItem.ScenicArray[index - 1];
this.$set(currentItem.ScenicArray, index - 1, cScenicItem);
this.$set(currentItem.ScenicArray, index, leftItem);
}
//右移
else {
var rightItem = currentItem.ScenicArray[index + 1];
this.$set(currentItem.ScenicArray, index + 1, cScenicItem);
this.$set(currentItem.ScenicArray, index, rightItem);
}
}
},
//初始化行程子项的行程天数
initDayObjItemDayNum(dayObj) {
dayObj.TitleObj.DayNum = dayObj.DayNum;
......@@ -548,13 +569,16 @@
}
},
created() {
this.dayObj.ScenicArray.forEach(x=>{
this.dayObj.ScenicArray.forEach(x => {
// x.ScenicJson = (typeof(x.ScenicJsonStr) === 'string' ? x.ScenicJsonStr : { x:0, y:0 })
let obj = JSON.parse(x.ScenicJsonStr)
if (obj) {
x.ScenicJson = obj
} else {
x.ScenicJson = { x:0, y:0 }
x.ScenicJson = {
x: 0,
y: 0
}
}
})
this.initScenicData();
......@@ -688,8 +712,7 @@
deep: true
},
},
mounted() {
},
mounted() {},
components: {
onedayList,
hotelTrip,
......@@ -700,7 +723,7 @@
trifficTrip,
noScenic,
"my-edit": MyEdit,
scenicTraffic:ScenicTraffic
scenicTraffic: ScenicTraffic
}
};
......
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