<template>
  <div>
    <Row style="marginTop:10px">
      <Col :span="24"> 
        <div>
          <Form :model="searchForm" ref="searchForm" :rules="rules"> 
             <Row>
              <Col :span="12">
                <p>共选择了{{this.ids.length}}项信息，请下方选择分类然后保存！</p>
              </Col> 
            </Row> 
            <Row>
              <Col :span="12">
              <Form-item prop="receivablesClass" label="收款分类">
                  <DataSelect transfer v-model="searchForm.receivablesClass" code='ReceivablesClass'></DataSelect> 
              </Form-item>
              </Col> 
            </Row> 
          </Form>
        </div>
      </Card>
      </Col>
    </Row>
  </div>
</template>

<script>
import {  
  DataSelect
} from "ems-components";  
import Server from "./server.js"; 
const server = new Server();
export default {
  name: "ReceivablesClassifyEdit",
  components: { 
    DataSelect
  }, 
  data() {
    return {
      searchForm:{
        receivablesClass:""
      },
      server: server,
      //验证规则
      rules: { 
        receivablesClass:[
          {
            required: true,
            message: "请选择收款分类!",
            trigger: "change"
          }
        ],
      }
    };
  },
  props: {
    title: {
      type: String,
      default: ""
    },
    ids: {
      type: Array,
      default: [],
      required:true
    }
  },
  async created() { 
    this.$emit("SetTitle", this.title);
    this.$emit("SetPageSize", 500); 
    let buttons = []; 
    buttons.push({
      text: "保存",
      theme: "warning", 
      action: "save",
      handle: () => {
        this.save();
      }
    }); 
    buttons.push({
      text: "关闭",
      theme: "primary",
      handle: () => {
        this.$emit("Close");
      }
    });
    this.$emit("SetPageActions", buttons); 
  },
  beforeMount: function() {},
  mounted: function() {},
  beforeDestroy: function() {},
  destroyed: function() {},
  methods: {
    save(){
       this.$refs["searchForm"].validate(async valid => {
        if (valid) {
          this.$emit('SetActionsState',{btn:'save',state:true});
          let param = this.ids.map(item => {
            return {
              receivablesId: item,
              receivablesStatus:4,
              receivablesClass:this.searchForm.receivablesClass
            };
          });  
          this.server.modify(param).then(data => {
            if (data.statusCode === "-1") {
              this.$Message.error(data.msg);
              this.$emit('SetActionsState',{btn:'save',state:false});
            } else {
              this.$Message.success("分类成功");
              this.$emit("Close", true); 
            } 
          });
        }
       }); 
    }
  },
  watch: {},
  directives: {}
};
</script>
