|
|
|
@ -13,60 +13,19 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 机票酒店 --> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/plane_ticket.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">机票酒店</text> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item, index) in plane_ticket_list" :key="index" |
|
|
|
v-if="!item.checked" @click="activaItem(item, index, 'plane_ticket_list')">{{ item.name }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 旅游度假 --> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/travel.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">旅游度假</text> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item, index) in travel_list" :key="index" |
|
|
|
v-if="!item.checked" @click="activaItem(item, index, 'travel_list')">{{ item.name }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 接送服务 --> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/jieson.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">接送服务</text> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item, index) in jieson_list" :key="index" |
|
|
|
v-if="!item.checked" @click="activaItem(item, index, 'jieson_list')">{{ item.name }} |
|
|
|
<view v-for="(item,index) of channel_list"> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/plane_ticket.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">{{item.name}}</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 其他精选 --> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/other.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">其他精选</text> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item, index) in other_list" :key="index" |
|
|
|
v-if="!item.checked" @click="activaItem(item, index, 'other_list')">{{ item.name }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 攻略社区 --> |
|
|
|
<view class="title lf-m-t-40"> |
|
|
|
<image src="../../static/images/strategy.png" class="icon-img"></image> |
|
|
|
<text class="lf-m-l-10">攻略社区</text> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item, index) in strategy_list" :key="index" |
|
|
|
v-if="!item.checked" @click="activaItem(item, index, 'strategy_list')">{{ item.name }} |
|
|
|
<view class="lf-flex-wrap lf-p-l-5 select-box"> |
|
|
|
<view class="select-item" hover-class="lf-opacity" |
|
|
|
v-for="(item2, index2) in item.content" :key="index2" |
|
|
|
v-if="!item2.checked" @click="activaItem(item2, index2, index, item)">{{ item2.name }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -75,121 +34,77 @@ |
|
|
|
data(){ |
|
|
|
return { |
|
|
|
select_list: {}, // 当前选中的频道 |
|
|
|
plane_ticket_list: [{ |
|
|
|
name: '多地比价', |
|
|
|
key: 'a1', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '降价提醒', |
|
|
|
key: 'a2', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '团体机票', |
|
|
|
key: 'a3', |
|
|
|
checked: false |
|
|
|
}], // 机票酒店 |
|
|
|
travel_list: [{ |
|
|
|
name: '周边游', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '国内游', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '主题玩法', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '尾单特卖', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '邮轮', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '汽车·船票', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '定制游', |
|
|
|
checked: false |
|
|
|
}], // 旅游度假 |
|
|
|
jieson_list: [{ |
|
|
|
name: '接送机', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '接送火车', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '打车', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '按天包车', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '定制包车', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '国内租车', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '境外租车', |
|
|
|
checked: false |
|
|
|
}], // 接送服务 |
|
|
|
other_list: [{ |
|
|
|
name: '每日签到', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '会员中心', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '任务中心', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '智慧旅游', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '兑换会员', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '旅盟', |
|
|
|
checked: false |
|
|
|
}], // 其他精选 |
|
|
|
strategy_list: [{ |
|
|
|
name: '旅游攻略', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '玩法指南', |
|
|
|
checked: false |
|
|
|
},{ |
|
|
|
name: '有问必答', |
|
|
|
checked: false |
|
|
|
}] |
|
|
|
channel_list: [], |
|
|
|
chanel_id: [], |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(){ |
|
|
|
|
|
|
|
this.getChannel() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
updateChannel() { |
|
|
|
this.$http(this.API.API_EDITCHANNEL,{channels: this.chanel_id},{showLoading:false}).then(res => { |
|
|
|
console.log(res) |
|
|
|
}).catch(err => { |
|
|
|
|
|
|
|
}) |
|
|
|
}, |
|
|
|
//频道列表 |
|
|
|
getChannel() { |
|
|
|
this.$http(this.API.API_CHANNEL).then(res => { |
|
|
|
let list = []; |
|
|
|
res.data.forEach(item => { |
|
|
|
if(item.pid == 0) { |
|
|
|
item.content = []; |
|
|
|
list.push(item); |
|
|
|
} |
|
|
|
}) |
|
|
|
this.channel_list = list; |
|
|
|
|
|
|
|
res.data.forEach(item => { |
|
|
|
this.channel_list.forEach((item2,index) => { |
|
|
|
if(item.pid == item2.id) { |
|
|
|
this.channel_list[index].content.push(item); |
|
|
|
this.channel_list[index].content.forEach((item3,index3) => { |
|
|
|
this.$set(this.channel_list[index].content[index3],'checked',false) |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
}).catch(err => { |
|
|
|
|
|
|
|
}) |
|
|
|
}, |
|
|
|
// 添加频道 |
|
|
|
activaItem(item, index, list_name){ |
|
|
|
activaItem(item2, index2, index, item){ |
|
|
|
let select_list = this.select_list; |
|
|
|
if(!select_list[item.name]){ |
|
|
|
if(Object.keys(select_list).length > 12){ |
|
|
|
if(!select_list[item2.name]){ |
|
|
|
if(Object.keys(select_list).length > 11){ |
|
|
|
this.$msg('最多只能添加12个频道哦') |
|
|
|
}else{ |
|
|
|
this.select_list[item.name] = list_name; |
|
|
|
this[list_name][index].checked = true; |
|
|
|
this.select_list[item2.name] = {p_index: index, c_index: index2}; |
|
|
|
this.chanel_id.push(item2.id); |
|
|
|
this.channel_list[index].content[index2].checked = true; |
|
|
|
} |
|
|
|
} |
|
|
|
this.updateChannel(); |
|
|
|
}, |
|
|
|
// 移除频道 |
|
|
|
cancelItem(key){ |
|
|
|
// 源数据状态改变 |
|
|
|
let list = this[this.select_list[key]]; |
|
|
|
list.forEach(item => { |
|
|
|
if(item.name == key){ |
|
|
|
item.checked = false; |
|
|
|
let item = this.select_list[key]; |
|
|
|
let list = this.channel_list[item.p_index].content[item.c_index]; |
|
|
|
let id = this.channel_list[item.p_index].content[item.c_index].id; |
|
|
|
list.checked = false; |
|
|
|
// this.chanel_id.filter(t => t != id) |
|
|
|
this.chanel_id.forEach((item,index) => { |
|
|
|
if(this.chanel_id[index] == id) { |
|
|
|
this.chanel_id.splice(index, 1) |
|
|
|
} |
|
|
|
}); |
|
|
|
// 清除选中的对象 |
|
|
|
delete this.select_list[key]; |
|
|
|
this.updateChannel(); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
