</el-form>
      <div>
        <!--子代方法有一个·传值传向父级 onselect去接收这个值-->
        <select-account :data1.sync="accountList" :checkedData.sync="checkedData1" @seletct="onSelect" />
      </div>
      <div ></div>
      <template v-slot:footer>
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </template>
    </el-dialog>
  </div>

<el-checkbox-group   v-model="ooo"  @change="handleCheckedDataChange">
       <!--循环遍历得到每一个数据  传入data的每一个数据-->
       <el-checkbox  v-for="acc in data" :label="acc" :key="acc.id" >
       <!--  <el-checkbox v-for="acc in data" :label="acc" :key="acc.id">-->
         <el-card
           shadow="hover"
           class="card-container"
          
         >
         <!--  <div class="avatar-img">
           <!–  <span><img :src="acc.pAvatar" alt="image" class="media-img" /></span>–>
          <!– <el-avatar :src="acc.dAvatar" alt="image"  />–>
           </div>-->
           <div >
             <div >
               <div >
                 <div >
                   <img v-if="acc.plugin_icon_url!=''&&acc.plugin_icon_url!=null"  :src="acc.plugin_icon_url" alt="">
                   <i v-else  class="el-icon-warning-outline"></i>
                   <h1 >
             {{ acc.name }}
           </h1>
          <p >
            {{ acc.departmentName }}
          </p>
                 </div>
                 <div >
                   <div >{{ acc.platform }}</div>
                   <p >刊例价:￥{{ acc.price }}</p>
                   <p >平均播放量：{{ acc.avg_view==null?0:acc.avg_view }} </p>
                   <p >粉丝数：{{ acc.num_fan==null?0:acc.num_fan }}</p>
                 </div>
                 </div>
               </div>

        <!--   <div >
             <input type="checkbox" name="running" :checked="checked" >
           </div>-->
           </div>
          <!-- </div>-->
           <!--<div class="gy-right">
           <div class="account-name">

             <span>{{ acc.platform }}</span>
           </div>-->
           <!--<div class="account-info">
             <p class="p-slide">刊例价：¥{{ acc.price }}</p>
             <p class="p-slide">平均播放量：{{ acc.avg_view }} </p>
             <p class="p-slide">粉丝数：{{ acc.num_fan }}</p>
           </div>-->
         </el-card>
       </el-checkbox>
       </el-checkbox-group>
  </div>

</template>

<script>
  import {
    getAction
  } from "@/api";

  export default {

    name: "SelectAccount",
    // props: {
    //  value: {
    //    type: String | Number,
    //    required: true
    //  },
    // },
    model: {
      prop: "value",
      event: "change"
    },
   /* computed:{
      ooo:function (){
        return this.checkedData
      }
    },*/
    props: ['checkedData','data1'],
    data() {
      return {
        ooo: this.checkedData,
        selectStatus: [],
        data: this.data1,

        /*双向绑定数据 双向数据绑定*/
        checked:true
      };
    },
    mounted() {
      this.list();
    },
   /* watch(){
      console.log(this.checkedData,"11111")
    },*/
    methods: {
      /*向父组件传值*/
      // onSelect(data) {
      //  this.$emit("seletct", data);
      // },
      /*test(){
        this.checked=!this.checked
      },*/
      list() {
        getAction('/account/list').then(res => {
          /*定义一个list数组*/
          var list = [];
          /*定义一个字符串对象*/
          var data = '';
          for (var i = 0; i < res.data.length; i++) {
            /*创建数组
            {
              "id": "1",
                "name": "Hi苏州",
                "num_fan": null,
                "avg_view": null,
                "platform": "今日头条",
                "department_id": "1",
                "column": null,
                "price": "111.00",
                "department_name": "ddd1"
            },*/
            data = {
              /*任务id*/
              id: res.data[i].id,
              /*账号名称*/
              name: res.data[i].name,
              /*粉丝数*/
              num_fan: res.data[i].num_fan,
              /*平均播放量*/
              avg_view: res.data[i].avg_view,
              /*账号类型*/
              platform: res.data[i].platform,
              /*部门id*/
              department_id: res.data[i].department_id,
              column:res.data[i].column,
              /*刊价比*/
              price: res.data[i].price,
              /*部门名称*/
              departmentName: res.data[i].department_name,
              /*暂时写死的两个字段 后续可注释*/
              pAvatar: "./logo.png",
              dAvatar: "./logo.png",
              plugin_icon_url:res.data[i].plugin_icon_url,
            }
            list.push(data);
          }
          /*赋值给data*/
          this.data = list;
        })
      },
      /*父子组件传值 通过select的属性进行传值*/
      handleCheckedDataChange(val){
        console.log(this,"3333")
        /*触发父亲组件的方法 冰进行传值*/
        this.checked=!this.checked
        console.log(this.checked,"1111")
        this.$emit("seletct", val);
      }
    }