<template>
  <div class="baseinfoselect">
    <span class="select-title">{{ title }}：</span>
    <div class="select-popper " >
      <span :class="{'txt':selectTxt1.name == '待添加'}">
        {{selectTxt1.name}}
        <i class="el-icon-caret-bottom"></i>
      </span>
      <el-select v-if="isDisabled==false" v-model="selectTxt1.val" class="select-multiple" placeholder="请选择" @change="editXMSL($event)">
        <el-option v-for="(item,index) in list" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
      </el-select>
    </div>
  </div>
</template>

<script>
import { customerUpdate } from '@/api/detail/party-a/cooperate'
export default {
  name: "elselects",
  props: [
    'title',
    'list',
    'id',
    'val',
    'field'
  ],
  data() {
    return {
      isDisabled:false,
      selectTxt1:this.selectTxts(),
      isselect: false
    }
  },
  created(){
    this.selectTxts()
  },
  methods:{
    editXMSL(val){
      let option = this.lists(val)
      if (option) {
        this.selectTxt1.name = option.dictLabel;
        this.selectTxt1.val = option.val;
        this.$emit("changenowedit", -1);
        let params = {
          customerId: this.id,
        }
        params[this.field] = val
        customerUpdate(params).then(res=>{
          if (res.code == 200){
              this.$message.success('修改成功！')
          }else{
            this.$message.error(res.msg)
          }
        })
      }
    },
    lists(val){
      return this.list.find(option => option.dictValue === val);
    },
    selectTxts(){
      let option = this.lists(this.val)
      if (option) {
          return {
          name: option.dictLabel,
          val: this.val
        }
      }else{
        return {
          name:'待添加',
          val:'',
        }
      }
    }
  }
}
</script>

<style  lang="scss" scoped>
  .baseinfoselect{
    .select-title{
      color: rgba(35,35,35,0.8);
    }
  }
</style>
