<template> 
 | 
  <zt-dialog ref="dialog" @confirm="formSubmit" column="3" append-to-body> 
 | 
    <el-form :model="dataForm" ref="dataForm" :disabled="dataForm.disabled" label-width="120px"> 
 | 
      <el-collapse v-model="activeNames"> 
 | 
        <el-collapse-item name="1"> 
 | 
          <template slot="title"> 
 | 
            <el-tag>{{ $t('tenant.title') }}</el-tag> 
 | 
          </template> 
 | 
          <zt-form-item :label="$t('tenant.code')" prop="code" rules='required'> 
 | 
            <el-input v-model="dataForm.code" :placeholder="$t('tenant.code')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.name')" prop="name" rules='required'> 
 | 
            <el-input v-model="dataForm.name" :placeholder="$t('tenant.name')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.shortName')" prop="shortName" rules='required'> 
 | 
            <el-input v-model="dataForm.shortName" :placeholder="$t('tenant.shortName')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.nature')" prop="nature" rules='required'> 
 | 
            <zt-dict v-model="dataForm.nature" dict="tenant_type" :placeholder="$t('tenant.nature')"></zt-dict> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.businessScope')" prop="businessScope"> 
 | 
            <zt-dict v-model="dataForm.businessScope" dict="business_scope" :placeholder="$t('tenant.businessScope')"></zt-dict> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.foundedTime')" prop="foundedTime"> 
 | 
            <zt-date-picker v-model="dataForm.foundedTime" :placeholder="$t('tenant.selectFoundedTime')"/> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.webAddress')" prop="webAddress"> 
 | 
            <el-input v-model="dataForm.webAddress" :placeholder="$t('tenant.webAddress')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.manager')" prop="manager" rules='required'> 
 | 
            <el-input v-model="dataForm.manager" :placeholder="$t('tenant.manager')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.phone')" prop="phone" rules='required'> 
 | 
            <el-input v-model="dataForm.phone" :placeholder="$t('tenant.phone')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.email')" prop="email" rules='required'> 
 | 
            <el-input v-model="dataForm.email" :placeholder="$t('tenant.email')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.fax')" prop="fax"> 
 | 
            <el-input v-model="dataForm.fax" :placeholder="$t('tenant.fax')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.contacter')" prop="contacter"> 
 | 
            <el-input v-model="dataForm.contacter" :placeholder="$t('tenant.contacter')" rules='required'></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.contactPhone')" prop="contactPhone"> 
 | 
            <el-input v-model="dataForm.contactPhone" :placeholder="$t('tenant.contactPhone')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.postalCode')" prop="postalCode"> 
 | 
            <el-input v-model="dataForm.postalCode" :placeholder="$t('tenant.postalCode')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.remark')" prop="remark"> 
 | 
            <el-input v-model="dataForm.remark" :placeholder="$t('tenant.remark')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <div class="item-line-divider"></div> 
 | 
          <el-col :span="16"> 
 | 
            <zt-form-item :label="$t('tenant.province')" prop="provinceId"> 
 | 
              <v-distpicker @province="provinceChange" @city="cityChange" @area="areaChange"/> 
 | 
              <el-input v-model="dataForm.address" :placeholder="$t('tenant.address')"></el-input> 
 | 
            </zt-form-item> 
 | 
          </el-col> 
 | 
          <div class="item-line-divider"></div> 
 | 
          <zt-form-item :label="$t('tenant.gmtEnd')" prop="gmtBegin" rules='required'> 
 | 
            <zt-date-picker v-model="dataForm.gmtBegin" :placeholder="$t('tenant.selectgmtBegin')"/> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.gmtEnd')" prop="gmtEnd" rules='required'> 
 | 
            <zt-date-picker v-model="dataForm.gmtEnd" :placeholder="$t('tenant.selectgmtEnd')"/> 
 | 
          </zt-form-item> 
 | 
        </el-collapse-item> 
 | 
  
 | 
        <el-collapse-item name="2" v-if="!dataForm.id"> 
 | 
          <template slot="title"> 
 | 
            <el-tag>{{ $t('tenant.adminTitle') }}</el-tag> 
 | 
          </template> 
 | 
          <zt-form-item prop="adminMobile" :label="$t('tenant.adminMobile')" rules='required'> 
 | 
            <el-input v-model="dataForm.adminMobile" :placeholder="$t('tenant.adminMobile')"></el-input> 
 | 
          </zt-form-item> 
 | 
          <zt-form-item :label="$t('tenant.adminRealName')" prop="adminRealName" rules='required'> 
 | 
            <el-input v-model="dataForm.adminRealName" :placeholder="$t('tenant.adminRealName')"></el-input> 
 | 
          </zt-form-item> 
 | 
        </el-collapse-item> 
 | 
  
 | 
      </el-collapse> 
 | 
  
 | 
    </el-form> 
 | 
  </zt-dialog> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
  import VDistpicker from 'v-distpicker' 
 | 
  
 | 
  export default { 
 | 
    components: {VDistpicker}, 
 | 
    data() { 
 | 
      return { 
 | 
        activeNames: ['1', '2'], 
 | 
        dataForm: { 
 | 
          id: '', 
 | 
          name: '', 
 | 
          code: '', 
 | 
          shortName: '', 
 | 
          nature: '', 
 | 
          phone: '', 
 | 
          fax: '', 
 | 
          postalCode: '', 
 | 
          email: '', 
 | 
          manager: '', 
 | 
          contacter: '', 
 | 
          contactPhone: '', 
 | 
          provinceId: '', 
 | 
          cityId: '', 
 | 
          countyId: '', 
 | 
          address: '', 
 | 
          webAddress: '', 
 | 
          foundedTime: '', 
 | 
          businessScope: '', 
 | 
          remark: '', 
 | 
          gmtBegin: '', 
 | 
          gmtEnd: '', 
 | 
          adminRealName: '', 
 | 
          adminMobile: '' 
 | 
        } 
 | 
      } 
 | 
    }, 
 | 
    computed: { 
 | 
    }, 
 | 
    methods: { 
 | 
      provinceChange(value) { 
 | 
        this.dataForm.provinceId = value.value 
 | 
      }, 
 | 
      cityChange(value) { 
 | 
        this.dataForm.cityId = value.value 
 | 
      }, 
 | 
      areaChange(value) { 
 | 
        this.dataForm.countyId = value.value 
 | 
      }, 
 | 
      // 获取信息 
 | 
      async getInfo() { 
 | 
        let res = await this.$http.get(`/sys/tenant/${this.dataForm.id}`) 
 | 
        this.dataForm = { 
 | 
          ...this.dataForm, 
 | 
          ...res.data 
 | 
        } 
 | 
      }, 
 | 
      // 表单提交 
 | 
      async formSubmit() { 
 | 
        let res = await this.$http[!this.dataForm.id ? 'post' : 'put']('/sys/tenant/', this.dataForm) 
 | 
        if (res.success) { 
 | 
          await this.$tip.success() 
 | 
          this.$refs.dialog.close() 
 | 
          this.$emit('refreshDataList') 
 | 
        } 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
</script> 
 |