<template>
  <div class="flex-container">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <!-- 搜索区域 -->
      <a-form layout="inline">
        <a-row :gutter="24">

          <a-col :md="3" :sm="6">
            <a-form-item label="县分">
              <a-select v-model="queryParam.productRegion">
                <a-select-option key="">--全部--</a-select-option>
                <a-select-option v-for="d in subNames" :key="d.value" :value="d.value">{{d.text}}</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <a-col :md="5" :sm="10">
            <a-form-item label="学校">
              <a-input v-model="queryParam.productUniversity"></a-input>
            </a-form-item>
          </a-col>
          <span class="table-page-search-submitButtons" style="float: left; overflow: hidden;">
                        <a-col :md="6" :sm="24">
                             <a-button @click="search()" type="primary">查询</a-button>
                             <a-divider type="vertical"/>
                            <a-button @click="modifyfunction()" type="primary">添加</a-button>
                        </a-col>
                    </span>
        </a-row>
      </a-form>
    </div>

    <!--列表-->
    <s-table :columns="columns" :data="rowdata" bordered ref="table" size="small" class="flex-filling"  :locale="emptyText">
      <!--拦截器-->
      <template slot="productLastUpdateTime" slot-scope="text">
        {{ text | dayjs}}
      </template>
      <!--拦截器-->
      <template slot="productCreateTime" slot-scope="text">
        {{ text | dayjs}}
      </template>
      <template slot="productState" slot-scope="text">
        <p v-if="text=='0'">正常</p>
        <p v-else=""></p>
      </template>
      <template slot="operation" slot-scope="text, record">
                <span>
                  <a @click="modifyfunction(record)">修改</a>
                  <a-divider type="vertical"/>
                  <a-popconfirm title="是否要删除此行？" @confirm="remove(record.universityId)">
                    <a>删除</a>
                  </a-popconfirm>
                </span>
      </template>
    </s-table>
    <!----弹框-->
    <a-modal :title="add ?'添加大学宽带信息': '编辑大学宽带信息'" :visible="modifyvisible"  @ok="createfunctionOk" @cancel="createfunctionCancel" html-type="submit" width="80%">
      <a-form :form="Formtable">
        <a-collapse v-model="activeKey">
          <a-collapse-panel key="1" header="学校产品配置">
              <div class="school-box" v-for="(school, index) in modelData.schools">
                <a-input type="hidden" :id="'school_id['+ index + ']'" :name="'school_id['+ index + ']'" v-model="school.id"></a-input>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="县分：">
                  <a-select v-model="school.subName">
                    <a-select-option  value="">请选择</a-select-option>
                    <a-select-option  v-for="sn in subNames" :value="sn.value">{{sn.value}}</a-select-option>
                  </a-select>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="学校名称：">
                  <a-input :id="'school_name['+ index + ']'" :name="'school_name['+ index + ']'" v-model="school.schoolName"></a-input>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示宽带办理：">
                  <a-radio-group v-model="school.isShowband">
                    <a-radio value="0" disabled>不显示</a-radio>
                    <a-radio value="1" disabled>显示</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽带办理是否甩单：">
                  <a-radio-group v-model="school.jiltKd">
                    <a-radio value="0">甩单</a-radio>
                    <a-radio value="1">不甩单</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示单宽办理：">
                  <a-radio-group v-model="school.kdsl">
                    <a-radio value="0">不显示</a-radio>
                    <a-radio value="1">显示</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示融合办理：">
                  <a-radio-group v-model="school.isShowrh">
                    <a-radio value="0">不显示</a-radio>
                    <a-radio value="1">显示</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示宽叠移提速：">
                  <a-radio-group v-model="school.kdyBtn">
                    <a-radio value="0" disabled>不显示</a-radio>
                    <a-radio value="1" disabled>显示</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽叠移办理是否甩单：">
                  <a-radio-group v-model="school.jiltKdy">
                    <a-radio value="0">甩单</a-radio>
                    <a-radio value="1">不甩单</a-radio>
                  </a-radio-group>
                </a-form-item>

                <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" v-if="school.id == '' && index != 0">
                  <a-button @click="deleteSchool(index)" type="primary">删除该学校</a-button>
                </a-form-item>
              </div>
            <a-icon slot="extra" type="plus" @click="addSchool" />
          </a-collapse-panel>
          <a-collapse-panel key="2" header="客户端产品管理">
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽带标题：">
              <a-input placeholder="宽带标题"
                       v-decorator="[ 'productTitle', {rules: [{ required: true, message: '宽带标题不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="单宽资费：">
              <a-input placeholder="单宽资费"
                       v-decorator="[ 'productPrice', {rules: [{required: true, message: '资费不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="单宽包年包月情况：">
              <a-input placeholder="单宽包年包月情况"
                       v-decorator="[ 'productRate', {rules: [{ required: true, message: '包年包月情况不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="单宽宽带速率：">
              <a-input placeholder="单宽宽带速率"
                       v-decorator="[ 'productMeal', {rules: [{ required: true, message: '宽带速率不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="单宽支付方式：">
              <a-radio-group v-decorator="[ 'productIntroductionPic3', {rules: [{ required: true, message: '请选择单宽支付方式！'}]} ]">
                <a-radio value="0">穗易付</a-radio>
                <a-radio value="1">现金支付</a-radio>
              </a-radio-group>
            </a-form-item>


            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="融合资费：">
              <a-input :rows="10" v-model="modelData.productRhPrice"/>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="融合包年包月情况：">
              <a-input :rows="10" v-model="modelData.productRhRate"/>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="融合提速速率：">
              <a-input placeholder="如：20M" v-decorator="[ 'expenses']"/>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="融合支付方式：">
              <a-radio-group v-decorator="[ 'productIntroductionPic4', {rules: [{ required: true, message: '请选择融合支付方式！'}]} ]">
                <a-radio value="0">穗易付</a-radio>
                <a-radio value="1">现金支付</a-radio>
              </a-radio-group>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="对用户显示名称：">
              <a-input placeholder="对用户显示名称" v-decorator="[ 'productSchoolAbbreviated', {rules: [{ required: true, message: '对用户显示名称不能为空！' ,validator: 'click'}]} ]"/>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="帐号验证规则：">
              <a-select v-model="regularName" style="width: 330px">
                <a-select-option @click="regularsName('')" value="">请选择</a-select-option>
                <a-select-option @click="regularsName(item)" v-for="item in regulars" :value="item.regularId">{{item.regularName}}</a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="状态">
              <a-select placeholder="状态" v-decorator="[ 'productState']">
                <a-select-option key="0">正常</a-select-option>
                <a-select-option key="1">下架</a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示融合时间">
              <a-select placeholder="是否显示融合时间" v-decorator="['showRhTime']">
                <a-select-option key="0">不显示</a-select-option>
                <a-select-option key="1">显示</a-select-option>
              </a-select>
            </a-form-item>
<!--            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="适用学校：">-->
<!--              <a-select v-model="universityName" style="width: 330px">-->
<!--                <a-select-option @click="universitySchoolName('请选择')" value="请选择">请选择</a-select-option>-->
<!--                <a-select-option @click="universitySchoolName(item)" v-for="item in universitySchool" :value="item.universityId">-->
<!--                  {{item.universityName}}-->
<!--                </a-select-option>-->
<!--              </a-select>-->
<!--              <a @click="visibleT = true">详情</a>-->
<!--            </a-form-item>-->
<!--            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="套餐情况：">-->
<!--              <a-input :rows="10" v-model="modelData.productMealPrice"/>-->
<!--            </a-form-item>-->
            <div>
              <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}" label="产品情况：">
                <mavon-editor @save="saveProductIntroduction" ref="editor_a" v-model="productIntroduction"></mavon-editor>
              </a-form-item>
              <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}" label="单宽资费介绍：">
                <mavon-editor @save="saveProductSetMealIntroduction" ref="editor_b" v-model="productSetMealIntroduction"></mavon-editor>
              </a-form-item>
              <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}" label="融合资费介绍：">
                <mavon-editor @save="saveProductRf2" ref="editor_c" v-model="productRf2"></mavon-editor>
              </a-form-item>
            </div>
          </a-collapse-panel>
          <a-collapse-panel key="3" header="智能平台参数管理">
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="区域：">
              <a-input placeholder="区域" v-decorator="[ 'universityRegion', {rules: [{ required: true, message: '区域不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="装机地址：">
              <a-input placeholder="装机地址" v-decorator="[ 'universityInstalledAddress', {rules: [{required: true, message: '装机地址不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="地址ID：">
              <a-input placeholder="如：441020000000000000000000" v-decorator="[ 'universityInstalledAddressId', {rules: [{ required: true, message: '地址ID不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="允许上网终端类型：">
              <a-select v-decorator="[ 'universityTerminalType', {rules: [{ required: true, message: '允许上网终端类型'}]} ]" @change="changeTerminalType">
                <a-select-option value="PC+手机">PC+手机</a-select-option>
                <a-select-option value="仅PC">仅PC</a-select-option>
                <a-select-option value="仅手机">仅手机</a-select-option>
              </a-select>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="所在学校：">
              <a-input placeholder="所在学校" v-decorator="[ 'universityName', {rules: [{ required: true, message: '所在学校不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="用户类别：">
              <a-input placeholder="用户类别" v-decorator="[ 'universityUserCategory', {rules: [{ required: true, message: '用户类别不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="用户类型：">
              <a-select v-decorator="['universityUserType', {rules: [{required:true, message: '用户类型不能为空！'}]}]" @change="changeUserType">
                <a-select-option value="翼起来用户">翼起来用户</a-select-option>
                <a-select-option value="校园天翼宽带用户">校园天翼宽带用户</a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="月租类型：">
              <a-input placeholder="如:包月80元" v-decorator="[ 'universityMonthlyRentType', {rules: [{ required: true, message: '月租类型不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="计费属性：">
              <a-input placeholder="如:普通" v-decorator="[ 'universityChargingAttribute', {rules: [{ required: true, message: '计费属性不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="最大在线数：">
              <a-select v-decorator="['universityOnlineNumber', {rules: [{required:true, message: '最大在线数不能为空'}]}]" @change="changeOnlineNumber">
                <a-select-option value="1">1</a-select-option>
                <a-select-option value="2">2</a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="一人一号多终端：">
              <a-radio-group v-decorator="[ 'universityOneManTerminal', {rules: [{ required: true, message: '请选择一人多号终端！'}]} ]">
                <a-radio value="否">否</a-radio>
                <a-radio value="是">是</a-radio>
              </a-radio-group>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否FTTH+HUB：">
              <a-radio-group v-decorator="[ 'universityIsFtthHub', {rules: [{ required: true, message: '请选择是否FTTH+HUB！'}]} ]">
                <a-radio value="否">否</a-radio>
                <a-radio value="是">是</a-radio>
              </a-radio-group>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="外线方式：">
              <a-input placeholder="如:(FTTB)光缆大楼" v-decorator="[ 'universityExteriorLines', {rules: [{ required: true, message: '外线方式不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="收费模式：">
              <a-input placeholder="如:首月按天收费" v-decorator="[ 'universityChargeMode', {rules: [{required: true, message: '收费模式不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽带后缀：">
              <a-input placeholder="如：@CHGDGCZY" v-decorator="[ 'universityDomainName', {rules: [{required: true, message: '宽带后缀不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>
            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="揽装工号：">
              <a-input placeholder="揽装工号" v-decorator="[ 'universityPackageNumber', {rules: [{ required: true, message: '揽装工号不能为空！' ,validator: 'click'}]} ]"></a-input>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="学校联系号码：">
              <a-input placeholder="联系号码" v-decorator="[ 'universityContactPhone' ]"></a-input>
            </a-form-item>

            <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="提速包：">
              <a-select v-decorator="[ 'identifying' ]" @change="changeIdentifying">
                <a-select-option value="">无</a-select-option>
                <a-select-option value="校园低消宽带提速包（19元）">校园低消宽带提速包（19元）</a-select-option>
                <a-select-option value="校园低消宽带提速包（29元）">校园低消宽带提速包（29元）</a-select-option>
                <a-select-option value="校园低消宽带提速包（39元）">校园低消宽带提速包（39元）</a-select-option>
                <a-select-option value="宽带免费提速至100M">宽带免费提速至100M</a-select-option>
                <a-select-option value="1元宽带融合提速">1元宽带融合提速</a-select-option>
              </a-select>
            </a-form-item>
            <a-input style="display:none" placeholder="如:20M" v-decorator="[ 'speed', {rules: [{ required: true, message: '短信速率不能为空！' ,validator: 'click'}]} ]"></a-input>
          </a-collapse-panel>
        </a-collapse>
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import STable from '@/components/table';
import {universityBroadbandConfigData, universityBroadbandConfigList,universityDelete,saveBroadBandConfig} from "@/api/school-center/productAPI"
import {cloneObject} from '@/utils/util';
import {getSchoolNames, initSubstName} from "../../../api/school-center/louZhang/louZhangManagerAPI";
import {mavonEditor} from "mavon-editor";
import "mavon-editor/dist/css/index.css";

export default {
  name: "university",
  components: {
    STable,mavonEditor
  },
  data(){
    return {
      universityId: true,
      universityName: '',
      regularName: '',
      universitySchool: [],
      regulars: [],
      emptyText: {emptyText: '暂无数据'},
      Formtable: this.$form.createForm(this),
      modifyvisible: false,
      add: true,
      productIntroduction: "",
      productSetMealIntroduction: '',
      productRf2:'',
      subNames: [],
      schoolNames: [],
      queryParam: {
        productUniversity :'', //学校
        productRegion  :'',  // 区域
      },
      activeKey : [1,2,3],
      modelData:{
        universityName:'',
        universityRegion:'',
        universityInstalledAddress:'',
        universityExteriorLines:'',
        universityPackageNumber:'',
        universityInstalledAddressId:'',
        universityUserType:'',
        universityContactPhone:'',
        universityMonthlyRentType:'',
        universityChargeMode:'',
        universityChargingAttribute:'',
        speed:'',
        publicNumber:'',
        universityId:'',
        universityTerminalType: '',
        universityUserCategory: '',
        universityOnlineNumber: '1',
        universityOneManTerminal: '',
        universityIsFtthHub: '',
        universityDomainName: '',
        identifying: '',
        productId: '',
        productMealPrice: '',
        productMeal: '',
        productTitle: '',
        productUniversity: '',
        productPrice: '',
        productRegion: '',
        productRate: '',
        productIntroduction:'',
        productSetMealIntroduction:'',
        productRf2:'',
        productIntroductionPic2: '',
        productRhPrice:'',
        productRhRate:'',
        productIntroductionPic3: '',
        productIntroductionPic4: '',
        showRhTime: '',
        productSchoolAbbreviated: '',
        expenses: '',
        schools: []
      },
      columns: [
        {dataIndex: 'product_region', width: 50, title: '县分 '},
        {dataIndex: 'product_university', width: 140, title: '智能平台下单学校名'},
        {dataIndex: 'product_school_abbreviated', width: 140, title: '对用户显示学校名'},
        {dataIndex: 'kdsl', width: 180, title: '是否显示宽带办理',customRender: function(text) {
            if (text == undefined) {
                return '\n';
            }
            return <span style="white-space: pre-line;">{text.replaceAll(',', '\n')}</span>;
            }
        },
        {dataIndex: 'kdy_btn', width: 180, title: '是否显示宽叠移提速',customRender: function(text) {
            if (text == undefined) {
                return '\n';
            }
            return <span style="white-space: pre-line;">{text.replaceAll(',', '\n')}</span>;
          }
        },
        {dataIndex: 'university_package_number', width: 60, title: '揽装工号'},
        {dataIndex: 'university_user_type', width: 100, title: '用户类型'},
        {
          dataIndex: 'operation',
          width: 100,
          title: '操作',
          scopedSlots: {customRender: 'operation'},
          fixed: "right"
        }]
      ,
      rowdata: parameter => {
        let obj = cloneObject(this.queryParam)
        obj.pageNo = parameter.pageNo;
        obj.pageSize = parameter.pageSize;
        //表示
        return universityBroadbandConfigList(obj).then(res => {
          let data = {}
          if (res.state !== 'success') {
            this.$message.error("查询失败！", 5);
            this.emptyText.emptyText = '查询失败！'
            data = {
              data: [],
              pageSize: parameter.pageSize,
              pageNo: 1,
              totalCount: 0
            }
          } else {
            data = {
              data: res.data.page.records,
              pageSize: parameter.pageSize,
              pageNo: parameter.pageNo,
              totalCount: res.data.page.total,
            }
            this.regulars = res.data.regulars;
          }
          return data
        })
      }
    }
  },
  watch: {
    modelData : {
      deep: true
    }
  },
  methods:{
    search() {
      this.$refs.table.refresh({search: true})
    },
    remove(id) {
      universityDelete(id).then((res) => {
        if(res.state=="success"){
          this.$notification.success({message: res.data, description: '', duration: 4})
        }
        this.$refs.table.refresh({search: true})
      })
    },
    // 添加学校
    addSchool(event) {
      let obj = {
        id: '',
        sub_name: '',
        school_name: '',
        is_showband: '',
        is_showrh: '',
        kdy_btn: '',
        kdsl : '',
        jilt_kd: '',
        jilt_kdy : '',
      };
      this.modelData.schools.push(obj);
      for (let i = 0; i < this.activeKey.length; ++i) {
        if (this.activeKey[i] == 1) {
          this.activeKey.splice(i, 1);
          this.activeKey.push(1);
        }
      }
      event.stopPropagation();
    },
    // 删除学校
    deleteSchool : function(index) {
      console.log(this.activeKey);
      this.modelData.schools.splice(index, 1);
      for (let i = 0; i < this.activeKey.length; ++i) {
        if (this.activeKey[i] == 1) {
          this.activeKey.splice(i, 1);
          this.activeKey.push(1);
        }
      }
      console.log(this.activeKey);

    },
    // 修改上网终端类型
    changeTerminalType(value) {
      this.modelData.universityTerminalType = value;
    },
    // 修改用户类型
    changeUserType(value) {
      this.modelData.universityUserType = value;
    },
    // 修改最大在线用户数
    changeOnlineNumber(value) {
      this.modelData.universityOnlineNumber = value;
    },
    // 修改标识
    changeIdentifying(value) {
      this.modelData.identifying = value;
    },
    saveProductIntroduction(markdown, html) {
      // 此时会自动将 markdown 和 html 传递到这个方法中
      console.log("markdown内容:" + markdown);
      //alert("html内容:" + html);
      this.productIntroduction = html;
    },
    saveProductSetMealIntroduction(markdown, html) {
      // 此时会自动将 markdown 和 html 传递到这个方法中
      console.log("markdown内容:" + markdown);
      this.productSetMealIntroduction = html
      //alert("html内容:" + html);
    },
    saveProductRf2(markdown, html) {
      // 此时会自动将 markdown 和 html 传递到这个方法中
      console.log("markdown内容:" + markdown);
      this.productRf2 = html
      //alert("html内容:" + html);
    },
    universitySchoolName(item) {
      if (item == '请选择') {
        this.modelData.universityId = ''
      } else {
        this.modelData.productUniversity = item.universityName
        this.modelData.universityId = item.universityId
        this.chouti = item
      }
    },
    HTMLEncode(text) {
             let temp = document.createElement("div");
              temp.innerHTML = text;
             let output = temp.innerText || temp.textContent;
             temp = null;
             return output;
           },
    regularsName(item) {
      if (item == '请选择') {
        this.modelData.productIntroductionPic2 = ''
      } else {
        this.modelData.productIntroductionPic2 = item.id
        this.name = item.name
        this.regular = item
      }
    },
    modifyfunction(data){
      this.activeKey = [1,2,3]
      if(data != undefined ){
        let that = this;
        // 查询添加数据
        universityBroadbandConfigData({universityId: data.university_id}).then(res => {
          if (res.state == 'error') {

          }
          const university = res.data.universityInfoData
          const product = res.data.productData
          const schools = res.data.schoolsData
          that.modelData.schools = (schools == undefined ? [] : schools);
          that.modelData.universityId= university.universityId
          that.productIntroduction =this.HTMLEncode(product.productIntroduction == null ? "" : product.productIntroduction.replace(/&lt/g, '<').replace(/&gt/g, '>'));
          that.productSetMealIntroduction = this.HTMLEncode(product.productSetMealIntroduction == null ? "" : product.productSetMealIntroduction.replace(/&lt/g, '<').replace(/&gt/g, '>'));
          that.productRf2 =this.HTMLEncode(product.productRf2 ==null ? "" : product.productRf2.replace(/&lt/g, '<').replace(/&gt/g, '>'));
          that.modelData.productMealPrice = product.productMealPrice
          that.modelData.productUniversity = product.productUniversity
          that.modelData.productRhPrice=product.productRhPrice
          that.modelData.productRhRate=product.productRhRate
          for (var i = 0; i < that.regulars.length; i++) {
            if (product.productIntroductionPic2 == that.regulars[i].regularId + '') {
              that.regularName = that.regulars[i].regularName
              that.modelData.productIntroductionPic2 = that.regulars[i].regularId
            }
          }
          that.modelData.productId = product.productId

          that.modelData.identifying = university.identifying
          that.modelData.universityTerminalType = university.universityTerminalType
          that.modelData.universityUserType = university.universityUserType
          that.modelData.universityOnlineNumber = university.universityOnlineNumber

          that.Formtable.setFieldsValue({
            "universityName":university.universityName,
            "universityRegion":university.universityRegion,
            "universityInstalledAddress": university.universityInstalledAddress,
            "universityExteriorLines": university.universityExteriorLines,
            "universityPackageNumber": university.universityPackageNumber,
            "universityInstalledAddressId": university.universityInstalledAddressId,
            "universityUserType": university.universityUserType,
            "universityContactPhone": university.universityContactPhone,
            "universityMonthlyRentType": university.universityMonthlyRentType,
            "universityChargeMode": university.universityChargeMode,
            "universityChargingAttribute": university.universityChargingAttribute,
            "speed": university.speed,
            "publicNumber": university.publicNumber,
            "universityTerminalType": university.universityTerminalType,
            "universityUserCategory": university.universityUserCategory,
            "universityOnlineNumber": university.universityOnlineNumber,
            "universityOneManTerminal": university.universityOneManTerminal,
            "universityIsFtthHub": university.universityIsFtthHub,
            "universityDomainName": university.universityDomainName,
            "identifying": university.identifying,

            "productMeal": product.productMeal,
            "productTitle": product.productTitle,
            "productPrice": product.productPrice,
            "productRate": product.productRate,
            "productState": product.productState,
            'productIntroductionPic3': product.productIntroductionPic3,
            'productIntroductionPic4': product.productIntroductionPic4,
            'showRhTime': product.showRhTime,
            'productSchoolAbbreviated': product.productSchoolAbbreviated,
            'expenses': university.expenses
          });
        });
        // that.productIntroduction=this.HTMLEncode(that.productIntroduction)
        // that.productSetMealIntroduction=this.HTMLEncode(that.productSetMealIntroduction);
        // that.productRf2=this.HTMLEncode(that.productRf2)
        this.add=false;
      }else{
        setTimeout(()=>{
          this.modelData.universityId = ''
          this.modelData.productId = ''
          this.modelData.schools = []
          this.modelData.identifying = ''
          this.modelData.universityTerminalType = 'PC+手机'
          this.modelData.universityUserType = ''
          this.modelData.universityOnlineNumber = ''
          this.modelData.productRhPrice = ''
          this.modelData.productRhRate = ''
          this.Formtable.setFieldsValue({
            "universityName": '',
            "universityRegion": '',
            "universityInstalledAddress": '',
            "universityExteriorLines": '(FTTB)光缆大楼',
            "universityPackageNumber": '',
            "universityInstalledAddressId": '',
            "universityUserType": '学生',
            "universityContactPhone": '',
            "universityMonthlyRentType": '',
            "universityChargeMode": '首月按天收费',
            "universityChargingAttribute": '普通',
            "speed": '',
            "publicNumber": '',
            "universityTerminalType": 'PC+手机',
            "universityUserCategory": '翼起来用户',
            "universityOnlineNumber": '1',
            "universityOneManTerminal": '',
            "universityIsFtthHub": '',
            "universityDomainName": '',
            "identifying": '',
            "productMeal": '',
            "productTitle": '',
            "productPrice": '',
            "productRate": '',
            "productState": '0',
            'productIntroductionPic3': '',
            'productIntroductionPic4': '',
            'showRhTime': '',
            'productSchoolAbbreviated': '',
            'expenses': ''
          })
        },0)
        this.universityName = ''
        this.regularName = "";
      }

      this.modifyvisible=true;
    },
    createfunctionOk(){
      let that = this;
      that.Formtable.validateFields(['universityName','universityRegion','universityInstalledAddress','universityExteriorLines','universityPackageNumber','universityInstalledAddressId','universityUserType',
        'universityContactPhone','universityMonthlyRentType','universityChargeMode','universityChargingAttribute','speed','publicNumber','universityUserCategory', 'universityDomainName',
        'productMeal', 'productTitle', 'productPrice', 'universityTerminalType', 'universityIsFtthHub','universityOneManTerminal', 'productRate', 'productIntroductionPic3', 'productIntroductionPic4', 'showRhTime', 'productSchoolAbbreviated', 'expenses',
        'productState', "productIntroduction", "productSetMealIntroduction", "productRf2"], {force: true}, (err, values) => {
        if (err ) {
          return;
        }
        // 大学产品
        that.modelData.universityName=values.universityName
        that.modelData.universityRegion=values.universityRegion
        that.modelData.universityInstalledAddress=values.universityInstalledAddress
        that.modelData.universityExteriorLines=values.universityExteriorLines
        that.modelData.universityPackageNumber=values.universityPackageNumber
        that.modelData.universityInstalledAddressId=values.universityInstalledAddressId
        that.modelData.universityUserType=values.universityUserType
        that.modelData.universityContactPhone=values.universityContactPhone
        that.modelData.universityMonthlyRentType=values.universityMonthlyRentType
        that.modelData.universityChargeMode=values.universityChargeMode
        that.modelData.universityChargingAttribute=values.universityChargingAttribute
        that.modelData.universityTerminalType = values.universityTerminalType

        // // 合并speed字段和单宽
        if (values.productMeal != undefined) {
          that.modelData.speed = values.productMeal.split(",")[0];
        }
        that.modelData.expenses=values.expenses
        that.modelData.publicNumber=values.publicNumber
        that.modelData.universityUserCategory = values.universityUserCategory
        that.modelData.universityDomainName = values.universityDomainName
        that.modelData.universityOneManTerminal = values.universityOneManTerminal
        that.modelData.universityIsFtthHub = values.universityIsFtthHub

        // 使用大学宽带县分和学校
        that.modelData.productRegion = values.universityRegion
        that.modelData.productUniversity = values.universityName

        //宽带产品
        that.modelData.productIntroductionPic4 = values.productIntroductionPic4
        that.modelData.productIntroductionPic3 = values.productIntroductionPic3
        that.modelData.productSchoolAbbreviated = values.productSchoolAbbreviated
        that.modelData.productMeal = values.productMeal
        that.modelData.productTitle = values.productTitle
        that.modelData.productPrice = values.productPrice
        that.modelData.productRate = values.productRate
        that.modelData.productState = values.productState
        that.modelData.showRhTime = values.showRhTime

        that.modelData.productIntroduction = this.$refs.editor_a.d_render;
        that.modelData.productSetMealIntroduction = this.$refs.editor_b.d_render;
        that.modelData.productRf2 = this.$refs.editor_c.d_render;

        // 拷贝对象
        let obj = new Object();
        let universityInfo = new Object();
        let product = new Object();
        // 大学宽带
        universityInfo.universityId = that.modelData.universityId;
        universityInfo.universityName = that.modelData.universityName
        universityInfo.universityRegion = that.modelData.universityRegion
        universityInfo.universityInstalledAddress = that.modelData.universityInstalledAddress
        universityInfo.universityExteriorLines = that.modelData.universityExteriorLines
        universityInfo.universityPackageNumber = that.modelData.universityPackageNumber
        universityInfo.universityInstalledAddressId = that.modelData.universityInstalledAddressId
        universityInfo.universityUserType = that.modelData.universityUserType
        universityInfo.universityContactPhone = that.modelData.universityContactPhone
        universityInfo.universityMonthlyRentType = that.modelData.universityMonthlyRentType
        universityInfo.universityChargeMode = that.modelData.universityChargeMode
        universityInfo.universityChargingAttribute = that.modelData.universityChargingAttribute
        universityInfo.speed = that.modelData.speed
        universityInfo.expenses = that.modelData.expenses
        universityInfo.publicNumber = that.modelData.publicNumber
        universityInfo.universityUserCategory = that.modelData.universityUserCategory
        universityInfo.universityDomainName = that.modelData.universityDomainName
        universityInfo.universityOnlineNumber = that.modelData.universityOnlineNumber
        universityInfo.universityOneManTerminal = that.modelData.universityOneManTerminal
        universityInfo.universityIsFtthHub = that.modelData.universityIsFtthHub
        universityInfo.identifying = that.modelData.identifying
        universityInfo.universityTerminalType = that.modelData.universityTerminalType
        // 产品配置
        product.universityId = that.modelData.universityId;
        product.productRegion = that.modelData.productRegion
        product.productUniversity = that.modelData.productUniversity
        product.productIntroductionPic4 = that.modelData.productIntroductionPic4
        product.productIntroductionPic3 = that.modelData.productIntroductionPic3
        product.productIntroductionPic2 = that.regularName
        product.productSchoolAbbreviated = that.modelData.productSchoolAbbreviated
        product.productMeal = that.modelData.productMeal
        product.productTitle = that.modelData.productTitle
        product.productPrice = that.modelData.productPrice
        product.productRhRate = that.modelData.productRhRate
        product.productRhPrice = that.modelData.productRhPrice
        product.productRate = that.modelData.productRate
        product.productState = that.modelData.productState
        product.showRhTime = that.modelData.showRhTime
        product.productIntroduction = that.modelData.productIntroduction
        product.productSetMealIntroduction = that.modelData.productSetMealIntroduction
        product.productRf2 = that.modelData.productRf2
        product.productId = that.modelData.productId

        // 学校信息
        obj.schools = that.modelData.schools;
        obj.product = product;
        obj.universityInfo = universityInfo;

        if(this.add){
          delete universityInfo.universityId
          delete product.universityId
          delete product.productId
          saveBroadBandConfig(obj).then((res) => {
            this.modifyvisible=false;
            this.clearmodel()
            if(res.state=="success"){
                console.log(res.state.msg);
              this.$notification.success({message: res.data, description: '', duration: 4})
            }
            this.search()
          })
        }else {
          saveBroadBandConfig(obj).then((res) => {
            this.modifyvisible=false;
            this.clearmodel()
            if(res.state=="success"){
              console.log(res.state.msg);
              this.$notification.success({message: res.data, description: '', duration: 4})
            }
            this.search()
          })
        }
      })
    },
    createfunctionCancel(){
      this.modifyvisible=false;
      this.clearmodel()
      this.add=true;
    },
    //清除弹窗信息
    clearmodel() {
      this.add=true
      this.modelData.universityId='',
      this.modelData.schools = [],
      this.modelData.productMealPrice = ''
      this.modelData.productId = ''
      this.modelData.productIntroduction = ''
      this.modelData.productSetMealIntroduction = ''
      this.modelData.productUniversity = ''
      this.modelData.productIntroductionPic2 = ''
      this.productIntroduction = ''
      this.productSetMealIntroduction= ''
      this.productRf2=''
      this.Formtable.setFieldsValue({
        "universityName":'',
        "universityRegion":'',
        "universityInstalledAddress":'',
        "universityExteriorLines":'',
        "universityPackageNumber":'',
        "universityInstalledAddressId":'',
        "universityUserType":'',
        "universityContactPhone":'',
        "universityMonthlyRentType":'',
        "universityChargeMode":'',
        "universityChargingAttribute":'',
        "speed":'',
        "publicNumber":'',
        "universityTerminalType": '',
        "universityUserCategory": '',
        "universityOnlineNumber": '',
        "universityOneManTerminal": '',
        "universityIsFtthHub": '',
        "universityDomainName": '',
        "identifying": '',

        'productMeal': '',
        'productTitle': '',
        'productPrice': '',
        'productRate': '',
        'productState': '0',
        'productIntroductionPic3': '',
        'productIntroductionPic4': '',
        'showRhTime': '',
        'productSchoolAbbreviated': '',
        'expenses': ''
      })
    },
    getSchool() {
      this.schoolNames = [];
      this.queryParam.productUniversity = '';
      getSchoolNames({"substName": this.queryParam.productRegion}).then((res) => {
        if (res.state == "success") {
          const result = res.data
          result.forEach((r) => {
            if (r.schoolName === 'null')
              return;
            this.schoolNames.push({
              value: r.schoolName,
              text: r.schoolName
            })
          })
        }
      })
    },
    initSubstName() {
      initSubstName().then((res) => {
        if (res.state == "success") {
          const result = res.data
          result.forEach((r) => {
            if (r.subName === 'null')
              return;
            this.subNames.push({
              value: r.subName,
              text: r.subName
            })
          })
        }
      })
    }
  },
  mounted() {
    this.initSubstName();
    this.getSchool();
  }
}
</script>

<style>
.school-box {
  border-bottom: 1px solid grey;
  margin-bottom: 20px;
}
</style>