<template>
  <div class="box">
    <div class="container">
    <div class="item left">
    <div style="margin-top:30px;">
      系统配置
    </div>
    <div style="margin-top:30px;"></div>
    <el-collapse v-model="activeNames" @change="handleChange"  accordion>
      <el-collapse-item title="设置无课用户点我要上课跳转地址" name="1">
        <el-form
          :model="form"
          ref="form"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item
            prop="msg"
            style="width:500px;"
            :rules="[{ required: true, message: '配置信息不能为空'}, ]">
            <el-input type="text" v-model.number="form.msg" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="打卡商品" name="2">
        <el-form
          :model="form2"
          ref="form2"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item  prop="msg" style="width:500px;" :rules="[{ required: true, message: '配置信息不能为空'},]">
            <el-select v-model="form2.msg" placeholder="请选择" style="width: 100%">
              <el-option
                v-for="data in goodsList"
                :key="data.id"
                :label="`【${data.id}】${data.name}`"
                :value="data.id.toString()"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item center>
            <el-button type="primary" @click="submitForm('form2')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="外部投放商品"  name="3">
        <el-form
          :model="form3"
          ref="form3"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item  prop="msg" style="width:500px;" :rules="[{ required: true, message: '配置信息不能为空'},]">
            <el-select v-model="form3.msg" placeholder="请选择" style="width: 100%">
              <el-option
                v-for="data in goodsList"
                :key="data.id"
                :label="`【${data.id}】${data.name}`"
                :value="data.id.toString()"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form3')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="默认成团时间(失效前几小时)"  name="4">
        <el-form
          :model="form4"
          ref="form4"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item
          style="width:500px;"
            prop="msg"
            :rules="[{ required: true, message: '配置信息不能为空'}, ]">
            <el-input type="text" v-model.number="form4.msg" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form4')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="未成团催团通知时间(失效前几小时)" name="5">
        <el-form
          :model="form5"
          ref="form5"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item
          style="width:500px;"
            prop="msg"
            :rules="[{ required: true, message: '配置信息不能为空'}, ]">
            <el-input type="text" v-model.number="form5.msg" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form5')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="无课用户推荐商品"  name="6">
        <el-form
          :model="form6"
          ref="form6"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item  prop="msg" style="width:500px;" :rules="[{ required: true, message: '配置信息不能为空'},]">
            <el-select v-model="form6.msg" placeholder="请选择" style="width: 100%">
              <el-option
                v-for="data in goodsList"
                :key="data.id"
                :label="`【${data.id}】${data.name}`"
                :value="data.id.toString()"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form6')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="自动化推荐体验商品"  name="7">
        <el-form
          :model="form7"
          ref="form7"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item  prop="msg" style="width:500px;" :rules="[{ required: true, message: '配置信息不能为空'},]">
            <el-select multiple v-model="form7.msg" placeholder="请选择" style="width: 100%">
              <el-option
                v-for="data in goodsList"
                :key="data.id"
                :label="`【${data.id}】${data.name}`"
                :value="data.id.toString()"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form7')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="自动化推荐转化商品ID"  name="8">
        <el-form
          :model="form8"
          ref="form8"
          class="demo-ruleForm"
          style="width:700px;">
          <el-form-item  prop="msg" style="width:500px;" :rules="[{ required: true, message: '配置信息不能为空'},]">
            <el-select  v-model="form8.msg" placeholder="请选择" style="width: 100%">
              <el-option
                v-for="data in goodsList"
                :key="data.id"
                :label="`【${data.id}】${data.name}`"
                :value="data.id.toString()"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('form8')" v-if="!$store.state.readonly">确定</el-button>
          </el-form-item>
        </el-form>
      </el-collapse-item>
      <el-collapse-item title="首页免费商品期数"  name="9">
        <div>
          <el-button  @click="periodDialogFn(0)">
            添加期数
          </el-button>
          <el-table
          :data="yunjiList"
          style="width: 100%">
          <el-table-column
            prop="id"
            label="id">
          </el-table-column>
          <el-table-column
            prop="title"
            label="标题">
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="150"
            v-if="!$store.state.readonly">
            <template slot-scope="scope">
              <el-button
                @click="delYunjiListFn(scope.row)"
                type="warning"
                plain
                size="mini">
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
       </div>
      </el-collapse-item>
      <el-collapse-item title="全勤活动星星期数(赠绘本)"  name="10">
        <div>
          <el-button  @click="periodDialogFn(1)">
            添加期数
          </el-button>
        <el-table
          :data="starList"
          style="width: 100%">
          <el-table-column
            prop="id"
            label="id" width="100">
          </el-table-column>
          <el-table-column
            prop="goods_name"
            label="商品名称">
          </el-table-column>
          <el-table-column
            prop="title"
            label="标题">
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="150"
            v-if="!$store.state.readonly">
            <template slot-scope="scope">
              <el-button
                @click="delStarListFn(scope.row)"
                type="warning"
                plain
                size="mini">
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
       </div>
      </el-collapse-item>
      <el-collapse-item title="全勤活动星星期数(返奖学金)"  name="11">
      <div>
          <el-button  @click="periodDialogFn(2)">
            添加期数
          </el-button>
        <el-table
          :data="starV2List"
          style="width: 100%">
          <el-table-column
            prop="id"
            label="id" width="100">
          </el-table-column>
          <el-table-column
            prop="goods_name"
            label="商品名称">
          </el-table-column>
          <el-table-column
            prop="title"
            label="标题">
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="150"
            v-if="!$store.state.readonly">
            <template slot-scope="scope">
              <el-button
                @click="delStarV2ListFn(scope.row)"
                type="warning"
                plain
                size="mini">
                删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
       </div>
      </el-collapse-item>
     </el-collapse>
     </div>
     <!-- <div class="item">
       <div style="margin-top:30px;">
        系统功能
       </div>
       <div style="margin-top:30px;"></div>
       <div>
        <el-button  @click="noticeDialogFn">
          发送活动通知
        </el-button>
       </div>
       <div style="margin-top:20px;"></div>
     </div> -->
    </div>
    <el-dialog
      title="发生活动通知(限活动期数发送)"
      :visible.sync="noticeDialog">
        <el-cascader
                :options="periodList"
                :props="{value:'id',label:'name'}"
                @active-item-change="handleItemChange"
                v-model="secGoods"
              >
        </el-cascader>
        <span slot="footer" class="dialog-footer">
          <el-button @click="noticeDialog = false">取 消</el-button>
          <el-button type="primary" @click="onSend">确 定</el-button>
        </span>
    </el-dialog>
    <el-dialog
      title="添加期数"
      :visible.sync="periodDialog">
        <el-cascader
                :options="periodList"
                :props="{value:'id',label:'name'}"
                @active-item-change="handleItemChange"
                v-model="secGoods"
              >
        </el-cascader>
        <span slot="footer" class="dialog-footer">
          <el-button @click="periodDialog = false">取 消</el-button>
          <el-button type="primary" @click="addPeriod">确 定</el-button>
        </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  getConfigListApi,
  updateConfigApi,
  getGoodsListApi,
  postActiveNoticeApi,
  getPeriodsApi,
  getClassListApi,
  getPeriodsTeacherApi,
  getDefaultPeriodsApi,
  addyunjiPeriodApi,
  addStarActivityPeriodApi,
  getStarActivityPeriodApi,
  getYunjiActivityPeriodApi,
  delYunjiActivityPeriodApi,
  delStarActivityPeriodApi,
  delStarActivityV2PeriodApi,
  addStarActivityV2PeriodApi,
  getStarActivityV2PeriodApi
} from "../../service/api";
import {GOODSTYPE,CLASSSOURCE} from '../../util/wordbook';
export default {
  name: "entrance",
  props: ["entranceObj"],
  data() {
    return {
      starListV2:[],
      noticeDialog:false,
      periodDialog:false,
      activeName: "1",
      form: {
        msg: ""
      },
      form2: {
        msg: ""
      },
      form3: {
        msg: ""
      },
      form4: {
        msg: ""
      },
      form5: {
        msg: ""
      },
      form6: {
        msg: ""
      },
      form7: {
        msg:[]
      },
      form8: {
        msg: ""
      },
      thisList: {},
      thisList2: {},
      thisList3: {},
      thisList4: {},
      thisList5: {},
      thisList6: {},
      thisList7: {},
      thisList8: {},
      periodList: [],
      activeNames:[1],
      selectedGoods: [],
      secGoods:[],
      periodsId:'',
      periodsType:'',
      yunjiList:[],
      starList:[],
      starV2List:[]
    };
  },
  mounted() {
    // this.first();
    this.second();
  },
  filters: {},
  methods: {
    delYunjiListFn(row){
      console.log(row)
       this.$confirm('确认删除?')
          .then(_ => {
            delYunjiActivityPeriodApi(row.id).then(res =>{
               getYunjiActivityPeriodApi().then(res =>{
                this.yunjiList = res
                this.$message({
                  type: "success",
                  message: "删除成功"
                });
              })
            })
          }).catch(_ => {});
    },
    delStarListFn(row){
      console.log(row)
       this.$confirm('确认删除?')
          .then(_ => {
            delStarActivityPeriodApi(row.id).then(res =>{
               getStarActivityPeriodApi().then(res =>{
                this.starList = res
                this.$message({
                  type: "success",
                  message: "删除成功"
                });
              })
            })
          }).catch(_ => {});
    },
    delStarV2ListFn(row){
      console.log(row)
       this.$confirm('确认删除?')
          .then(_ => {
            delStarActivityV2PeriodApi(row.id).then(res =>{
               getStarActivityV2PeriodApi().then(res =>{
                this.starV2List = res
                this.$message({
                  type: "success",
                  message: "删除成功"
                });
              })
            })
          })
          .catch(_ => {});
    },
    addPeriod(){
      console.log(this.periods)
      if(this.periodsType==0){
        addyunjiPeriodApi(this.secGoods[1]).then(res =>{
          this.$message({
            type: "success",
            message: "数据插入成功"
          });
          this.periodDialog=false;
          getYunjiActivityPeriodApi().then(res =>{
          this.yunjiList = res
        })
        })
      }else if(this.periodsType==1){
        addStarActivityPeriodApi(this.secGoods[1]).then(res =>{
          this.$message({
            type: "success",
            message: "数据插入成功"
          });
          this.periodDialog=false;
          getStarActivityPeriodApi().then(res =>{
          this.starList = res
          // console.log(this.yunjiList)
        })
        })
      }else{
        addStarActivityV2PeriodApi(this.secGoods[1]).then(res =>{
          this.$message({
            type: "success",
            message: "数据插入成功"
          });
          this.periodDialog=false;
          getStarActivityV2PeriodApi().then(res =>{
          this.starV2List = res
          // console.log(this.yunjiList)
         })
        })
      }
    },
    handleItemChange(val){
        getPeriodsApi({goods_id:val[0]}).then(res=>{
          res.list.forEach(i=>{i.name = i.title});
          this.periodList.find(i=>{return i.id === val[0]}).children = res.list
        })
      },
    onSend(){
        // console.log(this.secGoods)
        postActiveNoticeApi(this.secGoods[1]).then(res=>{
          this.noticeDialog=false;
          this.$message({
            type: "success",
            message: "发送成功"+res.num+'个'
          });
        })
      },
      periodDialogFn(str){
        console.log(str)
        this.periodsType = str
        this.periodDialog=true
        let json = {
          page: 1,
          limit: 100,
          goods_type:'1,2'
        };
        getGoodsListApi(json).then(res=>{
          // console.log(res)
          res.list.forEach(i=>{
            i.name = '['+i.id+']'+'[' + GOODSTYPE[i.goods_type] + ']' + '[' +i.current_price / 100 + '元]' + i.name
            i.children = [];
          });
          this.periodList = res.list;
          this.initQuery();
        });
      },
      stareriodDialogFn(){
        this.periodDialog=true
        let json = {
          page: 1,
          limit: 100,
          goods_type:'1,2'
        };
        getGoodsListApi(json).then(res=>{
          // console.log(res)
          res.list.forEach(i=>{
            i.name = '['+i.id+']'+'[' + GOODSTYPE[i.goods_type] + ']' + '[' +i.current_price / 100 + '元]' + i.name
            i.children = [];
          });
          this.periodList = res.list;
          this.initQuery();
        });
      },
    noticeDialogFn(){
        this.noticeDialog=true
        let json = {
          page: 1,
          limit: 100,
          goods_type:'1,2'
        };
        getGoodsListApi(json).then(res=>{
          // console.log(res)
          res.list.forEach(i=>{
            i.name = '['+i.id+']'+'[' + GOODSTYPE[i.goods_type] + ']' + '[' +i.current_price / 100 + '元]' + i.name
            i.children = [];
          });
          this.periodList = res.list;
          this.initQuery();
        });
      },
      initQuery(){
        let _query = this.$route.query;
        if (_query && _query.goods_id && _query.periods_id) {
          this.goods_id = _query.goods_id;
          this.selectedGoods = [parseInt(_query.goods_id),parseInt(_query.periods_id)];
          getPeriodsApi({goods_id:this.selectedGoods[0]}).then(res=>{
            res.list.forEach(i=>{i.name = i.title});
            this.periodList.find(i=>{return i.id === this.selectedGoods[0]}).children = res.list
            let nowGoods = this.periodList.find(i=>{return i.id === this.selectedGoods[0]});
            this.periods = nowGoods.children.find(i=>{return i.id === this.selectedGoods[1]});
            this.teacher_id = '';
            // this.getClassList()
          })
        } else {
          getDefaultPeriodsApi().then(res=>{
            if(res){
              this.goods_id = res.goods_id;
              this.selectedGoods = [parseInt(res.goods_id),parseInt(res.id)];
              getPeriodsApi({goods_id:this.selectedGoods[0]}).then(res=>{
                res.list.forEach(i=>{i.name = i.title});
                this.periodList.find(i=>{return i.id === this.selectedGoods[0]}).children = res.list
                console.log(res.list)
                console.log(this.periodList.find(i=>{return i.id === this.selectedGoods[0]}).children)
                let nowGoods = this.periodList.find(i=>{return i.id === this.selectedGoods[0]});
                this.periods = nowGoods.children.find(i=>{return i.id === this.selectedGoods[1]});
                this.teacher_id = '';
                // this.getClassList()
                console.log(this.periodList)
              });
            }
        })
        }
      },
      getClassList(){
        if (!this.periods) return;
        this.getTeacher();
        let json = {
            limit: this.limit,
            page: this.nowPage
        };
        if (this.teacher_id) {
            json.teacher_id = this.teacher_id
        }
        getClassListApi(this.periods.id,json).then(res=>{
          res.list.forEach(data=>{
            data.arrive_course_rate = 0;
            data.watch_course_rate = 0;
            data.over_course_rate = 0;
            data.work_rate = 0;
            data.over_work_rate = 0;
            data.clock_rate = 0;
            data.over_clock_rate = 0;
            data.transform_rate = 0;
          });

          this.title = res.periods;
          this.title.count_join_num = res.count.count_join_num ? res.count.count_join_num : '暂无';
          this.title.count_max_join_num = res.count.count_max_join_num ? res.count.count_max_join_num : '暂无';
          this.title.count_teacher_num = res.count.count_teacher_num ? res.count.count_teacher_num : '暂无';
          this.countObj = res.count ? res.count : '';
          this.classList = res.list;
          this.total = res.total;
        })
      },
    handleChange(val) {
      // console.log(val)
      // this.activeName = val.name;
      if (val === "1") {
        this.first();
      }else if(val === "4"){
        this.four();
      }else if(val === "5"){
        this.five();
      }else if(val === "7"){
        this.seven();
      }else if(val === "8"){
        this.eight();
      }else if(val === "9"){
        getYunjiActivityPeriodApi().then(res =>{
          this.yunjiList = res
          // console.log(this.yunjiList)
        })
      }else if(val ==='10'){
        getStarActivityPeriodApi().then(res =>{
          this.starList= res
        })
      }else if(val ==='11'){
        getStarActivityV2PeriodApi().then(res =>{
          this.starV2List= res
        })
      }
    },
    first() {
      getConfigListApi({ key: "new_user_redirect" }).then(res => {
        console.log(res);
        let thisList = res.list[0];
        this.form.msg = thisList.desc;
        this.thisList = thisList;
      });
    },
    second() {
      getGoodsListApi({ limit: 100 }).then(res => {
        this.goodsList = res.list;
        getConfigListApi({ key: "share_goods_id" }).then(res => {
          console.log(res);
          let thisList2 = res.list[0];
          this.form2.msg = thisList2.value;
          this.thisList2 = thisList2;
        });
        getConfigListApi({ key: "mp_ads_goods_id" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList3 = res.list[0];
            this.form3.msg = thisList3.desc;
            this.thisList3 = thisList3;
          }
        });
         getConfigListApi({ key: "no_course_goods_id" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList6 = res.list[0];
            this.form6.msg = thisList6.value;
            this.thisList6 = thisList6;
          }
        });
      });
    },
    four(){
      getConfigListApi({ key: "success_group_before_hour" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList4 = res.list[0];
            this.form4.msg = thisList4.desc;
            this.thisList4 = thisList4;
          }
        });
    },
    five(){
      getConfigListApi({ key: "urge_group_share_hour" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList5 = res.list[0];
            this.form5.msg = thisList5.desc;
            this.thisList5 = thisList5;
          }
        });
    },
    seven(){
      getConfigListApi({ key: "automation_goods_ids" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList7 = res.list[0];
            this.form7.msg = thisList7.value.split(',');
            this.thisList7 = thisList7;
          }
        });
    },
    eight(){
      getConfigListApi({ key: "automation_conversion_goods_id" }).then(res => {
          console.log(res);
          if(res.list[0]){
            let thisList8 = res.list[0];
            this.form8.msg = thisList8.value;
            this.thisList8 = thisList8;
          }
        });
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (formName == "form") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList.key,
                value: this.thisList.value,
                desc: this.form.msg
              };
              let id = this.thisList.id;
              console.log(id, json);
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          } else if(formName == "form2") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList2.key,
                value: this.form2.msg,
                desc: this.thisList2.desc
              };
              let id = this.thisList2.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          } else if(formName == "form3") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList3.key,
                value: this.thisList3.value,
                desc: this.form3.msg
              };
              let id = this.thisList3.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }else if(formName == "form4") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList4.key,
                value: this.thisList4.value,
                desc: this.form4.msg
              };
              let id = this.thisList4.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }else if(formName == "form5") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList5.key,
                value: this.thisList5.value,
                desc: this.form5.msg
              };
              let id = this.thisList5.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }else if(formName == "form6") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList6.key,
                value: this.form6.msg,
                desc: this.thisList6.desc
              };
              let id = this.thisList6.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }else if(formName == "form7") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList7.key,
                value: this.form7.msg.join(','),
                desc: this.thisList7.desc
              };
              let id = this.thisList7.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }else if(formName == "form8") {
            this.$confirm("确认修改吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              let json = {
                key: this.thisList8.key,
                value: this.form8.msg,
                desc: this.thisList8.desc
              };
              let id = this.thisList8.id;
              updateConfigApi(id, json).then(res => {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
              });
            });
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    }
  }
};
</script>
<style scoped lang="less">
.box{padding: 20px;background: white;text-indent: 10px;box-sizing: border-box;}
.el-form-item{display: inline-block;margin-right: 40px;}
.container{
  display: flex;
  .left{width: 60%;}
  .el-collapse-item__arrow{margin-left: 0;}
}
</style>