CZC/operationSupport/src/views/businessManagement/InvestmentResources/stepPage/distribution.vue

<template>
  <div>
    <el-form
      ref="form"
      :model="formData"
      :rules="formRules"
      label-width="110px"
    >
      <el-form-item
        label="招商人员"
        prop="userId"
      >
        <el-cascader
          ref="userName"
          v-model="formData.userId"
          :props="defaultProps"
          :options="findUser"
          @change="findUserToggle()"
        ></el-cascader>
      </el-form-item>
    </el-form>
  </div>
</template>
<script >
export default {
  props: ['params'],
  data () {
    return {
      defaultProps: {
        value: 'id', // 唯一标识
        label: 'label', // 标签显示
        children: 'children',
        emitPath: false
      },
      formData: {
        userId: '',
        userName: '',
        userPhone: '',
        rentOutIds: [],
      },
      findUser: [],
      formRules: {
        userId: [this.$valid.selectRequired('分配人员')]
      }
    };
  },
  methods: {
    submit () {
      this.$refs.form.validate((valid) => {
        if (valid) {
          var loading = this.$loading();
          this.$http
            .post('/czc-community/house/rent/out/distribute', this.formData)
            .then(({ status, msg }) => {
              if (status == 0) {
                this.$message.success(msg);
                this.params.callback();
                this.$emit('close');
              } else {
                this.$message.error(msg);
              }
              loading.close();
            })
            .catch(() => {
              loading.close();
            });
        }
      });
    },
    getUserList () {
      this.$http.get('/czc-user-center/user/findUserList').then(({ data, status, msg }) => {
        this.findUser = data;
      });
    },
    findUserToggle () {
      let thisObj = this.$refs['userName'].getCheckedNodes()[0];
      this.formData.userName = thisObj.label;
    }
  },
  created () {
    this.getUserList();
    this.params.house.map((item) => {
      this.formData.rentOutIds.push(item.rentOutId);
      this.formData.userPhone = item.residentPhone;

    });
  }
};
</script>
<style lang="scss" scoped>
.marginNone {
    margin-bottom: 0;
}
.zz-table {
    margin-bottom: 20px;
}
.noneBef {
    margin-top: 5px;
    &::before {
        content: none;
    }
}
.inline {
    display: flex;
    justify-content: space-between;
}
</style>