station-test-ui/src/views/wind/fan/formModel.vue

<template>
  <ele-form-dialog
    v-bind="formConfig"
    v-model="formFieldsData"
    v-dialogDrag
    :title="title"
    :request-fn="handleFormSubmit"
    :visible.sync="DialogVisible"
    width="550px"
    custom-class="abow_dialog"
    label-width="100px"
    label-position="left"
    :dialogAttrs="{ 'close-on-click-modal': false,'top':'8vh'}"
  >
    <template v-slot:number_rules="{ }" >
       <el-input class="form-item1" v-model="rule_data.number_first" placeholder="机位号前缀"></el-input>
       <el-input class="form-item1" v-model="rule_data.start_number" placeholder="起始编号"></el-input>
       <el-input class="form-item1" v-model="rule_data.number_last" placeholder="机位号后缀"></el-input>
       <el-input class="form-item1" v-model="rule_data.number_length" placeholder="生成数量"></el-input>
       
       <!-- <el-switch
          v-model="zero_fill"
          active-text="补零"
          inactive-text="不补零">
        </el-switch> -->
        <el-checkbox class="form-item1" label="中间是否补零"  v-model="rule_data.zero_fill"></el-checkbox>
        <el-input class="form-item1" v-if="rule_data.zero_fill" v-model="rule_data.zero_length" placeholder="补零长度"></el-input>
    </template>
  </ele-form-dialog>
</template>

<script>
export default {
  props: ["formModelVisible", "title"],
  data() {
    return {
      url: "fan",
      formData: {},
      rule_data:{
        start_number:'',
        number_first:'',
        number_length:'',
        number_last:'',
        zero_fill:'',
        zero_length:'',
      },
      deviceTypes:[],
      formFieldsData: {
        wind_id: "",
        number_rules: "",
        fan_model:"",
        supplier:"",
        out_date:"",
        address:"",
        info: "",
        mul_number:'',
      },
      formConfig: {
        formDesc: {
          wind_id: {
            type: "select",
            label: "所属风场",
            isOptions: true,
            options: [],
            required: true,
            prop: {
              text: 'name',
              value: 'id'
            }
          },
          supplier: {
            type: "input",
            label: "供应商",
             required: true,
          },
          out_date: {
            type: "date",
            label: "出厂日期",
             required: true,
          },
          address: {
            type: "input",
            label: "地址",
          },
          fan_model: {
            type: "select",
            label: "型号",
            required:true,
            options: [],
          },
          number_rules: {
   
            label: "机位号规则",
          },
          mul_number: {
            type: "textarea",
            label: "机位号",
            attrs: {
              placeholder: '请输入机位号,多个机位号用英文逗号(,)相隔'
            }
          },
           info: {
            type: "textarea",
            label: "备注",
          },
         
        },
        order: ["wind_id","fan_model","supplier","out_date","address", "number_rules","mul_number","info"]
      }
    };
  },
  created() {
    this.$http.get("wind").then(response => {
      this.formConfig.formDesc.wind_id.options = response.data;
    });
     // 4-风机
    this.$http.get("get_device_mold",{ params: {type:4} }).then(resp => {
        this.formConfig.formDesc.fan_model.options = resp.data
     });
  },
  methods: {
    handleFormSubmit(data) {
      // console.log(this.rule_data)
      // console.log(this.formFieldsData)
      this.formFieldsData.rule_data=this.rule_data
      this.$parent.handleAddSubmit();
    },
    handleRequest(data) {
      return Promise.resolve();
    },
    handleRequestSuccess() {
      this.$message.success("发送成功");
    }
  },
  computed: {
    DialogVisible: {
      set(val) {
        this.$emit("sendVal", val); // 表示将子组件改变的值传递给父组件
      },
      get() {
        console.log(this.formFieldsData)
        return this.formModelVisible; // 表示获取父组件的值
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.form-item1{
  width:110px;
  margin-right: 5px;
  margin-bottom: 5px;
}
</style>