<!--
 * @Description:
 * @Autor: renchao
 * @LastEditTime: 2023-07-19 16:04:58
-->
<template>
    <div style="text-align: center"  class="djbdisposition">
    <el-transfer
      style="text-align: left; display: inline-block"
      v-model="value4"
      filterable
      :left-default-checked="[]"
      :right-default-checked="[]"
      :titles="['全选', '全选']"
      :button-texts="['转到左边', '转到右边']"
      :format="{
        noChecked: '${total}',
        hasChecked: '${checked}/${total}'
      }"
      @change="handleChange"
      :data="data">
      <span slot-scope="{ option }">{{ option.key }} - {{ option.label }}</span>
    </el-transfer>
    <div class="btn">
        <el-button @click="$popupCacel">取消</el-button>
        <el-button type="primary" @click="submitForm" plain>确定</el-button>
    </div>
  </div>
</template>

<script>
  import { updateSysSqywmbsz, getSysSqywmbszDetailById } from '@/api/sysSqywmbsz'
  export default {
    props: {
      formData: {
        type: Object,
        default: () => { }
      }
    },
    mounted () {
      console.log("this.formData",this.formData);
      // if (this.formData.bsmMb) {
      //   this.$startLoading()
      //   getSysSqywmbszDetailById(this.formData.bsmMb).then(res => {
      //     this.$endLoading()
      //     let { result } = res
      //     this.ruleForm = result ? result : {}
      //   })
      // }
    },
   data() {
      const generateData = _ => {
        const data = [];
        for (let i = 1; i <= 43; i++) {
          data.push({
            key: i,
            label: `备选项 ${ i }`,
            disabled: i % 4 === 0
          });
        }
        return data;
      };
      return {
        data: generateData(),
        value4: [],
      };
    },

    methods: {
      handleChange(value, direction, movedKeys) {
        console.log("shijian ",this.data.value, direction, movedKeys);
      },


      /**
       * @description: submitForm
       * @author: renchao
       */
      submitForm () {
        let that = this
        updateSysSqywmbsz(this.ruleForm).then(res => {
          if (res.code === 200) {
            this.$popupCacel()
            that.$message({
              message: '修改成功',
              type: 'success'
            })
          }
        })
      }
    }
  }
</script>
<style scoped lang="scss">
  @import "~@/styles/mixin.scss";
  @import "~@/styles/dialogBoxheader.scss";
.djbdisposition{
  width: 100%;
  height: 700px;
  .btn{
    margin-top: 20px;
    // background-color: salmon;

  }
  /deep/.el-transfer{
.el-transfer-panel{
  width: 400px;
  height: 640px;
  .el-transfer-panel__body .is-with-footer{
 height: 700px;
  }
  .el-transfer-panel__list.is-filterable{
    height: 570px;
  }
}
}
 }
</style>