saas_masterPlatform/src/views/financed/subscription/dislog.vue

<template>
  <div>
    <BaseDialog
      width="400px"
      :isShow.sync="isShow"
      title="添加"
      @submit="submitForm"
      @close="close"
    >
      <el-form
        :model="formData"
        :rules="rules"
        ref="formData"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="收款账户：" prop="value1">
          <el-select v-model="formData.value1" clearable placeholder="请选择">
            <el-option
              v-for="item in 3"
              :key="item"
              :label="item"
              :value="item"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="到账金额：" prop="openingName"
          ><el-input
            clearable
            v-model="formData.openingName"
            placeholder="输入到账金额"
          ></el-input>
        </el-form-item>
        <el-form-item label="到账时间：" prop="value2"
          ><el-date-picker
            v-model="formData.value2"
            type="datetime"
            placeholder="选择日期时间"
            value-format="timestamp"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="付款账户：" prop="proceedsAccount"
          ><el-input
            clearable
            v-model="formData.proceedsAccount"
            placeholder="输入付款账户"
          ></el-input>
        </el-form-item>
        <el-form-item label="付款银行：" prop="proceedsAccount"
          ><el-input
            clearable
            v-model="formData.proceedsAccount"
            placeholder="输入付款银行"
          ></el-input>
        </el-form-item>
        <el-form-item label="付款账户：" prop="proceedsAccount"
          ><el-input
            clearable
            v-model="formData.proceedsAccount"
            placeholder="输入付款账户"
          ></el-input>
        </el-form-item>
        <el-form-item label="下单企业：" prop="proceedsAccount"
          ><el-input
            clearable
            v-model="formData.proceedsAccount"
            placeholder="输入下单企业"
          ></el-input>
        </el-form-item>
      </el-form>
    </BaseDialog>
  </div>
</template>

<script>
export default {
  name: "",
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      formData: {},
      rules: {
        tenantName: [
          { required: true, message: "请输入机构名称", trigger: "blur" },
        ],
        openingName: [
          { required: true, message: "请输入开户名", trigger: "blur" },
        ],
        openingBank: [
          { required: true, message: "请输入开户行", trigger: "blur" },
        ],
        proceedsAccount: [
          { required: true, message: "请输入账号", trigger: "blur" },
        ],
      },
      days: [],
    };
  },
  methods: {
    init() {},
    close() {
      this.$refs["formData"].resetFields();
    },
    submitForm() {
      this.$refs["formData"].validate((valid) => {
        if (valid) {
          this.isShow = false;
          this.$emit("search");
        } else {
          return false;
        }
      });
    },
  },
  computed: {
    isShow: {
      get() {
        if (this.dialogVisible) {
          this.init();
        }
        return this.dialogVisible;
      },
      set(val) {
        this.$emit("update:dialogVisible", false);
      },
    },
  },
};
</script>

<style lang="scss" scoped>
.el-input {
  width: 220px;
  margin-right: 10px;
}
.el-select {
  width: 220px;
  margin-right: 10px;
}
</style>