<template>
  <div class="enterprise min-container">
    <div class="header-title">公司概况
      <Button type="primary" size="large" class="fr" @click="isDetail=false" v-if="companyId">修改信息</Button>
    </div>
    <baseForm key="base" :form="form" ref="base-form" :isDetail="isDetail" />
    <div class="header-title">视频介绍</div>
    <videoForm :form="form" ref="video-form" :isDetail="isDetail" />
    <div class="header-title">图片介绍</div>
    <introPicForm :form="form" ref="intro-form" :isDetail="isDetail" />
    <div class="actions-w">
      <Button type="primary" size="large" class="submit-btn" @click="handleSubmitClick" v-if="!isDetail">提交</Button>
      <Button  size="large" @click="cancle" v-if="companyId && !isDetail">取消</Button>
    </div>
    
  </div>
</template>

<script>
import * as CompanyApi from '@/api/company'
import baseForm from './components/baseForm'
import videoForm from './components/videoForm'
import introPicForm from './components/introPicForm'
import { getAdmin, setAdmin } from '@/libs/token'
import { refreshAdminerInfo } from '@/api/index'
// import { getGuideById } from '@/api/guide'

export default {
  data () {
    return {
      isDetail: false,
      form: {
        companyName: '',
        companyType: '',
        sceneNum: '',
        vrLink: '',
        registerDate: ''
      },
      
    }
  },
  components: {
    baseForm,
    videoForm,
    introPicForm
  },
  computed: {
    companyId () {
      let admin = getAdmin().admin
      return this.$route.query.companyId || admin.belongCompanyId
    },
    adminId () {
      return getAdmin().admin.adminId
    }
  },
  mounted () {
    this.getCompanyDetail()
  },
  methods: {
    async handleSubmitClick () {
       return this.validate()
    },
    async validate () {
      let res = await Promise.all([this.$refs['base-form'].validate()])
      let item = res.find(item => !item)
      if (item === false) {
        return
      } else {
        this.submit()
      }
    },
    async submit () {
      await Promise.all([this.$refs['base-form'].submit(), this.$refs['video-form'].submit(), this.$refs['intro-form'].submit()])
      let api = this.form.companyId ? CompanyApi.updateCompany : CompanyApi.addCompany
      return api(this.form).then(() => {
        this.$Message.success(this.form.companyId ? '修改成功' : '新增成功')
        this.isDetail = true
        setTimeout(() => {
          this.refreshAdminerInfo()
        }, 500)
      })
    },
    cancle () {
      window.location.reload()
    },
    getCompanyDetail (companyId) {
      let id = companyId || this.companyId
      if (!id) return
      CompanyApi.getCompanyDetail(id).then(res => {
        this.isDetail = true
        res.data.company.registerDate1 = new Date(res.data.company.registerDate)
        
        this.form = res.data.company
        console.log(this.form)
      })
    },
    refreshAdminerInfo () {
      return refreshAdminerInfo(this.adminId).then(res => {
        this.$router.push({
          path: '/enterprise',
          query: {
            companyId: res.data.belongCompanyId
          }
        })
      })
    }
  }
}
</script>
<style lang="less">
.enterprise {
  color: rgba(255,255,255,0.60);
  .form {
    margin-top: 30px;
  }
  
  .ivu-date-picker {
    width: 100%;
  }
  .ivu-date-picker-cells-year .ivu-date-picker-cells-cell-focused, .ivu-date-picker-cells-month .ivu-date-picker-cells-cell-focused, .ivu-date-picker-cells-cell:hover em {
    background: #17D2D2 !important;
    color: #fff;
  }
  
  .m-t-30 {
    margin-top: 30px;
  }
  .ivu-input-wrapper {
    max-width: 337px;
  }
  .textarea-w {
    .ivu-input-wrapper {
      max-width: 100%;
      
    }
    textarea.ivu-input {
      height: 104px;
    }
  }
  .input-btn {
    margin: 0 0 0 15px;
    position: relative;
    &.not-allow {
      &::after {
        width: calc(100% + 2px);
        height: calc(100% + 2px);
        content: '';
        display: block;
        background: rgba(0,0,0,0.5);
        position: absolute;
        top: -1px;
        left: -1px;
        cursor: not-allowed;
      }
    }
  }
  .actions-w {
    padding-left: 86px;
    padding-bottom: 30px;
    .submit-btn {
      margin-right: 15px;
    }
  }
  .ivu-input[disabled], .ivu-select-disabled .ivu-select-selection {
    background: transparent !important;
    color: #fff !important;
    border: none;
    cursor: default;
    .ivu-icon, .ivu-input-word-count {
      display: none;
    }
  }
  textarea {
    resize: none;
  }
}
</style>