<style scoped>
  @import "../../css/cssReset.css";


  .tagF{
    margin-right: 5px;
  }
</style>
<template>
  <div>
    <table class="po_content singeRowTable"
      style="border:1px solid #E6E6E6;" cellspacing="0"
      cellpadding="0" v-loading="loading">
        <tr>
          <th>账户名称</th>
          <th>别名</th>
          <th>开户人</th>
          <th>类型</th>
          <th>关联科目</th>
          <th width="150px">操作</th>
        </tr>
        <tr v-for="(item,index) in list" :key="index">
          <td>{{item.BackName}}</td>
          <td>{{item.Alias}}</td>
          <td>{{item.Accountholder}}</td>
          <td>{{item.TypeName}}</td>
          <td style="white-space: warp;">
            <p style="padding: 3px 0;" v-for="(i,indexs) in item.KingdeeList" :key="indexs">
              <span class="q-mr-xs">{{i.BranchName}}: </span>
              <el-tag size="mini" class="tagF"
            closable @close="Delete(item,i)">
              {{i.KingdeeName}}<span class="q-ml-xs">{{i.KingdeeCode}}</span>
            </el-tag>
            </p>
          </td>
          <td width="150px">
            <span style="cursor: pointer;color:blue;text-decoration:underline;margin-right: 5px" @click="AddR(item)">新增</span>
          </td>
        </tr>
      </table>
      <div class="noData" v-if="list&&list.length==0">
        {{$t('system.content_noData')}}
      </div>

  </div>
</template>
<script>
  export default {
    props: {
      list: {
        type: Array,
        default: null
      },
      loading: {
        type: Boolean,
        default: null
      },
      type: {
        type: Number,
        default: null
      }
    },
    data() {
      return {

      }
    },
    watch: {
      list: {
        handler(val) {
          this.list = val
        },
        deep: true
      },
      loading: {
        handler(val) {
          this.loading = val
        },
        deep: true
      },
      type: {
        handler(val) {
          this.type = val
        },
        deep: true
      }
    },
    created(){
    },
    mounted(){

    },
    methods: {
      Delete(item,i){
        let _this = this
        let msg = {
          Type: this.type,
          TargetId: item.ID,
          SubjectId: i.SubjectId,
        }
        this.$q.dialog({
          title: '将删除此科目数据',
          message: '是否继续?',
          cancel: true,
          persistent: true,
          ok: "确定",
          cancel: "取消",
        }).onOk(() => {
          this.apipost('Financial_post_DelCostTypeKingdeeRelation',msg, res => {
            if(res.data.resultCode == 1) {
              this.$q.notify({
                icon: 'iconfont icon-chenggong',
                color: 'accent',
                timeout: 2000,
                message: res.data.Message,
                position: 'top'
              });
              this.$emit('success');
            } else {
             
            }
          }, err => {
            
          })
        }).onCancel(() => {
          
        });
      },
      AddR(item){
        this.$emit('clickEdit',item)
      },
    },

  }
</script>
