<style>
 @import "../../../assets/css/advert/advmanager";
 .GroupAdvert .zezhao{left:0!important;top:0!important;bottom:0!important;width:100%;height:100%;z-index:999;}
 .GroupAdvert img{width:100%;height:100%;}
</style>
<template>
    <div class="advmanager-box">
        <div class="query-box">
            <ul>
                <li>
                    <span>
                        <em>{{$t('objFill.guangaolx')}}</em>
                        <el-select class='w150' v-model="msg.AdType" filterable :placeholder="$t('pub.pleaseSel')">
                            <el-option :label="$t('pub.unlimitedSel')" :value='SelectDefaultValue'></el-option>
                            <el-option v-for="item in AdTypeList" :label='item.name' :value='item.Id' :key='item.Id'>
                            </el-option>
                        </el-select>
                    </span>
                </li>
                <li>
                    <span>
                        <input type="button" class="normalBtn" @click="getaddatas" :value="$t('pub.searchBtn')"/>
                    </span>
                    <span>
                        <el-upload class="upload-demo" :http-request="UploadAttachment" :multiple="true" accept="image/jpeg,image/gif,image/png,image/bmp"
                        :show-file-list="false" action="">
                            <input type="button" class="normalBtn" :value="$t('system.up_upImg')"/>
                        </el-upload>
                    </span>
                    <span>
                        <input type="button" class="normalBtn" @click='goUrl("advert",LineID,msg.TCID,"制作广告")' :value="$t('objFill.zhizuogg')"/>
                    </span>
                </li>
            </ul>
        </div>
        <div class="content GroupAdvert">
            <ul>
                <li v-for='(item,index) in dataList' :key="item.id" @click="getPicList(index)">
                    <div class="img-box">
                        <img :src="item.AdvertisingPicUrl" />
                        <span class="free" v-if="item.AdType==1">{{$t('Operation.Op_advertising')}}</span>
                        <span class="free" v-if="item.AdType==2">{{$t('objFill.bendi')}}</span>
                        <div class="zezhao">
                            <a v-if="item.AdType==1" :href='`/#/advert?id=${item.AdvertId}&TCID=${item.TCID}`'><i class="el-icon-edit" :title="$t('pub.updateMsg')"></i></a>
                            <a :href='item.AdvertisingPicUrl' :download="$t('salesModule.AdvPic')+'.png'"><i class="el-icon-download" :title="$t('objFill.xz')"></i></a>
                            <i class="el-icon-delete" :title="$t('system.ph_shanchu')" @click.stop="deleteItem(item.ID)"></i>
                        </div>
                    </div>
                </li>
            </ul>
            <div v-if='dataList.length==0' style='width:100%;margin-top:50px;text-align:center;color: #ccc;'>
                <i class="iconfont icon-kong" style="font-size: 120px;"></i><br/>
                {{$t('objFill.haimeiyggo')}}
            </div>
        </div>
        <div v-if='picIsShow' class="viewBigPicLayer" @click="picIsShow=false">
			<i class="el-icon-circle-close-outline clolseViewBigPicLayer" @click="picIsShow=false"></i>
			    <el-carousel  height="600px" :initial-index='initialIndex' :interval="5000" trigger="click">
			      <el-carousel-item  v-for="(item,index) in picObj" :key="index">
			        <div class="inlineDiv ownScrollbarStyle"><img :src="item" /></div>
			      </el-carousel-item>
			    </el-carousel>
		</div>
    </div>
</template>

<script>
import vueWaterfallEasy from 'vue-waterfall-easy'
export default {
    data(){
        return{
            dataList:[],
            pageIndex:0,
            pageSize:15,
            picObj:[],
            picIsShow:false,
            initialIndex:0,
            total:0,
            LineID:0,
            msg:{
                TCID:0,
                AdType:0
            },
            SelectDefaultValue:0,
            AdTypeList:[{
                Id:1,
                name:this.$t('objFill.guanggaozz')
            },{
                Id:2,
                name:this.$t('objFill.bendisc')
            }],
        }
    },
    components: {
        vueWaterfallEasy
    },
    mounted(){
        this.msg.TCID = this.$route.query.TCID;
        this.LineID = this.$route.query.LineID
        this.user=JSON.parse(window.localStorage.userInfo)
        this.getaddatas()
    },
    methods:{
        //删除广告
        deleteItem(ID){
            var that = this;
            var Ids = [];
            Ids.push(ID);
            that.Confirm(that.$t('tips.shifoushanchu'), function() {
                var msg = {
                    Ids: Ids
                };
                that.apipost(
                "travel_post_DeletePriceAdvert",
                msg,
                res => {
                    if (res.data.resultCode == 1) {
                        that.Success(res.data.message);
                        that.getaddatas();
                    }
                },
                null
                );
            });
        },

        handleCurrentChange(val) {
            this.pageIndex++
            this.getaddatas()
        },
        getaddatas(){
            this.apipost("travel_post_GetPriceAdvert", this.msg, res => {
                if(res.data.resultCode==1){
                    this.dataList = res.data.data;
                }else{
                    this.Error(res.data.message);
                }
            },err => {})
        },
        //获取轮播路径
        getPicList(index){
            this.picIsShow=true;
            this.picObj=[];
            this.initialIndex = index;
            this.dataList.forEach((x,index)=>{
                this.picObj.push(x.AdvertisingPicUrl);
            })
        },
        //上传广告图片
        UploadAttachment(file) {
            let newArr = [];
            newArr.push(file.file);
            let fileName = file.file.name;
            var path = "/Upload/DMC/Price/";
            var imgArr = [];
            this.UploadSelfFileT(path, newArr, x => {
                var obj = this.$DMCUtils.DMCImageObj();
                var str = x.data.FilePath;
                var imgUrl = this.domainManager().ViittoFileUrl + x.data.FilePath;
                obj.Path = str;
                obj.ShowPath = imgUrl;
                imgArr.push(obj.ShowPath);
                let msg = {
                    TCID:this.msg.TCID,
                    AdvertisingPicUrlList:imgArr
                }
                this.apipost("travel_post_AddPriceLocalAdvert", msg, res => {
                    if(res.data.resultCode==1){
                        this.Success(res.data.message);
                        this.getaddatas();
                    }else{
                        this.Error(res.data.message);
                    }
                },err => {})
            },2);
        },
        //跳转
        goUrl(path,LineID,TCID, name) {
            this.$router.push({
                name: path,
                query: { LineID: LineID, TCID: TCID ,blank:'y',tab:name}
            });
        },
    }
}
</script>