<template>
    <div class="car_add" v-loading.fullscreen.lock="fullscreenLoading">
        <div>
            <div class="communal-title">
                <div>{{ title }}</div>
            </div>
        </div>
        <hr style='background-color:#5555; height:1px; border:none;margin: 10px 0;' />
        <div>
            <el-form :model="delegationInfo" label-width="100px" class="demo-ruleForm">
                <div style="display: flex;flex-wrap: wrap;">
                    <div style="width: 394px;">
                        <el-form-item label="团组名称:" label-width="160px">
                            <el-select v-model="DiIdSelect" clearable filterable placeholder="团组选择"
                                @change="DecreasePaymentsChange" :disabled="isShow" style="width: 100%;">
                                <el-option v-for="item in delegationInfoList" :key="item.id" :label="item.teamName"
                                    :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="团 号:" prop="tourCode" label-width="160px">
                            <el-input placeholder="团号" v-model="delegationInfo.tourCode" :disabled="true">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="客户:" prop="clientName" label-width="160px">
                            <el-input placeholder="客户" v-model="delegationInfo.clientName" :disabled="true">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="出访国家:" prop="visitCountry" label-width="160px">
                            <el-input placeholder="出访国家" v-model="delegationInfo.visitCountry" :disabled="true">
                            </el-input>
                        </el-form-item>
                    </div>
                </div>
            </el-form>
            <el-form :model="DecreasePaymentsData" ref="DecreasePaymentsData" :rules="DecreasePaymentsRules"
                label-width="100px" class="demo-ruleForm">
                <div style="display:flex ;flex-wrap: wrap;">
                    <!-- <div style="width: 394px;">
                        <el-form-item label="团组类型:" prop="clientName" label-width="160px">
                            <el-input placeholder="团组类型" v-model="delegationInfo.clientName" :disabled="true">
                            </el-input>
                        </el-form-item>
                    </div> -->
                    <div style="width: 394px;">
                        <el-form-item label="费用名称:" prop="priceName" label-width="160px">
                            <el-input placeholder="费用名称" v-model="DecreasePaymentsData.priceName">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="费用单价:" prop="currency" label-width="160px">
                            <el-input-number @blur="Sumup" style="width:56%" :precision="2" placeholder="费用金额" v-model="DecreasePaymentsData.price" :controls='false'>
                            </el-input-number>
                            <!-- <el-input placeholder="费用单价" v-model="DecreasePaymentsData.price" style="width: 56%;">
                            </el-input> -->
                            <el-select v-model="DecreasePaymentsData.currency" style="width: 40%;">
                                <el-option v-for="item in rateList" :key="item.currencyId" :label="item.currencyCode"
                                    :value="item.currencyId"></el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="数量:" prop="quantity" label-width="160px">
                            <el-input-number @blur="Sumup" style="width:100%" :precision="2" placeholder="数量" v-model="DecreasePaymentsData.quantity" :controls='false'>
                            </el-input-number>
                            <!-- <el-input placeholder="数量" v-model="DecreasePaymentsData.payee">
                            </el-input> -->
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="供应商全称:" prop="supplierName" label-width="160px">
                            <!-- <el-input placeholder="供应商全称" v-model="DecreasePaymentsData.supplierName">
                            </el-input> -->

                            <el-autocomplete
                            style="width: 100%;"
                            v-model="DecreasePaymentsData.supplierName"
                            :fetch-suggestions="querySearchAsync"
                            placeholder="供应商全称"
                            @select="handleSelect"
                            ></el-autocomplete>
                            
                        </el-form-item>
                    </div>
                    <div v-if="eventspd" style="width: 394px;">
                        <el-form-item label="供应商类型:" prop="supplierTypeId" label-width="160px">
                            <el-select v-model="DecreasePaymentsData.supplierTypeId" placeholder="供应商类型"
                                style="width: 100%;">
                                <el-option v-for="(item,index) in suppliertype" :key="index" :label="item.name" :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="供应商地区:" prop="supplierArea" label-width="160px">
                            <el-select v-model="DecreasePaymentsData.supplierArea" placeholder="供应商地区"
                                style="width: 100%;">
                                <el-option v-for="(item,index) in supplierRegion" :key="index" :label="item.name" :value="item.id"></el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="社交账号:" prop="supplierSocialAccount" label-width="160px">
                            <el-input placeholder="社交账号" v-model="DecreasePaymentsData.supplierSocialAccount">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="供应商地址:" prop="supplierAddress" label-width="160px">
                            <el-input placeholder="供应商地址" v-model="DecreasePaymentsData.supplierAddress">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="邮箱:" prop="supplierEmail" label-width="160px">
                            <el-input placeholder="邮箱" v-model="DecreasePaymentsData.supplierEmail">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="联系人:" prop="supplierContact" label-width="160px">
                            <el-input placeholder="联系人" v-model="DecreasePaymentsData.supplierContact">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="联系电话:" prop="supplierContactNumber" label-width="160px">
                            <el-input placeholder="联系电话" v-model="DecreasePaymentsData.supplierContactNumber">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="费用标识:" prop="orbitalPrivateTransfer" label-width="160px">
                            <el-select v-model="DecreasePaymentsData.orbitalPrivateTransfer" placeholder="费用标识"
                                style="width: 100%;">
                                <el-option key="0" label="公转" :value=0>
                                </el-option>
                                <el-option key="1" label="私转" :value=1>
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="费用总价:" label-width="160px">
                            <el-input-number disabled style="width:56%" :precision="2" placeholder="费用总价" v-model="DecreasePaymentsData.feeTotal" :controls='false'>
                            </el-input-number>
                            <el-select disabled v-model="DecreasePaymentsData.currency" style="width: 40%;">
                                <el-option v-for="item in rateList" :key="item.currencyId" :label="item.currencyCode"
                                :value="item.currencyId"></el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="支付方式:" prop="payDId" label-width="160px">
                            <el-select v-model="DecreasePaymentsData.payDId" placeholder="支付方式" style="width: 100%;">
                                <el-option v-for="item in payment" :key="item.id" :label="item.name" :value="item.id">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </div>
                    
                    <div style="width: 394px;">
                        <el-form-item label="开户行:" label-width="160px">
                            <el-input placeholder="开户行" v-model="DecreasePaymentsData.otherBankName">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="银行卡号:"  label-width="160px">
                            <el-input placeholder="银行卡号" v-model="DecreasePaymentsData.otherSideNo">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div style="width: 394px;">
                        <el-form-item label="对方姓名:"  label-width="160px">
                            <el-input placeholder="对方姓名" v-model="DecreasePaymentsData.otherSideName">
                            </el-input>
                        </el-form-item>
                    </div>
                    <div v-if="Switchwifi" style="width: 394px;">
                        <el-form-item label="wifi平台OTA订单号:" prop="otaOrderNo" label-width="160px">
                            <el-input placeholder="wifi平台OTA订单号" v-model="DecreasePaymentsData.otaOrderNo">
                            </el-input>
                        </el-form-item>
                    </div>
                </div>
                <div style="display: flex;">
                    <div>
                        <el-form-item label="附件:" prop="fileUrl" label-width="160px">
                            <el-upload :file-list="uploadFiles" ref="upload" :on-success="upLoadSuccess"
                                :on-error="upLoadError" :before-remove="beforeRemove" :on-change="onChange" :limit="1"
                                :on-exceed="exceed" :action="uploadURL" :headers="headers" :auto-upload="false">
                                <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
                                <!-- <el-button style="margin-left: 10px;" size="small" type="success"
                                    @click="submitUpload">上传到服务器</el-button> -->
                            </el-upload>


                        </el-form-item>
                    </div>
                </div>
                <div style="display: flex;">
                    <div style="width: 100%;">
                        <el-form-item label="备 注:" prop="remark" label-width="160px">
                            <el-input type="textarea" :rows="5" placeholder="备注"
                                v-model="DecreasePaymentsData.remark"></el-input>
                        </el-form-item>
                    </div>
                </div>
                <el-form-item>
                    <div style="text-align: right;">
                        <el-button type="primary" @click="addBtn">保存</el-button>
                        <!-- <router-link to='/home/DecreasePayments'> -->
                        <el-button @click="quxiao">取消</el-button>
                        <!-- </router-link> -->
                    </div>
                </el-form-item>
            </el-form>

        </div>
    </div>
</template>
<script>
import { Decimal } from 'decimal.js'
import {debounce} from '../../store/statice'
export default {
    data() {
        return {
            projectName: "",
            uploadURL: "http://132.232.92.186:8888/api/Groups/UploadProject",
            uploadFiles: [],//上传的文件列表
            DelfileName: "",
            title: "新增其他款项",
            token: '',
            userId: 0,
            id: '',
            DiId: '',
            isShow: false,
            DiIdSelect: '',
            delegationInfo: {},
            delegationInfoList: [],//团组下拉框
            payment: [],//支付方式下拉框
            DecreasePaymentsData: {
                status: 0,//操作状态 1 添加 2 修改
                payDId: 72,//支付方式
                orbitalPrivateTransfer: 0,//费用表示
                supplierName: "",//收款方
                id: 0,//编号
                diId: 0,//团组外键编号
                priceName: "",//费用名称
                price: 0,//费用金额
                supplierContact:"",//联系人
                supplierContactNumber:"",//联系电话
                currency: '',//费用币种
                filePath: "",//附件地址
                createUserId: 0,//创建者Id
                remark: "",//备注
                supplierArea:1,//供应商地区
                supplierTypeId:'',//供应商类型
                quantity:0,//数量
                feeTotal:0,//总计
                supplierSocialAccount:'',//社交账号
                supplierAddress:'',//供应商地址
                supplierEmail:'',//邮箱
                otherBankName:'',//开户行
                otherSideNo:'',//银行卡号
                otherSideName:'',//对方姓名
                otaOrderNo:'',//wifi平台OTA订单号
            },
            IsAuditGM: 0,
            Decrease: {},
            CreditCard: {},
            headers: {
                Authorization: JSON.parse(localStorage.getItem('userinif')).token,
                TypeName: "A"
            },
            DecreasePaymentsRules: {
                currency: [
                    { required: true, message: '请选择币种', trigger: 'change' },
                ],
                priceName: [
                    { required: true, message: '请输入费用名称', trigger: 'change' },
                ],
                supplierName: [
                    { required: true, message: '请输入供应商全称', trigger: 'change' },
                ],
                orbitalPrivateTransfer: [
                    { required: true, message: '请选择费用标识', trigger: 'change' },
                ],
                payDId: [
                    { required: true, message: '请选择支付方式', trigger: 'change' }
                ],
                quantity: [
                    { required: true, message: '请输入数量', trigger: 'blur' }
                ],
                supplierContact: [
                    { required: true, message: '请输入', trigger: 'blur' }
                ],
                supplierContactNumber: [
                    { required: true, message: '请输入联系人电话', trigger: 'blur' }
                ],
                supplierTypeId: [
                    { required: true, message: '请选择供应商类型', trigger: 'change' }
                ],
                supplierArea: [
                    { required: true, message: '请选择供应商地区', trigger: 'change' }
                ],
                supplierSocialAccount: [
                    { required: true, message: '请输入', trigger: 'blur' }
                ],
                supplierAddress: [
                    { required: true, message: '请输入', trigger: 'blur' }
                ],
                supplierEmail: [
                    { required: true, message: '请输入', trigger: 'blur' }
                ],
                otaOrderNo: [
                    { required: true, message: '请输入', trigger: 'blur' }
                ],

            },
            rateList: [],
            suppliertype:[],
            supplierRegion:[],
            eventspd:true,
            fullscreenLoading:false,
            queryArr : [],
            Switchwifi:false,
        }   
    },
    watch:{
        'DecreasePaymentsData.priceName'(newVal,oldVal){
            if(newVal.toLowerCase().includes('wifi')){
                // console.log(newVal.toLowerCase(),this.Switchwifi)
                this.Switchwifi=true;
            }else{
                this.Switchwifi=false;
            }
        },
    },
    methods: {
        //团组下拉框
        AirTicketResSelect() {
            var url = "/api/Groups/DecreasePaymentsSelect"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' + this.token
                },
                data: {
                    userId: that.userId,
                    CTId: 98
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.delegationInfoList = res.data.data.groupName;
                    that.DiIdSelect = parseInt(that.DiId)
                    for (let index = 0; index < that.delegationInfoList.length; index++) {
                        if (that.delegationInfoList[index].id == that.DiIdSelect) {
                            that.delegationInfo = that.delegationInfoList[index];
                            if(res.data.data.groupName[index].teamDid==302||res.data.data.groupName[index].teamDid==691||res.data.data.groupName[index].teamDid==762||res.data.data.groupName[index].teamDid==1047){
                                that.eventspd=true
                            }else{
                                that.eventspd=false
                            }
                            console.log(that.eventspd);
                            break;
                        }
                    }
                    that.payment = res.data.data.payment;
                    that.suppliertype = res.data.data.supplier;
                    that.supplierRegion = res.data.data.supplierArea;
                }
            })


        },
        QueryDecreasePaymentsById() {
            var url = "/api/Groups/QueryDecreasePaymentsById"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' + this.token
                },
                data: {
                    Id: that.id
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.Decrease = res.data.data
                    that.DecreasePaymentsData.payDId = that.Decrease.payDId
                    that.DecreasePaymentsData.orbitalPrivateTransfer = that.Decrease.orbitalPrivateTransfer
                    that.DecreasePaymentsData.supplierName = that.Decrease.supplierName
                    that.DecreasePaymentsData.id = that.Decrease.id
                    that.DecreasePaymentsData.supplierArea = that.Decrease.supplierArea
                    that.DecreasePaymentsData.supplierTypeId = that.Decrease.supplierTypeId
                    that.DecreasePaymentsData.supplierContact = that.Decrease.supplierContact
                    that.DecreasePaymentsData.supplierContactNumber = that.Decrease.supplierContactNumber
                    that.DecreasePaymentsData.quantity = that.Decrease.quantity
                    that.DecreasePaymentsData.feeTotal = that.Decrease.feeTotal
                    that.DecreasePaymentsData.diId = that.Decrease.diId
                    that.DecreasePaymentsData.priceName = that.Decrease.priceName
                    that.DecreasePaymentsData.price = that.Decrease.price
                    that.DecreasePaymentsData.currency = that.Decrease.currency
                    that.DecreasePaymentsData.filePath = that.Decrease.filePath
                    that.projectName = that.Decrease.filePath
                    that.DecreasePaymentsData.remark = that.Decrease.remark
                    that.DecreasePaymentsData.supplierSocialAccount = that.Decrease.supplierSocialAccount
                    that.DecreasePaymentsData.supplierAddress = that.Decrease.supplierAddress
                    that.DecreasePaymentsData.supplierEmail = that.Decrease.supplierEmail
                    that.DecreasePaymentsData.otherBankName = that.Decrease.otherBankName
                    that.DecreasePaymentsData.otherSideNo = that.Decrease.otherSideNo
                    that.DecreasePaymentsData.otherSideName = that.Decrease.otherSideName
                    that.DecreasePaymentsData.otaOrderNo = that.Decrease.otaOrderNo
                    that.IsAuditGM = that.Decrease.isAuditGM
                    if (that.Decrease.filePath != null && that.Decrease.filePath != undefined && that.Decrease.filePath != "") {
                        that.uploadFiles.push({
                            name: that.Decrease.filePath,
                            url: 'http://132.232.92.186:24/Office/GrpFile/团组增减款项相关文件/',
                        })
                    }
                }
            })
        },
        //点击保存事件
        addBtn:debounce(function() {
            console.log(this.IsAuditGM);
            this.DecreasePaymentsData.supplierTypeId=this.eventspd?this.DecreasePaymentsData.supplierTypeId:0;
            this.fullscreenLoading=true;
            if (this.IsAuditGM == 1) {
                this.fullscreenLoading=false;
                this.$message.error('已通过审核，不可修改！');
            } else {
                if (this.DiId == null && this.DiId == undefined && this.DiId == "") {
                    this.fullscreenLoading=false;
                    this.$message.error("请选择团组名称");
                    return;
                }
                const that = this;
                that.$refs.DecreasePaymentsData.validate((valid) => {
                    if (valid) {
                        if (that.DecreasePaymentsData.filePath == that.projectName) {
                            if (that.DelfileName != null && that.DelfileName != "" && that.DelfileName != undefined) {
                                that.$axios({
                                    method: 'post',
                                    url: "/api/Groups/DelFile",
                                    headers: {
                                        Authorization: 'Bearer ' + that.token
                                    },
                                    data: {
                                        fileName: that.DelfileName,
                                        id: that.id
                                    }
                                }).then(function (res) {
                                    if (res.data.code == 200) {

                                    }
                                })
                            }
                            that.DecreasePaymentsData.filePath = that.projectName
                            that.DecreasePaymentsData.diId = that.DiIdSelect;
                            that.DecreasePaymentsData.createUserId = that.userId;
                            that.DecreasePaymentsData.otaOrderNo=this.Switchwifi?that.DecreasePaymentsData.otaOrderNo:'';
                            var url = "/api/Groups/OpDecreasePayments"
                            that.$axios({
                                method: 'post',
                                url: url,
                                headers: {
                                    Authorization: 'Bearer ' + that.token
                                },
                                data: that.DecreasePaymentsData
                            }).then(function (res) {
                                if (res.data.code == 200) {
                                    that.$message({
                                        message: res.data.msg,
                                        type: 'success'
                                    });
                                    setTimeout(() => {
                                        that.fullscreenLoading=false;
                                        that.quxiao()
                                    }, 1000);
                                } else {
                                    that.fullscreenLoading=false;
                                    that.$message.error(res.data.msg);
                                }
                            })

                        } else {
                            if (that.DelfileName != null && that.DelfileName != "" && that.DelfileName != undefined) {
                                that.$axios({
                                    method: 'post',
                                    url: "/api/Groups/DelFile",
                                    headers: {
                                        Authorization: 'Bearer ' + that.token
                                    },
                                    data: {
                                        fileName: that.DelfileName,
                                        id: that.id
                                    }
                                }).then(function (res) {
                                    if (res.data.code == 200) {

                                    }
                                })
                            }
                            if (that.projectName != "" && that.projectName != null && that.projectName != undefined) {
                                that.$refs.upload.submit();//上传文件到服务器
                            } else {
                                that.DecreasePaymentsData.filePath = that.projectName
                                that.DecreasePaymentsData.diId = that.DiIdSelect;
                                that.DecreasePaymentsData.createUserId = that.userId;
                                that.DecreasePaymentsData.otaOrderNo=this.Switchwifi?that.DecreasePaymentsData.otaOrderNo:'';
                                var url = "/api/Groups/OpDecreasePayments"
                                that.$axios({
                                    method: 'post',
                                    url: url,
                                    headers: {
                                        Authorization: 'Bearer ' + that.token
                                    },
                                    data: that.DecreasePaymentsData
                                }).then(function (res) {
                                    if (res.data.code == 200) {
                                        that.$message({
                                            message: res.data.msg,
                                            type: 'success'
                                        });
                                        that.loading = true;
                                        setTimeout(() => {
                                             that.fullscreenLoading=false;
                                            that.$router.push('/home/DecreasePayments')
                                        }, 1000);
                                    } else {
                                        that.fullscreenLoading=false;
                                        that.$message.error(res.data.msg);
                                    }
                                })
                            }

                        }

                    } else {
                        this.fullscreenLoading=false;
                        this.$message.error('请完善信息在保存！');
                        return false;
                    }
                })

            }
            // 此时必填完成，做保存后的业务操作
        },1000,true),
        //取消
        quxiao(){
            this.$router.push({
                path: "/home/DecreasePayments",
                query: {
                    DiId: this.DiIdSelect,
                }
            })
        },
        //计算总价
        Sumup(){
            this.DecreasePaymentsData.feeTotal=new Decimal(this.DecreasePaymentsData.price*this.DecreasePaymentsData.quantity).toFixed(2);
        },
        DecreasePaymentsChange() {
            this.QueryRate();
            for (let index = 0; index < this.delegationInfoList.length; index++) {
                if (this.delegationInfoList[index].id == parseInt(this.DiIdSelect)) {
                    this.delegationInfo = this.delegationInfoList[index];
                    if(this.delegationInfo.teamDid==302||this.delegationInfo.teamDid==691||this.delegationInfo.teamDid==762||this.delegationInfo.teamDid==1047){
                        this.eventspd=true
                    }else{
                        this.eventspd=false
                    }
                    break;
                }
            }
        },
        //上传
        // 文件超出限制
        exceed(files, fileList) {
            this.$message.warning(
                `当前限制选择 1个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length
                } 个文件,请取消要替换的文件`
            );
        },
        //文件上传成功时的钩子
        upLoadSuccess(response, file, fileList) {
            if (response.code == 200) {
                var that = this;
                that.$axios({
                    method: 'post',
                    url: "/api/Groups/DelFile",
                    headers: {
                        Authorization: 'Bearer ' + that.token,
                        TypeName: "A"
                    },
                    data: {
                        fileName: that.DelfileName,
                        id: that.id
                    }
                }).then(function (res) {
                    if (res.data.code == 200) {

                    }
                })

                that.DecreasePaymentsData.filePath = response.data
                that.DecreasePaymentsData.diId = that.DiIdSelect;
                that.DecreasePaymentsData.createUserId = that.userId;
                that.DecreasePaymentsData.otaOrderNo=this.Switchwifi?that.DecreasePaymentsData.otaOrderNo:'';
                var url = "/api/Groups/OpDecreasePayments"
                that.$axios({
                    method: 'post',
                    url: url,
                    headers: {
                        Authorization: 'Bearer ' + that.token
                    },
                    data: that.DecreasePaymentsData
                }).then(function (res) {
                    if (res.data.code == 200) {
                        that.$message({
                            message: res.data.msg,
                            type: 'success'
                        });
                        that.loading = true;
                        setTimeout(() => {
                            that.$router.push('/home/DecreasePayments')
                        }, 3000);
                    } else {
                        that.$message.error(res.data.msg);
                    }
                })
            } else {
                that.$message.error(res.data.msg);
            }

        },
        //文件上传失败时的钩子
        upLoadError(response, file, fileList) {
            console.log("项目添加失败");
        },
        beforeRemove(file, fileList) {
            console.log(file.name)
            let id1 = this.uploadFiles.findIndex(item => {
                if (item.name == file.name) {
                    return true
                }
            })
            this.uploadFiles.splice(id1, 1)
            this.projectName = ""
            this.DelfileName = file.name
        },
        onChange(file, fileList) {
            this.projectName = file.name
        },
        QueryRate() {
            var url = "/api/Business/PostGroupTeamRateByDiIdAndCTableId"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' + that.token
                },
                data: {
                    "portType": 1,
                    "diId": this.DiIdSelect ? this.DiIdSelect : this.DiId,
                    "cTable": 98
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    //汇率
                    console.log("汇率--", res.data.data);
                    that.rateList = res.data.data.teamRates;
                }
            })


        },
        handleSelect(item){
            //console.log('handleSelect',item);
            var id = item.id;
            var that = this;

            try {
                this.queryArr.forEach((item)=>{
                    if(item.id==id){
                        that.DecreasePaymentsData.supplierAddress = item.supplierAddress;
                        that.DecreasePaymentsData.supplierArea = item.supplierArea;
                        that.DecreasePaymentsData.supplierContact = item.supplierContact;
                        that.DecreasePaymentsData.supplierContactNumber = item.supplierContactNumber;
                        that.DecreasePaymentsData.supplierEmail = item.supplierEmail;
                        that.DecreasePaymentsData.supplierName = item.supplierName;
                        that.DecreasePaymentsData.supplierSocialAccount = item.supplierSocialAccount;
                        that.DecreasePaymentsData.supplierTypeId = item.supplierTypeId;
                        throw new Error('stop');
                    }
                })
            } catch (error) {
                if(error.message == 'stop'){
                    return;
                }else{
                    console.error(error.message);
                }
            }

        },
        querySearchAsync(queryString, cb) {
            var url = "/api/Groups/QueryAssociateSupplier"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' + that.token
                },
                data: {
                    "param": queryString
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    cb(res.data.data.map(x=>{return{
                        value: x.supplierName,
                        id: x.id
                    }}));
                    that.queryArr = res.data.data;
                }
            })
        }

    },

    mounted() {

        this.DiId = JSON.parse(this.$route.query.DiId);
        this.QueryRate();
        this.token = JSON.parse(localStorage.getItem('userinif')).token;
        this.userId = JSON.parse(localStorage.getItem('userinif')).userInfo.userId
        this.AirTicketResSelect();
        this.id = this.$route.query.id
        if (this.id != null && this.id != undefined && this.id != 0) {
            this.QueryDecreasePaymentsById();
            this.title = "修改其他款项";
            this.DecreasePaymentsData.status = 2
            this.isShow = true
        } else {
            this.DecreasePaymentsData.status = 1
            this.title = "新增其他款项"
            this.isShow = false
        }

    }
}
</script>
<style>
.communal-list {
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0 5px #0005;
    border-radius: 10px;

}

.car_add .communal-title {
    display: flex;
    font-size: 17px;
    font-weight: 600;
    color: #555;
    margin-bottom: 20px;
    justify-content: space-between;
    align-items: center;
}

.appraise-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 50px 0;
}

.appraise-box>div {
    width: 30%;
}

.communal-box {
    display: flex;
}

.communal-box>button {
    margin-left: 10px;
    padding: 8px 20px;
}

.car_add {
    background-color: #fff;
    padding: 20px;
    box-shadow: 0 0 5px #0005;
    border-radius: 10px;
    min-height: 810px;
}

@media screen and (max-width: 1700px) {
    .appraise-box>div {
        width: 48%;
    }

    .appraise-box>div el-form-item__content {
        width: 260px !important;
    }
}
</style>