看看(详情)

<template>
<div class="productDetail"> 
    <div class="main" ref="main" v-if="!createLoading">
        <!-- 选择规格遮罩层 -->
        <div class="shadow" v-if="shadowShow">
            <div class="shadowContent">
                <img class="close" @click="closeShadow()" src="../../images/footer/close_shadow.png" alt="关闭按钮">
                <div class="productImg"><img :src="productGroup.imageFile" alt="商品图"></div>
                <span class="productPrice">¥{{ productGroup.price }}</span>
                <span class="reserveNumber">库存{{ productGroup.reserveNumber }}件</span>
                <div class="specificationContent">
                    <div class="specification" v-for="(groupSpec, groupIndex) in productGroupSpec" :key="groupIndex">
                        <p class="specificationName">{{ groupSpec.specName }}</p>
                        <div class="specificationWrap">
                            <button class="specificationItem" 
                                  v-for="(spec, itemIndex) in groupSpec.values" 
                                  :disabled="spec.disable"
                                  @click="clickSpec(groupIndex, itemIndex)"
                                  :class="{cyan:spec.isSelect&&spec.isSelect==1,disAble:spec.disable}" :title="spec.specValue"
                                  :key="itemIndex">{{spec.specValue}}</button>
                        </div>
                    </div>
                    <div class="buyNum">
                        <span class="buyNumber">购买数量</span>
                        <div class="controlNumber">
                            <span class="min" @click="minNumber()">-</span>
                            <input type="number" max="1000000" min="1" v-model="postDataReserveNumber">
                            <span class="plus" @click="addNumber()">+</span>
                        </div>
                    </div>
                </div>
                <div class="shadow_footer">
                    <span class="join_cart" v-if="!isSure" @click="addToCart('shadow')">加入购物车</span>
                    <span class="buy_now" v-if="!isSure" @click="goBuy('shadow')">立即购买</span>
                    <span class="determine_btn" v-if="isSure" @click="determineClick()">确定</span>
                </div>  
            </div>
        </div>
        <!-- 购物车 -->
        <div class="shoppingCart" @click="goShoppingCart()"><img src="../../images/productDetails/shoppingCart.png" alt="购物车按钮"></div>
        <!-- banner -->
        <div class="bannerBox" >
            <div class="designBox" v-if="isCustomization == 1" @click="showOptionDesign()">选择设计</div>
            <div class="modification" @click="showModification()">修改定制信息</div>
            <!-- 横向轮播 -->
            <swiper class="swiperBox" :options="bannerOption" ref="myBanner" v-if="effectImg_460.length>0">
                <swiper-slide class="swiper_slide" v-for="(effect,index) in effectImg_460" :key="index">
                    <div class="slideWrap"><img :src="effect" alt="商品组效果图"></div>
                </swiper-slide>
                <div class="swiper_pagination" slot="pagination"></div>
            </swiper>
            <!-- 纵向轮播 -->
            <div class="designBannerBox" v-if="isCustomization == 1">
                <p class="designTitle" @click="hideOptionDesign()">选择设计</p>
                <swiper class="optionDesignBox" :options="optionDesign">
                    <swiper-slide class="swiper_slide" v-for="(design,index) in groupDesignList" :key="index">
                        <div class="slideWrap" @click="clickSlide(index)"><img :src="design.design.coverImageFile" alt="设计封面图"></div>
                    </swiper-slide>
                </swiper>
            </div>
        </div>
        <!-- 修改定制信息遮罩层 -->
        <div class="modificationBox" v-if="modificationShow">
            <div class="formBox">
                <img class="close" @click="hiddemodification()" src="../../images/footer/close_shadow.png" alt="关闭修改定制信息图标">
                <ul class="formContent">
                    <li v-if="cloneSingles.name">
                        <p>
                            <img src="../../images/shoppingProcess/willSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickName()"
                                 v-if="show.name==false">
                            <img src="../../images/shoppingProcess/endSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickName()"
                                 v-if="show.name==true">     
                            <span>姓名</span>
                        </p>
                        <input v-if="show.name==true" v-model="design.name" type="text" placeholder="请在这里输入">
                    </li>
                    <li v-if="cloneSingles.slogan">
                        <p>
                            <img src="../../images/shoppingProcess/willSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickSlogan()"
                                 v-if="show.slogan==false">
                            <img src="../../images/shoppingProcess/endSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickSlogan()"
                                 v-if="show.slogan==true">     
                            <span>座右铭</span>
                        </p>
                        <input v-if="show.slogan==true" v-model="design.slogan" type="text" placeholder="请在这里输入">
                    </li>
                    <li v-if="cloneSingles.image">
                        <p>
                            <img src="../../images/shoppingProcess/willSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickPhoto()"
                                 v-if="show.photo==false">
                            <img src="../../images/shoppingProcess/endSelect.png"
                                 alt="未选择的表单按钮"
                                 @click="clickPhoto()"
                                 v-if="show.photo==true">     
                            <span>照片</span>
                        </p>
                        <label  v-if="show.photo==true" for="filePhoto" class="photo">
                            <input id="filePhoto" type="file" @change="filePhotoChange($event)">
                            <img :src="design.image" alt="照片">
                        </label>
                    </li>
                </ul>
                <button class="save" @click="clickSave()">保存</button>
            </div>
        </div>
        <!-- 商品订货信息 -->
        <ul class="productInfo">
            <li class="titleBox">
                <div class="top">
                    <!-- 商品名称 -->
                    <span>{{ data.name }}</span>
                    <span></span><!-- 类别:入定制校服 -->
                    <span></span><!-- 性别:女 -->
                    <span class="price">¥{{ productPrice }}</span>
                </div>
                <div class="bottom">{{ groupDescr}}</div><!-- 商品简介 -->
            </li>
            <li class="infoBox">
                <ul>
                    <li style="display:none;">
                        <div class="infoKey">定做周期</div>
                        <div class="infoValue">3个工作日</div>
                    </li>
                    <li>
                        <div class="infoKey">起订量</div>
                        <div class="infoValue">{{ data.reserveNumber }}件</div>
                    </li>
                    <li>
                        <div class="infoKey">试运营期</div>
                        <div class="infoValue">15天内到货</div>
                    </li>
                    <li>
                        <div class="infoKey">商品重量</div>
                        <div class="infoValue">{{ data.weight }}kg</div>
                    </li>
                    <li>
                        <div class="infoKey">运费规则</div>
                        <div class="infoValue">满{{ freeAmount }}元,包邮</div>
                    </li>
                </ul>
            </li>
            <!-- 商品规格 -->
            <li class="specificationBox" @click="showShadow('boxClick')">
                <span class="specification_title">参数规格</span>
                <span class="specification_Item" v-for="(item,index) in productGroupSpec" :key="index">{{ item.specName }}</span>
                <img src="../../images/shoppingProcess/rightJiantou.png" alt="更多logo">
            </li>
        </ul>
        <!-- 商品展示 -->
        <div class="productDisplay">
            <div class="titleBox">
                <div class="title_top">
                    <p class="ch">商品详情</p>
                    <p class="en">PRODUCT DETAILS</p>
                </div>
                <div class="namePlate">
                    <p @click="showNamePlate()">商品铭牌</p>
                    <div v-if="namePlateShow" class="namePlateBox">
                        <p class="namePlateBox_title">商品铭牌</p>
                        <div class="namePlateItem" v-for="(item,index) in attrDefinition" :key="index">
                            <span class="namePlateItem_k">{{ item.k }}:&emsp;</span><span class="namePlateItem_v">{{ item.v }}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="productDisplayBigImg"><img v-if="detailInfo" :src="detailInfo.file" alt="商品展示大图"></div>
        <!-- 底部 -->
        <div class="footer">
            <div class="custom" @click="contactCustomerService()">
                <img src="../../images/productDetails/custom.png" alt="客服logo">
                <span>客服</span>
            </div>
            <div class="collect" @click="moveIntoCollection()">
                <img v-if="isCollection==false" src="../../images/productDetails/collect.png" alt="收藏logo">
                <img v-if="isCollection==true" src="../../images/productDetails/activeCollect.png" alt="已收藏logo">
                <span v-if="isCollection==false">收藏</span>
                <span v-if="isCollection==true">已收藏</span>
            </div>
            <div class="joinCart" @click="addToCart('footer')">加入购物车</div>
            <div class="buyNow" @click="goBuy('footer')">立即购买</div>
        </div>
    </div> 
    <div class="createLoading" v-if="createLoading">
        <img class="createMallGif" src="../../images/createMall.gif" alt="创建商城loading">
        <div class="createMallTxt">小哒正在为每一个小王子、小公主<br/>创建自己的商品城堡</div>
    </div>
    <!-- 要footer但是不显示 -->
    <FooterModel ref="footer"
                :hideFooter="1"
            />
</div>
</template>

<script>
import api from '@/js/api';
import tool from '@/js/tools';
import alert from '@/js/alertView';
import { swiper,swiperSlide } from 'vue-awesome-swiper';
import {conService} from '../../js/contactService.js';
import eduAlert from '@/js/alertView.js';
import FooterModel from '../FooterModel.vue';


export default {
    components:{
        swiper,
        swiperSlide,
        FooterModel
    },
    data(){
        return {
            createLoading:true,//创建商城的loading
            bannerOption:{//banner配置
                pagination: {//分页器
                    el: '.swiper_pagination',
                    type: 'fraction',
                    bulletElement : 'span',
                    clickable:true,
                    paginationClickable: true,
                    notNextTick:true
                }
            },
            optionDesign:{//纵向轮播配置
                direction: "vertical",
                spaceBetween:2,
                slidesPerView: 4,
            },
            file: null, //上传文件
            step:1, //每次添加到购物车的数量
            modificationShow:false,//控制修改定制信息的盒子出现韩式隐藏
            addressCode:"",
            userState:"",//用户状态
            cmCustomState:"", //商城审核状态
            cmCustomInfo:"",//商城定制信息
            cmCustomInfos:[],//商品组定制信息
            cmCustomComment:"", //cm审核未通过理由
            comment:"", //pg审核未通过理由
            loginState:"",
            idx:null,
            groupId:"",  //首页路径传过来的groupId
            isCustomization:"", //是不是0定制
            groupDesignList:[], //设计列表
            designId:"",  //商品设计ID
            productId:"",//商品ID
            imgComposeState:"", //查询图片生成状态
            cmId:"", //商城id
            productGroupList: {},//商品组列表
            productGroup:{}, //商品组信息
            isCollection:"", //收藏状态
            attrDefinition:[], //商品详情信息
            productGroupSpec:[],//商品组规格
            indexObj: {},  //处理返回的规格数据
            arrSpec:[], //商品规格
            groupDescr:"",//商品描述
            namePlateShow:false,//控制铭牌出现与隐藏
            data: {},
            productsArr:[],//商品组内的全部规格商品数组
            productSpecArr:[],//盛放点击收获到的规格数组的集合
            productPrice:null,
            productListPrice:null,
            effectImg_68:[], //效果图68
            effectImg_460:[], //效果图460
            detailInfo:{}, //请求效果图详情信息
            effectInfo:[], //效果图信息
            recommendList:[], //关联销售列表
            freeAmount:"",  //免邮金额
            authState:"",  //定制信息审核状态
            customType:"", //定制信息类型
            customId:"", //定制信息id
            changeSpec:[], //选择规格数组
            postDataReserveNumber:1, //购买数量
            cloneSingles:{//控制是否能修改此项定制信息
                nickName: false,
                fullName: false,
                logo: false,
                slogan: false,
                name: false,
                phone: false,
                addressCode: false,
                image: false,
                text: false
            },
            singles:{
                nickName: false,
                fullName: false,
                logo: false,
                slogan: false,
                name: false,
                phone: false,
                addressCode: false,
                image: false,
                text: false
            },
            design:{//自定义的商城定制信息以及回显
                nickName: "",
                fullName: "",
                logo: "",
                slogan: "",
                name: "",
                phone: "",
                addressCode: "",
                image:require('../../images/footer/preLogo.png'),
                text: ""
            },
            shadowShow:false,//控制阴影出现与隐藏
            isSure:false,//是否是确定按钮
            isPayNow:false,//如果在footer按钮上选择了立即购买 选好规格立即购买
            show:{//控制修改定制信息的显示
                name:false,
                logo:false,
                fullName:false,
                easyName:false,
                photo:false,
                slogan:false
            },
            infoTypes:[],//能够修改那些定制信息的信息
            switch1:false,//控制修改定制信息的input框是否能点击
            activeArr:[],//盛放目前选中的规格值数组
            activeNameArr:[],////盛放目前选中的规格名数组
            allSpecValArr:[],//盛放商品组所有规格值数组
            allproSpecValArr:[],//盛放所有商品的商品规格值数组
            activeValArr:[],//当前选中的所有规格值的数组
        }
    },
    created(){
        var self=this;
        self.groupId = tool.getParam('groupId');
        self.addressCode = tool.getAddressCode();
        //获取当前商城状态/商城定制信息
        self.adminAuth();
        //获取商品组图片生成状态
        self.getHomeImgCompose();
    },
    mounted(){
       
    },
    watch:{
        'data':function(value){
            document.title = value.name;
        },
    },
    computed:{
    },
    methods:{
        contactCustomerService(){//联系客服点击
            conService();
        },
        hiddemodification(){//隐藏修改定制窗口
            this.modificationShow=false;
            this.getAuthState();
            this.switch1 = false;
        },
        showModification(){//显示修改定制信息窗口
            var self = this;
            if(self.groupDesignList.length<=0){
                eduAlert.eduToast('该商品没有设计!',2000);
                return;
            }
            if(self.addressCode != 'wodaa' && self.userState == "NORMAL"){
                eduAlert.eduToast('请认证商城!',2000);
                return;
            }else if(self.addressCode == 'wodaa' && self.userState == "NORMAL"){
                eduAlert.eduToast('请创建商城!',2000);
                return;
            }
            self.modificationShow=true;
        },
        showNamePlate(){
            this.namePlateShow=!this.namePlateShow;
        },
        showOptionDesign(){//显示设计
            var self = this;
            if(self.groupDesignList.length<=0){
                eduAlert.eduToast('该商品没有设计!',2000);
                return;
            }
            document.querySelector('.designBannerBox').style.left=0;
            document.querySelector('.designBox').style.display='none';
        },
        hideOptionDesign(){//隐藏设计
            document.querySelector('.designBannerBox').style.left=-1.14+'rem';
            document.querySelector('.designBox').style.display='block';
        },
        getHomeImgCompose(){
            //查询商品组图片生成状态接口
            var self = this;
            api.get('/multi-tenant/api/cm/'+ self.addressCode +'/image-compose/product-group/'+ self.groupId,null,response =>{
                self.imgComposeState = response.data.payload;//获取图片生成状态
                if(response.data.payload == "GENERATING"){
                    // 生成中自动刷新
                    self.AutoRefresh(5000);
                    self.createLoading = true;
                    return;
                }
                if(response.data.payload == "FINISHED"){
                    self.createLoading = false;
                    self.getCmInfo();//获取商城Id
                }
            }),error =>{
                console.log(error);
            };
        },
        getCmInfo(){//获取商城信息接口   cmId
            var self=this;
            api.get('/multi-tenant/api/cm/' + self.addressCode, null , response =>  {
                self.cmId = response.data.payload.cm.id;//获取商城id
                console.log(response.data.payload)
                // 查询商品组信息接口
                        api.get("/shopping/api/cm/"+self.addressCode+"/product-group/" + self.groupId, null, response => {
                            //在每个规格值加一个isSelect属性,切记要先加属性,再赋值给变量
                            for(var i=0; i < response.data.payload.productGroupSpec.length; i++){
                                for(var j=0; j<response.data.payload.productGroupSpec[i].values.length; j++){
                                    response.data.payload.productGroupSpec[i].values[j].isSelect = false;
                                }
                            }
                            console.log(response.data.payload.productGroupSpec)
                            //给各个变量赋值
                            console.log(response.data.payload);
                            self.productGroupList = response.data.payload;//整个商品组信息
                            self.groupDescr=response.data.payload.productGroup.descr;
                            console.log(self.productGroupList);
                            self.productsArr=response.data.payload.products;//商品组内全部规格的商品
                            console.log(self.productsArr);
                            self.productGroup = self.productGroupList.productGroup;//商品组门户商品信息
                            for(var z=0; z<self.productGroup.length; z++){//处理group里的图片路径
                                if(self.productGroup[z].file){
                                    var imageFilePath = self.productGroup[z].file.split("tzd")[1];
                                    var imageFileName = imageFilePath.split(".")[0];
                                    var imageFileSurfix = imageFilePath.split(".")[1];
                                    self.effectImg_460.push(self.productGroup[z].file.split("tzd")[0] + "cm/" + self.cmId + imageFileName + "_460." + imageFileSurfix);
                                }
                            }
                            self.infoTypes = response.data.payload.infoTypes;//获取到infoType信息,来确定能修改那些定制信息
                            console.log(self.infoTypes)
                            self.isCollection = response.data.payload.isCollection;//是否收藏
                            console.log(self.isCollection)
                            self.groupPrice = self.productGroup.price;//商品价格
                            self.isCustomization = self.productGroup.isCustomization;//是否为0定制
                            if(response.data.payload.productGroupSpec){
                                self.productGroupSpec = response.data.payload.productGroupSpec;//商品组规格
                                for(var i=0; i<self.productGroupSpec.length; i++){
                                    self.arrSpec.push(self.productGroupSpec[i].specName);//商品规格名称数组
                                    for(var j=0; j<self.productGroupSpec[i].values.length; j++){
                                        self.productGroupSpec[i].values[j].disable =false;//控制规格值是否能被点击
                                    }
                                }
                                console.log(self.productGroupSpec);
                                self.initProductGroupSpec();
                            }


                            //哪个方式进入的详情 有more 、search 、home
                            // var type = sessionStorage.getItem('type');
                            // if(self.type=='search'){
                            //     //搜索-商品列表
                            //     MtaH5.clickStat('mallHomeSearchResultGoodsClick',{'category':self.productGroup.categoryName});
                            // }else if(self.type=='home'){
                            //     //商城首页_商品点击
                            //     MtaH5.clickStat('mallHomeGoodsClick',{'category':self.productGroup.categoryName});
                            // }

                            if(self.infoTypes && self.infoTypes.length > 0){
                                for(var key in self.singles){//将singles中能更改的定制信息变为true
                                    self.singles[key] = false;
                                    for(var i=0; i<self.infoTypes.length; i++){
                                        if(key == self.infoTypes[i]){
                                            self.singles[key] = true;
                                        }
                                    }
                                }
                                for(var key in self.cloneSingles){//将cloneSingles中能更改的信息变为true
                                    self.cloneSingles[key] = false;
                                    for(var i=0; i<self.infoTypes.length; i++){
                                        if(key == self.infoTypes[i]){
                                            self.cloneSingles[key] = true;
                                        }
                                    }
                                }
                                self.singles = JSON.parse(JSON.stringify(self.cloneSingles));
                            }
                            
                            if(response.data.payload.productGroup.attrDefinition){
                                self.attrDefinition = JSON.parse(response.data.payload.productGroup.attrDefinition);
                                console.log(self.attrDefinition)
                            }
                            
                            // if(response.data.payload.products){
                            //     for(var i=0; i<response.data.payload.products.length; i++){
                            //         var result = [];
                            //         var results = [];
                            //         var arr = [];//  二维数组
                            //         var ele = response.data.payload.products[i];
                            //         for(var j=0; j<ele.specs.length; j++){
                            //             arr.push([ele.specs[j].specValue]);
                            //         }
                            //         self.doExchange(arr, 0, result, results);
                            //         console.log(arr)
                            //         console.log(results)
                            //         for(var k=0; k<results.length; k++){
                            //             self.indexObj[results[k]] = ele.id;
                            //         }
                            //     }
                            // }
                            if(self.isCustomization == 1){//1为非0定制
                                // 查询商品组下的设计接口
                                api.get("/shopping/api/cm/"+self.addressCode+"/product-group/" + self.groupId + "/design/custom", null, resp => {
                                    
                                    if(resp.data.payload.length > 0){
                                        console.log(resp.data.payload);
                                        //处理设计图路径
                                        self.groupDesignList = resp.data.payload;
                                        self.designId = self.groupDesignList[0].groupDesignId;//默认为第一个设计
                                        for(var z=0; z<self.groupDesignList.length; z++){
                                            if(self.groupDesignList[z].design.coverImageFile){
                                                var imageFilePath = self.groupDesignList[z].design.coverImageFile.split("tzd")[1];
                                                var imageFileName = imageFilePath.split(".")[0];
                                                var imageFileSurfix = imageFilePath.split(".")[1];
                                                self.groupDesignList[z].design.coverImageFile = self.groupDesignList[z].design.coverImageFile.split("tzd")[0] + "cm/" + self.cmId + imageFileName + "_" + self.groupDesignList[z].design.id + "_72." + imageFileSurfix;
                                            }
                                        }
                                        console.log(self.groupDesignList)
                                        // 根据商品组id查询商品,默认是商品组id
                                        api.get("/shopping/api/cm/"+self.addressCode+"/product-group/" + self.groupId + "/product", null, response => {
                                            self.data = response.data.payload;
                                            console.log(self.data)
                                            if(response.data.payload.price){
                                                self.productPrice = response.data.payload.price;//商品价格
                                            }else{
                                                self.productPrice = self.productGroupList.productGroup.price;
                                            }
                                            if(response.data.payload.listPrice){
                                                self.productListPrice = response.data.payload.listPrice;//商品列表价格
                                            }else{
                                                self.productListPrice = self.productGroupList.productGroup.listPrice;
                                            }
                                            self.productId = response.data.payload.id;//商品id
                                            self.getEffectImage();
                                        }, error => {
                                            console.log(error);
                                        });
                                    }else{
                                        console.log("没有设计");
                                    }
                                }, err => {
                                    console.log(err);
                                });
        
                                //获取定制信息审核状态
                                self.getAuthState();
                                
                            }else if(self.isCustomization == 0){
                                // 根据商品组id查询商品,默认第一个
                                api.get("/shopping/api/cm/"+self.addressCode+"/product-group/" + self.groupId + "/product", null, response => {
                                    self.data = response.data.payload;
                                    if(response.data.payload.price){
                                        self.productPrice = response.data.payload.price;
                                    }else{
                                        self.productPrice = self.productGroupList.productGroup.price;
                                    }
                                    if(response.data.payload.listPrice){
                                        self.productListPrice = response.data.payload.listPrice;
                                    }else{
                                        self.productListPrice = self.productGroupList.productGroup.listPrice;
                                    }
                                    self.productId = response.data.payload.id;
                                    self.getZeroDesignImg();
                                }, error => {
                                    console.log(error);
                                });
                            }
        
                        }, error => {
                        console.log(error);
                        });
        
                        // 商品销量
                        // api.get('/marketing/api/cm/'+self.addressCode+'/product-group/'+ self.groupId +'/recommend', null , response =>  {
                        //     self.recommendList = response.data.payload;
                        //     for(var z=0; z<self.recommendList.length; z++){
                        //         if(self.recommendList[z].imageFile){
                        //             var imageFilePath = self.recommendList[z].imageFile.split("tzd")[1];
                        //             var imageFileName = imageFilePath.split(".")[0];
                        //             var imageFileSurfix = imageFilePath.split(".")[1];
                        //             self.recommendList[z].imageFile = self.recommendList[z].imageFile.split("tzd")[0] + "cm/" + self.cmId + imageFileName + "_460." + imageFileSurfix;
                        //         }
                        //     }
                        // }, error => {
                                
                        // });

                        //获取配送地址对应的运费信息
                        api.get('/shopping/api/cm/' + self.addressCode +'/freight', null, response => {
                            self.freeAmount = response.data.payload.freeAmount;
                        }, error => {
                            console.log(error)    
                        });
                        
            }, error => {
                 console.log(error)   
            });
        },
        getEffectImage(){
            var self = this;
            self.effectImg_68 = [];
            self.effectImg_460 = [];
            //根据商品id-设计id查询效果图
            if(self.productId != "" && self.designId != ""){
                api.get("/shopping/api/cm/"+ self.addressCode +"/product/"+ self.productId +"/design/"+ self.designId +"/image", null, response => {
                    self.detailInfo = response.data.payload.detailImage;//底部展示图片
                    console.log(response.data.payload)
                    if(self.detailInfo && self.detailInfo.file){//更改底部展示图片的图片路径
                        self.detailInfo.file = self.detailInfo.file.split("tzd")[0] + "cm/" + self.cmId + self.detailInfo.file.split("tzd")[1];
                    }
                    self.effectInfo = response.data.payload.effectImage;//效果图信息
                    for(var z=0; z<self.effectInfo.length; z++){
                        if(self.effectInfo[z].file){
                            var imageFilePath = self.effectInfo[z].file.split("tzd")[1];
                            var imageFileName = imageFilePath.split(".")[0];
                            var imageFileSurfix = imageFilePath.split(".")[1];
                            // self.effectImg_68.push(self.effectInfo[z].file.split("tzd")[0] + "cm/" + self.cmId + imageFileName + "_68." + imageFileSurfix);
                            self.effectImg_460.push(self.effectInfo[z].file.split("tzd")[0] + "cm/" + self.cmId + imageFileName + "_460." + imageFileSurfix);
                        }
                    }
                }, error => {
                    console.log(error);
                });
            }
        },
        getAuthState(){//获取定制信息审核状态
            var self = this;
            api.get("/multi-tenant/api/cm/" + self.addressCode + "/product-group/" + self.groupId + "/custom-info/current", null, response => {
                console.log(response.data.payload)
                self.authState = response.data.payload.custom.authState;
                self.customType = response.data.payload.customType;
                self.customId = response.data.payload.custom.id;
                self.cmCustomInfos = response.data.payload.custom.cmCustomInfos;
                console.log(self.cmCustomInfos)

                if(response.data.payload.custom.comment){
                    self.comment = response.data.payload.custom.comment;//定制信息未通过审核的理由
                }

                if(self.customType == "PG" && self.authState == "APPROVED"){//处理每次添加到购物车的数量
                    for(var i=0; i<self.cmCustomInfos.length; i++){
                        if(self.cmCustomInfos[i].infoType == "NAME_IMPORT_FILE"){
                            self.step = parseInt(self.cmCustomInfos[i].specialValue1);
                        }
                    }
                }

                for(var i=0; i<self.cmCustomInfos.length; i++){
                    if(self.cmCustomInfos[i].infoType == "NAME_IMPORT_FILE"){
                        self.file = self.cmCustomInfos[i].infoValue;//上传的文件
                        if(self.customType == "PG" && self.authState == "APPROVED"){
                            self.step = parseInt(self.cmCustomInfos[i].specialValue1);//加入购物车数量
                        }
                    }
                }

                for(var key in self.design){//拿到商城定制信息
                    for(var i=0; i<self.cmCustomInfos.length; i++){
                        if(key == self.cmCustomInfos[i].infoTypeHump){
                            self.design[key] = self.cmCustomInfos[i].infoValue;
                        }
                    }
                }
                console.log(self.design)

                for(var key in self.singles){
                    for(var item in self.design){
                        if(self.singles[key] == true){//能改
                            if(self.design[key] != ""){ //商城定制信息不为空
                                self.singles[key] = true;
                            }else{
                                self.singles[key] = false;//如果商城定制信息里的这一项为空,也不能修改此定制信息
                            }
                        }
                    }
                }

                for(var i=0; i<self.cmCustomInfos.length; i++){
                    for(var key in self.singles){
                        if(key == self.cmCustomInfos[i].infoTypeHump){
                            self.singles[key] = true;
                        }
                    }
                }
                
                // sessionStorage.setItem('step',self.step);//存储每次加入购物车的数量
                for(var i=0; i<self.cmCustomInfos.length; i++){
                    if(self.cmCustomInfos[i].infoType == 'NAME_IMPORT_FILE'){
                        self.switch1 = true;
                        self.singles.name = true;
                        self.file = self.cmCustomInfos[i].infoValue;
                    }
                }
            }, error => {
                console.log(error);
            });

        },
        AutoRefresh:function(t){//自动更新
            var self = this;
            setTimeout(self.getHomeImgCompose, t);
        },
        // doExchange:function (arr, index, result, results){//?????????
        //     for (var i = 0; i<arr[index].length; i++) {
        //         result[index] = arr[index][i];
        //         if (index != arr.length - 1) {
        //             this.doExchange(arr, index + 1, result, results)
        //         } else {
        //             results.push(result.join(','))
        //         }
        //     }
        // },
        getZeroDesignImg(){
            var self = this;
            self.effectImg_68 = [];
            self.effectImg_460 = [];
            api.get("/shopping/api/cm/"+self.addressCode+"/product/" + self.productId + "/zero-design/image", null, response => {
                self.detailInfo = response.data.payload.detailImage;
                if(self.detailInfo && self.detailInfo.file){
                    self.detailInfo.file = self.detailInfo.file.split("tzd")[0] + "cm/" + self.cmId + self.detailInfo.file.split("tzd")[1];
                }
                self.effectInfo = response.data.payload.effectImage;
                for(var z=0; z<self.effectInfo.length; z++){
                    if(self.effectInfo[z].file){
                        var imageFilePath = self.effectInfo[z].file.split("tzd")[1];
                        var imageFileName = imageFilePath.split(".")[0];
                        var imageFileSurfix = imageFilePath.split(".")[1];
                        self.effectImg_68.push(self.effectInfo[z].file.split("tzd")[0]+ 'tzd' + imageFileName + "_68." + imageFileSurfix);
                        self.effectImg_460.push(self.effectInfo[z].file.split("tzd")[0]+ 'tzd' + imageFileName + "_460." + imageFileSurfix);
                    }
                }
            }, error => {
                console.log(error);
            });
        },
        clickSlide(index){//点击纵向轮播切换效果图
            var self=this;
            self.designId=self.groupDesignList[index].groupDesignId;
            self.getEffectImage();//获取对应设计的效果图
        },

        /**宋辉 */
        initProductGroupSpec(){
            let self = this;
            let groupSpec = self.productGroupSpec;
            groupSpec.selectQueue = {
                groupSpec:groupSpec,
                selectedList:[], //已选规格列表,这里记录的元素是简单的specName,specValue组合
                toFiltList:[],  //待筛选列表,这里记录的元素干脆直接把绑定界面的对象直接引进来,后面处理比较方便
                current:null,
                push:function(nameIndex,valueIndex){
                    this.current={
                        specName:groupSpec[nameIndex].specName,
                        specValue:groupSpec[nameIndex].values[valueIndex].specValue
                    };
                    //把当前选中的规格插入已选规格列表,如果规格已经存在,那么更新规格值,并且清空已选规格列表后面的内容
                    let foundIndex = this.findSpecInSelected(this.current);
                    if (foundIndex>=0 ){
                        let leftCount = this.selectedList.length - foundIndex - 1;
                        if (leftCount>0){
                            this.selectedList.splice(foundIndex+1,leftCount);
                        }
                        this.selectedList[foundIndex].specValue = this.current.specValue;
                    }else{
                        this.selectedList.push(this.current);
                    }
                    //根据选中列表,决定待筛选列表的内容
                    this.toFiltList = [];
                    for (let i=0;i<groupSpec.length;i++){
                        let oneSpec = groupSpec[i];
                        if (this.findSpecInSelected(oneSpec)<0){
                            this.toFiltList.push(oneSpec);
                        }
                    }
                },
                findSpecInSelected(specObj){
                    for (let i=0;i<this.selectedList.length;i++){
                        let selectedItem = this.selectedList[i];
                        if (selectedItem.specName==specObj.specName){
                            return i;
                        }
                    }
                    return -1;
                }
            }
            groupSpec.selectCurrent = function(nameIndex, valueIndex){
                for (let i in this[nameIndex].values){
                    let value = this[nameIndex].values[i];
                    if (i==valueIndex){
                        value.isSelect=1;
                    }else{
                        value.isSelect=0;
                    }
                }
                //把当前选中的规格项和规格值记录到已选队列,并更新待筛选队列
                this.selectQueue.push(nameIndex,valueIndex);
            }
            groupSpec.filt = function(){
                let toFiltList = this.selectQueue.toFiltList;
                //根据最新的选择,筛选待筛选队列中的规格
                for (let i=0; i<toFiltList.length;i++){
                    let toFiltSpec = toFiltList[i];
                    self.disableSpecSelection(this.selectQueue, toFiltSpec);
                }
            }
        },
        clickSpec(nameIndex, valueIndex){
            this.productGroupSpec.selectCurrent(nameIndex, valueIndex);
            this.productGroupSpec.filt();
            this.filtProduct();
        },

        disableSpecSelection(selectQueue, toFiltSpec){
            let self = this;
            let products = self.productsArr;
            let selectedList = selectQueue.selectedList;
            let foundProducts = this.findProduct(selectedList, products);
            let specMap = this.getSpecValuesFromProducts(foundProducts, toFiltSpec.specName);
            for (let k in toFiltSpec.values){
                let spec = toFiltSpec.values[k];
                if (specMap[spec.specValue]){
                    spec.disable = false;
                }else{
                    spec.disable = true;
                    spec.isSelect = 0;
                }
            }
        },
        getSpecValuesFromProducts(products, specName){
            let specMap = {};
            for (let g in products){
                let product = products[g];
                for (let i in product.specs){
                    let spec = product.specs[i];
                    if (spec.specName==specName){
                        specMap[spec.specValue]=true;
                    }
                }
            }
            return specMap;
        },
        checkSpecExist(spec,originSpecs){
            for (let i in originSpecs){
                let originSpec = originSpecs[i];
                if(spec.specName==originSpec.specName && spec.specValue==originSpec.specValue){
                    return true;
                }
            }
            return false;
        },

        findProduct(selected, products){
            let foundProducts = [];
            for (let i in products){
                let product = products[i];
                let hasAll = true;
                for (let i in selected){
                    let spec = selected[i];
                    if (!this.checkSpecExist(spec,product.specs)){
                        hasAll = false;
                        break;
                    }
                }
                if (hasAll){
                    foundProducts.push(product);
                }
            }
            return foundProducts;
        },
        //筛选商品
        filtProduct(){
            var self = this;
            //拿到已选择的规格项的名称数组,给detectionSpecifi方法用
            self.changeSpec=[];
            self.productGroupSpec.selectQueue.selectedList.forEach(item => {
                self.changeSpec.push(item.specName)
            });
            //拿商品id
            if(self.findProduct(self.productGroupSpec.selectQueue.selectedList,self.productsArr).length==1){
                self.productId=self.findProduct(self.productGroupSpec.selectQueue.selectedList,self.productsArr)[0].id;
                console.log(self.productId)
            }else{
                return;
            }
            //拿到商品id后获取效果图
            if(typeof(self.productId) != "undefined" && self.isCustomization == 1){
                self.getEffectImage();
            }else if(typeof(self.productId) != "undefined" && self.isCustomization == 0){
                self.getZeroDesignImg();
            }
            // 根据商品组id查询商品价格
            if(typeof(self.productId) != "undefined"){
                api.get("/shopping/api/cm/"+self.addressCode + "/product/" + self.productId, null, response => {
                    self.data = response.data.payload;
                    if(response.data.payload.price){
                        self.productPrice = response.data.payload.price;
                    }else{
                        self.productPrice = self.productGroupList.productGroup.price;
                    }
                    if(response.data.payload.listPrice){
                        self.productListPrice = response.data.payload.listPrice;
                    }else{
                        self.productListPrice = self.productGroupList.productGroup.listPrice;
                    }
                    console.log(self.data)
                }, error => {
                    console.log(error);
                });
            }else{
                alert.eduToast('没有此规格商品!',2000);
            }
            
            // self.changeSpec.push(groupSpec);//点击那个规则就把那个规则名添加进去
            // self.changeSpec = [...new Set(self.changeSpec)];//用来判断哪些规格还未选择   数组去重
            
        },
        //检测规格是否选择完成 
        // type [shadow footer]对话框还是底部按钮
        // btnType [buy cart]购物车还是立即购买
        detectionSpecifi(type,btnType){
            var self = this;
            var arr = [];
            for(let i=0; i < self.arrSpec.length; i++){
                if (!self.changeSpec.includes(self.arrSpec[i])) {
                    arr.push(self.arrSpec[i]);//还未选择的商品规则项
                }
            }
            if(arr.length > 0){
                var strSpec = "";
                for(var i=0; i<arr.length; i++){
                    strSpec += arr[i];
                }
                //如果是弹框中的加入购物车没有商品规格-提醒
                if(type == 'shadow'){
                    alert.eduToast("请选择商品"+strSpec,2000);
                }
                //如果是底部加入购物车没有商品规格-选规格弹窗显示
                else if(type == 'footer'){
                    self.showShadow('notBoxClick',btnType);
                }
                return false;
            }
            else{
                return true;
            }
        },
        showShadow(type,btnType){
            //如果是弹窗来选择规格,下面的按钮是加入购物车和立即购买(boxClick)
            //如果是立即购买 或者 加入购物车调起的 弹窗 下面是确定按钮(notBoxClick)
            // btnType [buy cart]购物车还是立即购买
            var self = this;
            if(type == 'boxClick'){
                self.isSure = false;
            }else{
                self.isSure = true;
            }
            self.shadowShow=true;
            if(type == 'notBoxClick' && btnType == 'buy'){
                self.isPayNow = true;
            }
        },
        //蒙版上的确定按钮
        determineClick(){
            var self = this;
            self.closeShadow();
            //如果确定按钮之前是立即购买调起来的 直接立即购买
            if(self.isPayNow){
                self.goBuy();
            }else{
                self.addToCart();
            }
        },
        //立即购买按钮点击 type[shadow footer]
        goBuy: function(type) {
            var self = this;
            //如果没有检测通过
            if(!self.detectionSpecifi(type,'buy')){
                return;
            }
            if(typeof(self.productId) == "undefined"){
                alert.eduToast("没有此规格商品!");
                return;
            }
            let productsList = [];
            let productsMap = {};
            productsMap.productId = self.productId;// 商品id
            if(self.postDataReserveNumber == null){
                alert.eduToast("请填写购买数量!");
                return;
            }
            productsMap.number = self.postDataReserveNumber;// 商品数量
            if (self.isCustomization == 1) {
                productsMap.pgDesignId = self.designId;// 设计id:用户选择的定制蒙版,对于0定制商品这个字段为空
                productsMap.pgCustomId = self.customId;// 定制信息id: 当用户独立定制这个产品时,这个字段才有值
                productsMap.customType = self.customType;
            }
            productsList.push(productsMap);
            var orderDraftPostData={};
            orderDraftPostData.products = productsList;
            api.post("/order/api/cm/"+self.addressCode+"/draft", orderDraftPostData, response => {
                let orderDraftId = response.data.payload; // 订单草稿id
                self.$router.push('/mall/confirmOrder?orderDraftId='+orderDraftId);
            }, error => {
                alert.eduToast(error.data);
                if (error.status == 401) {
                    self.closeShadow();
                }
            });
        },
        //加入购物车按钮点击 type[shadow footer]
        addToCart(type){
            var self = this;
            //如果没有检测通过
            if(!self.detectionSpecifi(type,'cart')){
                return;
            }
            var cartData;
            if(typeof(self.productId) == "undefined"){
                alert.eduToast("没有此规格商品!");
                return;
            }
            let productsList = [];
            let productsMap = {};
            productsMap.productId = self.productId;// 商品id
            if(self.postDataReserveNumber == null){
                alert.eduToast("请填写购买数量!");
                return;
            }
            if(self.isCustomization == 0){
                cartData = {
                    productId: self.productId,
                    num: self.postDataReserveNumber
                }
            }else{
                cartData = {
                    productId: self.productId,
                    num: self.postDataReserveNumber,
                    pgDesignId: self.designId,
                    pgCustomId: self.customId,
                    customType: self.customType
                }
            }
            api.post("/shopping/api/cm/"+self.addressCode+"/shipping-cat/product", cartData, response => {
                alert.eduToast("已加入购物车!");
            }, error => {
                alert.eduToast(error.data,2000);
                if (error.status == 401) {
                    self.closeShadow();
                }
            });
        },
        minNumber(){
            this.postDataReserveNumber-=1;
            if(this.postDataReserveNumber<=0){
                this.postDataReserveNumber=0;
            }
        },
        addNumber(){
            this.postDataReserveNumber+=1;
            if(this.postDataReserveNumber>=1000000){
                this.postDataReserveNumber=1000000;
            }
        },
        //去购物车页面
        goShoppingCart(){
            this.$router.push('/mall/shoppingCart');
        },
        //获取当前商城状态/商城定制信息
        adminAuth(){
            var self = this; 
            api.get('/multi-tenant/api/cm/'+self.addressCode+'/state', null, response => {
                console.log(response.data.payload);
                if(response.data.payload.userStatus){
                    self.userState = response.data.payload.userStatus;
                }
                self.cmCustomState = response.data.payload.cmCustomState;
                self.cmCustomInfo = response.data.payload.cmCustomInfo;
                if(response.data.payload.cmCustomComment){
                    self.cmCustomComment = response.data.payload.cmCustomComment;
                }
                // self.loginState = localStorage.getItem('login');//暂时没有登陆状态
            }, error => {
                console.log(error) 
            });
        },
        moveIntoCollection(){//点击收藏
            var self = this;
            var collectionArr = [];
            collectionArr.push(self.data.groupId);
            console.log(self.data.groupId)
            console.log("点击收藏")
            api.post("/shopping/api/cm/"+self.addressCode+"/collection", {
                groupIds:collectionArr
            }, response => {
                console.log("请求收藏接口")
                api.get("/shopping/api/cm/"+self.addressCode+"/product-group/" + self.groupId, null, response => {
                    self.isCollection = response.data.payload.isCollection;
                    console.log(self.isCollection)
                }, error => {
                    
                });
                alert.eduToast('收藏成功')
            }, error => {
                alert.eduToast(error.data,2000);
            });
        },
        closeShadow(){
            this.shadowShow=false;
        },
        clickName(){//选中姓名
            var self=this;
            self.show.name=!self.show.name;
        },
        clickLogo(){//选中logo
            var self=this;
            self.show.logo=!self.show.logo; 
        },
        clickFullName(){//选中全称
            var self=this;
            self.show.fullName=!self.show.fullName; 
        },
        clickEasyName(){//选中简称
            var self=this;
            self.show.easyName=!self.show.easyName; 
        },
        clickPhoto(){
            var self=this;
            self.show.photo=!self.show.photo; 
        },
        clickSlogan(){//座右铭
            var self=this;
            self.show.slogan=!self.show.slogan; 
        },
        clickSave(){//点击保存 提交修改
            var self=this;
            var formdata = new FormData();
            var reg = new RegExp("[`~!@#$^&*()=|{}':;',\[\].<>《》/?~!@#¥……&*()——|{}【】‘;:”“'。,、?]");//特殊字符验证
            if(self.design.name){
                if(reg.test(self.design.name)){
                    eduAlert.eduToast('姓名含有特殊字符~',2000);
                    return;
                }
                formdata.append('name',self.design.name);
            }
            if(self.design.slogan){
                if(reg.test(self.design.slogan)){
                    eduAlert.eduToast('座右铭含有特殊字符~',2000);
                    return;
                }
                formdata.append('slogan',self.design.slogan);
            } 
            if(self.design.image){
                formdata.append('image',self.design.image);
            }
              
            api.post("/multi-tenant/api/cm/"+ self.addressCode +"/product-group/"+ self.groupId +"/custom-info", formdata, response => {
                self.modificationShow=false;
                window.location.reload();
            }, error => {
                eduAlert.eduToast('保存出错~',2000);
            });

        },
        filePhotoChange(event){//照片文件筐改变事件
            var self = this;
            var files = event.target.files, file;
            if (files && files.length > 0) {
                // 获取目前上传的文件
                file = files[0];// 文件大小校验的动作
                if(!tool.formatUpload(file)){
                    return false;
                }
                let reader = new FileReader();
                reader.readAsDataURL(file);
                reader.onload = function (e) {
                    console.log(e.target.result);
                    self.design.image = e.target.result;
                }
            }
        }
    }
}
</script>

<style scoped>

</style>
{payload: {isCollection: false, infoTypes: [],…}}
payload: {isCollection: false, infoTypes: [],…}
infoTypes: []
isCollection: false
productGroup: {name: "自粘性标签", listPrice: 2.4, price: 1.8, descr: "", isOnShelve: 1,…}
productGroupSpec: [{groupId: 84, specId: 88, specName: "颜色",…}, {groupId: 84, specId: 90, specName: "规格",…}]
0: {groupId: 84, specId: 88, specName: "颜色",…}
createBy: 2
createTime: "2018-10-08 09:51:53"
deleteState: 0
groupId: 84
id: 88
specId: 88
specName: "颜色"
updateBy: 2
updateTime: "2018-11-23 14:20:05"
values: [{groupId: 84, specId: 88, specName: "颜色", specValue: "红", id: 92, deleteState: 0},…]
0: {groupId: 84, specId: 88, specName: "颜色", specValue: "红", id: 92, deleteState: 0}
1: {groupId: 84, specId: 88, specName: "颜色", specValue: "蓝", id: 93, deleteState: 0}
1: {groupId: 84, specId: 90, specName: "规格",…}
createBy: 2
createTime: "2018-10-09 11:05:32"
deleteState: 0
groupId: 84
id: 90
specId: 90
specName: "规格"
updateBy: 2
updateTime: "2018-11-23 14:20:05"
values: [{groupId: 84, specId: 90, specName: "规格", specValue: "YT-09", id: 103, deleteState: 0},…]
0: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-09", id: 103, deleteState: 0}
1: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-10", id: 104, deleteState: 0}
2: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-14", id: 105, deleteState: 0}
3: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-15", id: 106, deleteState: 0}
4: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-16", id: 107, deleteState: 0}
5: {groupId: 84, specId: 90, specName: "规格", specValue: "YT-17", id: 108, deleteState: 0}
products: [{isLimited: 0,…}, {isLimited: 0,…}, {isLimited: 0,…}, {isLimited: 0,…}, {isLimited: 0,…},…]
0: {isLimited: 0,…}
id: 113
isLimited: 0
specs: [{productId: 113, groupSpecValueId: 93, specId: 88, specName: "颜色", specValue: "蓝", id: 483,…},…]
0: {productId: 113, groupSpecValueId: 93, specId: 88, specName: "颜色", specValue: "蓝", id: 483,…}
1: {productId: 113, groupSpecValueId: 104, specId: 90, specName: "规格", specValue: "YT-10", id: 484,…}
1: {isLimited: 0,…}
2: {isLimited: 0,…}
3: {isLimited: 0,…}
4: {isLimited: 0,…}
5: {isLimited: 0,…}

 api

import axios from 'axios';

let env = process.env.NODE_ENV;
var needLogin = "";
let root = '';
let yxHeader;

if (env === 'development') {
    console.log("api");
    // root = '/api/';
    root = '';
} else if (env === 'production') {
    console.log("pro");
    root = '';
} else {
    throw '请检查process.env.NODE_ENV的值,是否符合这些值之一:development,production';
}

Date.prototype.format = function (fmt) {
    var o = {
        "y+": this.getFullYear(),
        "M+": this.getMonth() + 1, //月份 
        "d+": this.getDate(), //日 
        "H+": this.getHours(), //小时 
        "m+": this.getMinutes(), //分 
        "s+": this.getSeconds() //秒 
    };
    if (!fmt) {
        fmt = 'yyyy-MM-dd HH:mm:ss';
    }
    if (/(y+)/.test(fmt))
        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o) {
        if (new RegExp("(" + k + ")").test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        }
    }
    return fmt;
}

// 自定义判断元素类型JS
function toType(obj) {
    return ({}).toString.call(obj).match(/s([a-zA-Z]+)/)[1].toLowerCase();
}

// 参数过滤函数
function filterNull(o) {
    for (var key in o) {
        if (o[key] === null) {
            delete o[key];
        }
        if (toType(o[key]) === 'string') {
            o[key] = o[key].trim();
        } else if (toType(o[key]) === 'date') {
            o[key] = (o[key].format());
        } else if (toType(o[key]) === 'object') {
            o[key] = filterNull(o[key]);
        } else if (toType(o[key]) === 'array') {
            o[key] = filterNull(o[key]);
        }
    }
    return o;
}

function apiAxios(method, url, params, success, failure, authFail) {
    console.log('url:' + url);
    if (params) {
        params = filterNull(params);
    }

    var base = "";
    if (url.indexOf(".html") != -1) {
        base = "";
    } else {
        base = root;
    }

    axios({
        method: method,
        url: url,
        data: method === 'POST' || method === 'PUT' || method === 'DELETE' ? params : null,
        params: method === 'GET' ? params : null,
        baseURL: base,
        withCredentials: true
    }).then(function (res) {
        if (res.status >= 200 && res.status <= 210) {
            if (success) {
                success(res);
            }
        } else {
            //不走
            // window.alert('error: ' + JSON.stringify(res.data));
        }
    }).catch(function (err) {
        let res = err.response;
        if (err && res) {
            console.log(res.status);
            if (res.status == 504) {
                alert("服务器连接失败!请检查您的网络或服务器!!");
                return;
            } else if (res.status == 401) {
                console.log('------------------:status'+res.status);
                console.log('------------------:authFail'+authFail);
                showHeaderSignin();
                // if (authFail) {
                //     localStorage.setItem('login', '');
                //     authFail(res);
                // } else {
                //     showHeaderSignin();
                //     return;
                // }
            } else if(res.status == 750){
                var host = window.location.host;
                window.location.href = window.location.href.split(host)[0] + host;
            }

            if (failure) {
                failure(res);
            } else {
                window.alert(res.data);
            }
        } else {
            if(authFail){
                localStorage.setItem('login', '');
                authFail(res);
            }else{
                window.alert(err);
            }
        }
    });
}

// 返回在vue模板中的调用接口
export default {
    get: function (url, params, success, failure,authFail) {
        return apiAxios('GET', url, params, success, failure,authFail);
    },
    post: function (url, params, success, failure) {
        return apiAxios('POST', url, params, success, failure);
    },
    put: function (url, params, success, failure) {
        return apiAxios('PUT', url, params, success, failure);
    },
    delete: function (url, params, success, failure) {
        return apiAxios('DELETE', url, params, success, failure);
    },
    initHeader: function (headerModel) {
        yxHeader = headerModel;
        console.log('------------------:initHeader'+yxHeader);
        if (needLogin && needLogin == "1") {
            yxHeader.showSignin();
        }
    }
};

function showHeaderSignin() {
    console.log('------------------:yxHeader'+yxHeader);
    if (yxHeader) {
        if(localStorage.getItem('login') == "logining"){
            alert.eduToast('登录已过期请重新登录!',2000);
        }
        localStorage.setItem('login', '');
        console.log('------------------:yxHeader.showSignin'+yxHeader.showSignin);
        yxHeader.showSignin();
        console.log('------------------:闫雪方法调用');
    } else {
        localStorage.setItem('login', '');
        needLogin = "1";
        console.log('------------------:needLogin'+needLogin);
    }
}

config

// 静态资源以/cm和/tzd/开头的目前直接代理到192.168.1.237。
// interfaceHost: 接口请求代理的主机。
let interfaceHost = '192.168.1.237';

module.exports = {

  // baseUrl: '/',

  devServer: {
    port: 8088,
    proxy: {
      '/cm/': {
        target: 'http://192.168.1.237:80',
        changeOrigin: true,
        pathRewrite: {}
      },
      '/tzd/': {
        target: 'http://192.168.1.237:80',
        changeOrigin: true,
        pathRewrite: {}
      },
      '/acl/': {
        target: 'http://' + interfaceHost + ':8001',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/shopping/': {
        target: 'http://' + interfaceHost + ':8002',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/order/': {
        target: 'http://' + interfaceHost + ':8003',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/multi-tenant/': {
        target: 'http://' + interfaceHost + ':8004',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/marketing/': {
        target: 'http://' + interfaceHost + ':8005',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      },
      '/image-compose/': {
        target: 'http://' + interfaceHost + ':8006',
        changeOrigin: true,
        pathRewrite: {
            '^/api': ''
        }
      },
      '/tzding/': {
          target: 'http://' + interfaceHost + ':8008',
          changeOrigin: true,
          pathRewrite: {
              '^/api': ''
          }
      }
    }
  }
}
原文地址:https://www.cnblogs.com/fqh123/p/10195408.html