<template>
    <div>
       <el-row :gutter="20">
            <el-col :span="24">
                <el-card shadow="hover" class="mgb20">
                    <div class="flex-between">
                        <div class="per_title" v-preventReClick @click="goback()">
                            <i class="el-icon-arrow-left"></i>
                            <span class="per_back">返回</span>
                            <span class="per_school">订单处理</span>
                        </div>
                        <el-button type="primary" size="small" round class="mag" v-preventReClick @click="saveOrder('form')">确定</el-button>
                    </div>              
                </el-card>

                <el-card shadow="hover" class="mgb20">
                    <div>
                        <div class="flex-center mgb20 user_header">
                            <p class="addhr_tag"></p>
                            <span>基本信息</span>
                        </div>

                        <div>
                            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
                                <el-col :span="6" :offset="5">
                                    <el-form-item label="订单编号">
                                        <el-input v-model="form.orderNumber" disabled placeholder="自动生成"></el-input>
                                    </el-form-item>
                                    <el-form-item label="订单时间">
                                        <el-date-picker
                                            v-model="form.orderNumber"
                                            type="date"
                                            placeholder="选择日期">
                                        </el-date-picker>
                                    </el-form-item>
                                    
                                    <el-form-item prop="provinceId" label="省份">
                                        <el-select v-model="form.provinceId" clearable placeholder="请选择省份" @change="getCity" @clear="clearprovince()">
                                            <el-option v-for="(item,index) in provinceList" :key="index" :label="item.provinceName" :value="item.provinceId"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item label="联系人" prop="orderContact">
                                        <el-input v-model="form.orderContact" disabled placeholder="请输入联系人姓名"></el-input>
                                    </el-form-item>

                                    

                                    

                                    <el-form-item label="邮箱">
                                        <el-input v-model="form.email" disabled placeholder="请输入邮箱地址"></el-input>
                                    </el-form-item>
                                </el-col>


                                <el-col :span="6" :offset="2">
                                    <el-form-item prop="customerId" label="订单客户">
                                        <el-select v-model="form.customerId" clearable placeholder="请选择客户"
                                         :disabled="form.cityId ? false : true" @change="getcustomer" @clear="clearcustomer()">
                                            <el-option v-for="(item,index) in schoolList" :key="index" :label="item.customerName" :value="item.customerId"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    <el-form-item prop="orderType" label="订单类型">
                                        <el-select v-model="form.orderType" clearable placeholder="请选择订单类型">
                                            <el-option v-for="(item,index) in orderTypeList" :key="index" :label="item.name" :value="item.value"></el-option>
                                        </el-select>
                                    </el-form-item>
                                    

                                    <el-form-item prop="cityId" label="城市">
                                        <el-select v-model="form.orderType" placeholder="请选择">
                                            <el-option
                                            v-for="(item,index) in form.city"
                                            :key="index"
                                            :label="item"
                                            :value="item">
                                            </el-option>
                                        </el-select>
                                    </el-form-item>

                                    

                                    <el-form-item label="电话">
                                        <el-input v-model="form.phone" disabled placeholder="请输入电话号码" maxlength="11"></el-input>
                                    </el-form-item>

                                    <el-form-item label="订单金额" prop="orderAmount">
                                        <el-input v-model="form.orderAmount" disabled placeholder="请输入订单金额"></el-input>
                                    </el-form-item>                   
                                </el-col>
                            </el-form>
                        </div>
                    </div>
                </el-card>

                <el-card shadow="hover" class="mgb20">
                    <div>
                        <div class="flex-between mgb20 user_header">
                            <div class="flex-center">
                                <p class="addhr_tag"></p>
                                <span>课程权限</span>
                            </div>
                            <el-button type="primary" size="small" round class="mag" @click="getConfig()">添加</el-button>
                        </div>

                        <el-table :data="jurisdictionData" class="orderTable" stripe header-align="center" show-summary :summary-method="getSummaries">
                            <el-table-column type="index" width="100" label="序号" align="center">
                            </el-table-column>
                            <el-table-column prop="courseName" label="课程名称" align="center">
                            </el-table-column>
                            <el-table-column label="使用期限" align="center" width="200">
                                <template slot-scope="scope">
                                    <div class="course-input">
                                        <el-input @change="deadLine($event,scope.row)" maxlength="10" oninput="value=value.replace(/[^0-9.]/g,'')" v-model="scope.row.date" placeholder="输入时间"></el-input>
                                        <span>月</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="起止日期" align="center" width="200">
                                <template slot-scope="scope">
                                    <p v-if="!scope.row.startDate">请输入使用期限，且确认发货</p>
                                    <div v-else style="display:flex;justify-content:center;">
                                        <p>{{scope.row.startDate}}</p><span>&nbsp;&nbsp;-&nbsp;&nbsp;</span><p>{{scope.row.endDate}}</p>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="剩余期限" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                        <span>天</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="市场价" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                        <span>万</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="成交价 " align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                        <span>万</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="折扣率 " align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="端口地址 " align="center">
                                <template slot-scope="scope">
                                    <el-button @click="configure(scope.row)">配置</el-button>
                                </template>
                            </el-table-column>
                            <el-table-column label="发货" align="center">
                                <template slot-scope="scope">
                                    <el-switch
                                        v-model="scope.row.consignment"
                                        :active-value="1"
                                        :inactive-value="0"
                                        @change="courseSwitch($event,scope.row)">
                                    </el-switch>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                </el-card>

                <el-card shadow="hover" class="mgb20">
                    <div>
                        <div class="flex-between mgb20 user_header">
                            <div class="flex-center">
                                <p class="addhr_tag"></p>
                                <span>数据平台权限</span>
                            </div>
                            <el-button type="primary" size="small" round class="mag" @click="getConfig()">添加</el-button>
                        </div>

                        <el-table :data="dataPlatform" class="orderTable" stripe header-align="center" show-summary :summary-method="getSummaries">
                            <el-table-column type="index" width="100" label="序号" align="center">
                            </el-table-column>
                            <el-table-column prop="name" label="产品名称" align="center">
                            </el-table-column>
                            <el-table-column label="使用期限" align="center" width="200">
                                <template slot-scope="scope">
                                    <div class="course-input">
                                        <el-input  maxlength="10" oninput="value=value.replace(/[^0-9.]/g,'')" v-model="scope.row.date" placeholder="输入时间"></el-input>
                                        <span>月</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="起止日期" align="center" width="200">
                                <template slot-scope="scope">
                                    <p v-if="!scope.row.startDate">请输入使用期限，且确认状态</p>
                                    <div v-else style="display:flex;justify-content:center;">
                                        <p>{{scope.row.startDate}}</p><span>&nbsp;&nbsp;-&nbsp;&nbsp;</span><p>{{scope.row.endDate}}</p>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="剩余期限" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                        <span>天</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="市场价" align="center" width="165">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input disabled v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                        <span>元&nbsp;/&nbsp;账号</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="成交价" align="center" width="165">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input @change="dealComputers($event,scope.row)" v-model="scope.row.bargain" placeholder="请输入"type="text"></el-input>
                                        <span>元&nbsp;/&nbsp; 账号</span>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="折扣率" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input disabled v-model="scope.row.transactionPrice" placeholder="请输入"type="text"></el-input>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="账号数" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input @change="dealComputers($event,scope.row)" v-model="scope.row.account" placeholder="请输入"type="text"></el-input>
                                    </div>
                                </template>
                            </el-table-column>
                            <!-- 金额自动计算，计算方式：账号数*成交价，且可以手动修改，保留两位小数 -->
                            <el-table-column label="总金额(万)" align="center">
                                <template slot-scope="scope">
                                    <div class="small">
                                        <el-input oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')"  v-model="scope.row.gross" placeholder="请输入"type="text"></el-input>
                                    </div>
                                </template>
                            </el-table-column>
                            <el-table-column label="端口地址 " align="center">
                                <template slot-scope="scope">
                                    <el-button @click="configure(scope.row)">配置</el-button>
                                </template>
                            </el-table-column>
                          
                            <el-table-column label="状态" align="center">
                                <template slot-scope="scope">
                                    <el-switch
                                        v-model="scope.row.platformState"
                                        :active-value="1"
                                        :inactive-value="0"
                                        @change="platformSwitch($event,scope.row)">
                                    </el-switch>
                                </template>
                            </el-table-column>
                            
                        </el-table>
                    </div>
                </el-card>

                <el-card shadow="hover" class="mgb20">
                    <div>
                        <div class="flex-center mgb20 user_header">
                            <p class="addhr_tag"></p>
                            <span>合同信息</span>
                        </div>

                        <div>
                            <el-form ref="contractInformation" :model="contractInformation" :rules="rules" label-width="80px" class="flex-start">
                                <el-col :span="6" :offset="5">
                                    <el-form-item label="合同名称">
                                        <el-input v-model="contractInformation.contractInformationName" placeholder="请输入合同名称"></el-input>
                                    </el-form-item>

                                    <el-form-item label="合同金额" prop="contractInformationSum">
                                        <el-input v-model="contractInformation.contractInformationSum"
                                        placeholder="请输入合同金额"></el-input>
                                    </el-form-item>
                                </el-col>


                                <el-col :span="6" :offset="2">
                                    <el-form-item label="合同编号">
                                        <el-input v-model="contractInformation.contractInformationNumber" placeholder="请输入合同编号"></el-input>
                                    </el-form-item>

                                    <el-form-item label="上传合同">
                                        <el-upload
                                            class="contract"
                                            :headers="{token}"
                                            :on-remove="handleRemove"
                                            :on-error="uploadError"
                                            :on-success="uploadSuccess"
                                            :before-remove="beforeRemove"
                                            :limit="1"
                                            :on-exceed="handleExceed"
                                            :action="api.uploadFiles"
                                            :file-list="uploadList"
                                        > 
                                            <el-button size="medium" type="plain" class="uploadTitle">上传</el-button>
                                        </el-upload>
                                        
                                    </el-form-item>                   
                                </el-col>

                                <el-col :span="2" class="downcol">
                                    <el-form-item>
                                        <el-button size="medium" type="plain" class="down" @click="downLoad()">下载</el-button>
                                    </el-form-item>                  
                                </el-col>
                            </el-form>
                        </div>
                    </div>
                </el-card>
            </el-col>
        </el-row>

        <!-- 添加应用 -->
        <el-dialog :visible.sync="curVisible" width="50%" center>
            <div class="flex-between mgb20">
                <div class="flex-center">
                    <p class="addhr_tag"></p>
                    <span>课程列表</span>
                </div>
                <div>
                    <el-input placeholder="请输入课程名称" prefix-icon="el-icon-search" v-model="configSearch" @keyup.enter.native="onSearch" clearable></el-input>
                </div>
            </div>
            <el-table :data="permissionData" stripe header-align="center" @selection-change="handleSelectionChange" :row-key="getRowKeys">
                <el-table-column type="selection" width="55" align="center"></el-table-column>
                <el-table-column type="index" width="100" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="courseName" label="课程名称" align="center">
                </el-table-column>
                <el-table-column prop="courseType" label="课程类型" align="center">
                </el-table-column>
                <el-table-column label="配置的实训应用" align="center">
                    <template slot-scope="scope">
                        <span class="ellipsis">{{scope.row.systemName}}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="courseHours" label="预计课时" align="center">
                </el-table-column>
            </el-table>
            <div class="pagination">
                <el-pagination background layout="total, prev, pager, next" :total="totals" @current-change="handleCurrentChange" :current-page="pageNo">
                </el-pagination>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="curVisible = false">取 消</el-button>
                <el-button type="primary" v-preventReClick @click="addSystem()">确 定</el-button>
            </span>
        </el-dialog>

        <!-- 选择IP -->
        <el-dialog :visible.sync="ipVisible" width="70%" center>
            <div class="flex-center mgb20">
                <p class="hr_tag"></p>
                <span>客户列表</span>
            </div>
            <el-table :data="IPData" stripe header-align="center">
                <el-table-column type="index" width="100" label="序号" align="center">
                </el-table-column>
                <el-table-column prop="age" label="服务器名称" align="center">
                </el-table-column>
                <el-table-column label="IP" align="center">
                    <template slot-scope="scope">
                        <div class="tab_temp">
                            <div class="flex-center">
                                <label>内网:</label>
                                <el-input v-model="scope.row.Intranet" placeholder="请输入IP地址"></el-input>
                            </div>
                            <div class="flex-center mar10">
                                <label>外网:</label>
                                <el-input v-model="scope.row.extranet" placeholder="请输入端口号"></el-input>
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="端口" align="center">
                    <template slot-scope="scope">
                        <div class="tab_temp">
                            <div class="flex-center">
                                <label>内网:</label>
                                <el-input v-model="scope.row.Intranet" placeholder="请输入内网IP地址"></el-input>
                            </div>
                            <div class="flex-center mar10">
                                <label>外网:</label>
                                <el-input v-model="scope.row.extranet" placeholder="请输入外网IP地址"></el-input>
                            </div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="选择" align="center">
                    <template slot-scope="scope">
                        <i class="el-icon-success radio_icon"></i>
                    </template>
                </el-table-column>
            </el-table>
            <span slot="footer" class="dialog-footer">
                <el-button @click="ipVisible = false">取 消</el-button>
                <el-button type="primary" @click="IPSure()">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        return {
            token: this.$store.state.loginToken,
            form: {
                orderNumber: '',
                orderDate: '',
                provinceId: '',
                orderContact: '',
                email: '',
                customerId: '',
                orderType: '',
                cityId: '',
                phone: '',
                orderAmount: '',
                orderId: this.$store.state.orderId,
            },
            contractInformation: {
                contractInformationName: '',
                contractInformationNumber: '',
                contractInformationSum: '',
                contractInformationLink: '',
                contractInformationId: '',
                orderId: ''
            },
            uploadList: [],
            rules: {
                orderNumber: [
                    { required: true, message: '请输入订单编号', trigger: 'blur' }
                ],
                orderAmount: [
                    { required: true, message: '请输入课程成交价计算订单金额', trigger: 'blur' }
                ],
                provinceId: [
                    { required: true, message: '请选择省份', trigger: 'change' }
                ],
                cityId: [
                    { required: true, message: '请选择城市', trigger: 'change' }
                ],
                customerId: [
                    { required: true, message: '请选择客户名称', trigger: 'change' }
                ],
                orderType: [
                    { required: true, message: '请选择订单类型', trigger: 'change' }
                ],
                // phone: [
                //     { required: true, message: '请选择客户获取手机号', trigger: 'blur' },
                //     {
                //         pattern: /^1[3456789]\d{9}$/,
                //         message: '请输入正确的手机号',
                //         trigger: 'blur'
                //     }
                // ],
                // contractInformationName: [
                //     { required: true, message: '请输入合同名称', trigger: 'blur' }
                // ],
                contractInformationSum: [
                    // { required: true, message: '请输入合同金额', trigger: 'blur' },
                    { pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' }
                ],
                transactionPrice: [
                    { required: true, message: '请输入成交价', trigger: 'blur' },
                    { pattern: /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/, message: '请输入正确金额格式,可保留两位小数' }
                ],
            },
            orderTypeList: [{
                name: '正式',
                value: 1
            },
            {
                name: '试用',
                value: 2
            }],
            provinceList: this.$store.state.provinceList,
            cityList: [],
            schoolList: [],
            jurisdictionData: [
                {   name:'1',
                    date:'',
                    startDate:'',
                    endDate:'',
                    consignment:false,
                    
                }
            ],// 课程权限

            dataPlatform:[
                {
                    name:'1',
                    date:'',
                    startDate:'',
                    endDate:'',
                    platformState:'',
                    bargain:'',
                    account:'',
                    gross:''

                }
            ],// 数据平台data
            permissionData: [],
            curVisible: false,
            configSearch: '',
            yearList: [{
                name: '1个月',
                value: 30
            },{
                name: '2个月',
                value: 60
            },{
                name: '3个月',
                value: 90
            },{
                name: '1年',
                value: 365
            },
            {
                name: '2年',
                value: 730
            },
            {
                name: '3年',
                value: 1095
            }],
            pageNo: 1,
            pageSize: 10,
            totals: 1,
            ipVisible: false,
            IPData: [{
                id: 1,
                age: '小额贷系统',
                storeName: '1个月',
                total: '2019.01.02 11:00',
                payamount: '2019.01.02 11:00',
                payamount: '700d12h1min',
                swtich: true,
                Intranet: '10.20.202.1',
                extranet: '10.20.202.1'
            },
            {
                id: 2,
                age: '小额贷系统',
                storeName: '1个月',
                total: '2019.01.02 11:00',
                payamount: '2019.01.02 11:00',
                payamount: '700d12h1min',
                swtich: true,
                Intranet: '',
                extranet: ''
            }],
            curArr: '',
            test: []
        };
    },
    
    mounted() {
        if(this.form.orderId){
            let data = {
                orderId: this.form.orderId
            }
            this.$get(this.api.queryOrderDetails,data).then((res) => {
                    this.form = {
                        orderNumber: res.message[0].orders[0].orderNumber,
                        orderDate: res.message[0].orders[0].orderDate,
                        provinceId: res.message[0].orders[0].provinceId,
                        orderContact: res.message[0].orders[0].orderContact,
                        email: res.message[0].orders[0].email,
                        customerId: res.message[0].orders[0].customerId,
                        orderType: res.message[0].orders[0].orderType,
                        cityId: res.message[0].orders[0].cityId,
                        phone: res.message[0].orders[0].phone,
                        orderAmount: res.message[0].orders[0].orderAmount,
                        orderId: res.message[0].orders[0].orderId,
                    }
                    this.jurisdictionData = res.message[0].coursePermissionss
                    let arr1 = this.jurisdictionData
                    let result1 = arr1.map(e => e.courseId).join()
                    this.curArr = this.curArr.concat(result1)
                    if(res.message[0].contractInformations[0].contractInformationLink){
                        var iconImg = [];
                        iconImg.push({'name':'合同文件','url': res.message[0].contractInformations[0].contractInformationLink});
                        this.uploadList = iconImg
                    }
                    this.contractInformation = {
                        contractInformationName: res.message[0].contractInformations[0].contractInformationName,
                        contractInformationNumber: res.message[0].contractInformations[0].contractInformationNumber,
                        contractInformationSum: res.message[0].contractInformations[0].contractInformationSum,
                        contractInformationLink: res.message[0].contractInformations[0].contractInformationLink,
                        contractInformationId: res.message[0].contractInformations[0].contractInformationId,
                        orderId: res.message[0].contractInformations[0].orderId
                    }
                    this.getCityData()
                    this.getSchoolData()
                }).catch((res) => {
            })
        }
    },
    methods: {
        testfn(event){
            console.log(event,'ev');
        },
        // 清除省份
        clearprovince(){
            this.form.cityId = '',
            this.form.customerId = '',
            this.form.orderContact = ''
            this.form.phone = ''
            this.form.email = ''
        },
        // 获取城市
        getCity(){
           this.clearprovince()
           this.getCityData() 
        },
        getCityData(){
            let data = {
                provinceId: this.form.provinceId
            }
            this.$get(this.api.queryCity,data).then(res => {
                this.cityList = res.message
            }).catch(res => {});
        },
        // 清除城市
        clearcity(){
            this.form.customerId = '',
            this.form.orderContact = ''
            this.form.phone = ''
            this.form.email = ''
        },
        // 获取学校/客户名称
        getSchool(){
            this.clearcity()
            this.getSchoolData()
        },
        getSchoolData(){
            let data = {
                provinceId: this.form.provinceId,
                cityId: this.form.cityId
            }
            this.$get(this.api.queryOrderCustomer,data).then(res => {
                this.schoolList = res.message
            }).catch(res => {});
        },
        clearcustomer(){
            this.form.orderContact = ''
            this.form.phone = ''
            this.form.email = ''
        },
        // 获取学校/客户信息
        getcustomer(){
            let data = {
                customerId: this.form.customerId
            }
            this.$get(this.api.queryOrderCustomerContact,data).then(res => {
                this.form.orderContact = res.message[0].adminName
                this.form.phone = res.message[0].adminPhone
                this.form.email = res.message[0].email
            }).catch(res => {});
        },
        async saveOrder() {
        try {
            await Promise.all([
            this.$refs.form.validate(),
            this.$refs.contractInformation.validate()
            ]);
            if(this.jurisdictionData.length == 0){
                        this.$message.error('请添加课程配置！');
                    }else{
                        function findCherries(fruit) {
                            return fruit.transactionPrice === '';
                        }
                        if(this.jurisdictionData.find(findCherries)){
                            this.$message.error('请先填写成交价！');
                        }else{
                            let data = {
                                order: this.form,
                                coursePermissionss: this.jurisdictionData,
                                contractInformation: this.contractInformation
                            }
                            if(this.form.orderId){
                                this.$post(this.api.updateOrder,data).then((res) => {
                                    this.$message.success('编辑成功');
                                    this.goback()
                                }).catch((res) => {})
                            } else {
                                this.$post(this.api.addOrder,data).then((res) => {
                                    this.$message.success('添加成功');
                                    this.goback()
                                }).catch((res) => {})
                            }
                        }
                    }
        } catch (error) {
            return;
        }
        },
        // 获取应用配置
        getConfig(rows){
            this.multipleSelection = []
            let data = {
                courseId: this.curArr,
                searchContent: this.configSearch,
                pageNo: this.pageNo,
                pageSize: this.pageSize,
            }
            this.$get(this.api.queryCourseList,data).then(res => {
                res.message.rows.forEach(e => {
                    e.courseType = this.courseTypeStatus(e.courseType)
                    e.courseHours = this.hoursStatus(e.courseHours)
                })
                this.permissionData = res.message.rows
                this.totals = res.message.total
                this.curVisible = true
            }).catch(res => {});
        },
        onSearch(){
            this.getConfig()
        },
        getRowKeys(row) {
            return row.courseId;
        },
        // 多选操作
        handleSelectionChange(val) {
            this.multipleSelection = val;
        },
        // 绑定实训配置
        addSystem() {
            this.curVisible = false     
            let arr = this.multipleSelection
            let result = arr.map(e => e.courseId).join()
            this.curArr = this.curArr.concat(`,${result}`)
            if (this.curArr.substr(0,1)==','){
                this.curArr = this.curArr.substr(1);
            }
            let data = {
                courseId: result,
            }
            this.getPermissions(data)
        },
        handleCurrentChange(val) {
            this.pageNo = val;
            this.getConfig();
        },
        // 查询应用权限
        getPermissions(val){
            this.$get(this.api.queryCoursePermissions,val).then(res => {
                this.curVisible = false
                var arritem = {
                    usePeriod: 30,
                    transactionPrice: '',
                    discount: '',
                    isDeliverGoods: 0,
                    portAddressId: 1,
                    orderId: this.form.orderId
                }
                let arryNew = []
                res.message.map(item => {
                    arryNew.push(Object.assign({}, item, arritem))
                })
                this.jurisdictionData = this.jurisdictionData.concat(arryNew)
            }).catch(res => {});
        },
        deljur(index,row){
            this.$confirm('确定要删除该课程吗？', '提示', {
                type: 'warning'
            })
            .then(() => {
                let newArr = this.curArr.split(",")
                this.removeByValue(newArr, row.courseId);
                var newStr = newArr.toString();
                this.curArr = newStr
                this.jurisdictionData.splice(index,1);
                this.$message.success('删除成功');
            })
            .catch(() => {});
        },
        discountChange(row){
            let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/
            if(!(reg.test(row.transactionPrice))){
                this.$message.error('请输入正确金额格式,可保留两位小数！');
                row.transactionPrice = ''
            }else{
                row.discount = this.Percentage(row.transactionPrice,row.marketPrice)
            }
        },
        getSummaries(param) {
            const { columns, data } = param;
            var sums = 0;
            data.map(e => {
                sums+=Number(e.transactionPrice)
            })
            this.form.orderAmount = sums
            return sums;
        },
       
        // 上传文件
        handleExceed(files, fileList) {
            this.$message.warning(
                `当前限制选择 1 个文件，如需更换，请删除上一个文件再重新选择！` 
            );
        },
        uploadSuccess(response, file, fileList) {
            this.uploadList.push({ name: file.name, url: response.message.fileUrl });
            this.contractInformation.contractInformationLink = response.message.fileUrl
        },
        uploadError(err, file, fileList) {
            this.$message({
                message: "上传出错，请重试！",
                type: "error",
                center: true
            });
        },
        beforeRemove(file, fileList) {
            return this.$confirm(`确定移除 ${file.name}？`);
        },
        handleRemove(file, fileList) {
            this.contractInformation.contractInformationLink = ''
        },
        downLoad(){
            let downFile = this.contractInformation.contractInformationLink.replace("http://liuwanr.oss-cn-shenzhen.aliyuncs.com/","")
            window.open(`${this.api.downloadFiles}?objectName=${downFile}`)
        },
        configure(){
            this.ipVisible = true
        },
        IPSure(){
            this.ipVisible = false
        },
        goback(){
            this.$router.go(-1)
        },
      
        // 课程部分的switch切换
        courseSwitch(e,row){
            this.deadLine(row.date,row)
        },
        // 平台权限switch切换
        platformSwitch (e,row) {
            this.deadLine(row.date,row)
        },
        // 使用期限转换
        deadLine(e,row){
            console.log(row.consignment,e,'row.consignment');
            if(e===''||!row.consignment) {
                console.log('進入return');
                row.startDate = ''
                row.endDate = ''
                return
            }
            function completeDate(value) {
                return value < 10 ? "0"+value:value;
            }
            let char = "-";
            let nowDate = new Date()
            let day = nowDate.getDate();
            let month = nowDate.getMonth() + 1;
            let year = nowDate.getFullYear();
            //补全0，并拼接当前的时间点
            let nowYear = year + char + completeDate(month) + char +completeDate(day);
            // 判断结束日期
            let endYear = +year+parseInt(e/12) + char + completeDate(month+e%12) + char +completeDate(day);
            // 待接口改
            row.startDate = nowYear
            row.endDate = endYear
            this.$forceUpdate();
            console.log(endYear,nowYear);

        },
        // 计算成交总额
        dealComputers(e,row){
            if(row.bargain&&row.account){
                row.gross = row.bargain*row.account;
                this.$forceUpdate();
                console.log(row.gross,'row.gross');
            }
        }
    }
};
</script>

<style lang="scss" scoped>
/deep/.course-input .el-input__inner {
    width: 120px;
}
/deep/ .small .el-input__inner{
    width: 70px;
} 
.mag{
    margin-right: 20px;
}
.uploadTitle{
  width: 100%;
  height: 40px;
  font-size: 16px;
}
.application_input{
    width: 250px;
}
.contract .el-upload{
    width: 100%!important;
}
.downcol .el-form-item__content{
    margin-left: 0!important;
}
.down{
    margin-top: 60px;
    height: 40px;
}
/* 选择IP */
.tab_temp label{
    width: 60px;
}
.mar10{
    margin-top: 10px;
}
.radio_icon{
    font-size: 26px;
    color: #9278FF;
}
.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
</style>
