<template> 
 | 
    <GlobalWindow 
 | 
        class="menu-config-dialog" 
 | 
        :visible.sync="visible" 
 | 
        :confirm-working="isWorking" 
 | 
        width="800px" 
 | 
        title="分配服务企业" 
 | 
        @confirm="confirm" 
 | 
    > 
 | 
        <p class="tip">为用户 <em>{{form.name || ''}}</em> 分配企业</p> 
 | 
        <el-transfer 
 | 
            :titles="['未分配企业', '已分配企业']" 
 | 
            v-model="form.companyIds" 
 | 
            :data="enterprise" /> 
 | 
    </GlobalWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
  import GlobalWindow from '@/components/common/GlobalWindow' 
 | 
  import { allForFp } from '@/api/business/company' 
 | 
  import { auth, getById } from '@/api/business/customerService' 
 | 
  import { mapState } from 'vuex' 
 | 
  export default { 
 | 
    name: 'allocateEnterprises', 
 | 
    components: { GlobalWindow }, 
 | 
    computed: { 
 | 
      ...mapState(['userInfo']) 
 | 
    }, 
 | 
    data () { 
 | 
      return { 
 | 
        visible: false, 
 | 
        isWorking: false, 
 | 
        form: { 
 | 
          id: null, 
 | 
          name: '', 
 | 
          companyIds: [] 
 | 
        }, 
 | 
        enterprise: [] 
 | 
      } 
 | 
    }, 
 | 
    methods: { 
 | 
      open (title, id) { 
 | 
        this.title = title 
 | 
        this.visible = true 
 | 
        this.getCompany() 
 | 
        for (const key in this.form) { 
 | 
          this.form[key] = '' 
 | 
        } 
 | 
        getById(id) 
 | 
          .then(res => { 
 | 
            this.form.id = res.id 
 | 
            this.form.name = res.name 
 | 
            this.form.companyIds = res.customerCompanyList.map(item => item.companyId) 
 | 
          }) 
 | 
      }, 
 | 
      getCompany() { 
 | 
        allForFp({ type: this.userInfo.type }) 
 | 
          .then(res => { 
 | 
            this.enterprise = res.map(item => { 
 | 
              return { 
 | 
                key: item.id, 
 | 
                label: item.name 
 | 
              } 
 | 
            }) 
 | 
          }) 
 | 
      }, 
 | 
      confirm() { 
 | 
        let obj = { 
 | 
          id: this.form.id, 
 | 
          customerCompanyList: [] 
 | 
        } 
 | 
        if (this.form.companyIds.length > 0) { 
 | 
          obj.customerCompanyList = this.form.companyIds.map(item => { 
 | 
            return { 
 | 
              companyId: item 
 | 
            } 
 | 
          }) 
 | 
        } 
 | 
        this.isWorking = true 
 | 
        auth(obj) 
 | 
          .then(() => { 
 | 
            this.visible = false 
 | 
            this.$tip.apiSuccess('操作成功') 
 | 
            this.$emit('success') 
 | 
          }) 
 | 
          .catch(e => { 
 | 
            this.$tip.apiFailed(e) 
 | 
          }) 
 | 
          .finally(() => { 
 | 
            this.isWorking = false 
 | 
          }) 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
</script> 
 | 
<style> 
 | 
    .el-transfer-panel { 
 | 
        width: 300px !important; 
 | 
    } 
 | 
</style> 
 | 
<style scoped lang="scss"> 
 | 
    @import "@/assets/style/variables.scss"; 
 | 
    .global-window { 
 | 
        .tip { 
 | 
            margin-bottom: 12px; 
 | 
            em { 
 | 
                font-style: normal; 
 | 
                color: $primary-color; 
 | 
                font-weight: bold; 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |