<template lang="html">
  <div class="">
    <el-dialog :title="pageEditRowIndex > -1 ? '修改页面布局' : '新增页面布局'" v-model="p_editFormVisible" size="tiny">
      <el-form ref="pageData" :model="pageData" :rules="rules" label-width="100px">
        <el-form-item label="页面URL" prop="route">
          <el-input v-model="pageData.route"></el-input>
        </el-form-item>
        <el-form-item label="页面code" prop="code">
          <el-input v-model="pageData.code"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="pageSubmit">完成</el-button>
          <el-button @click="pageCancel">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      rules: {
        route: [{
          required: true,
          message: '请输入页面Url',
          trigger: 'blur'
        }],
        code: [{
          required: true,
          message: '请输入页面布局编码',
          trigger: 'blur'
        }]
      },
      p_editFormVisible: false
    };
  },
  props: ['pageData', 'pageEditRowIndex', 'pageEditFormVisible', 'pageTreeCode'],
  methods: {
    pageSubmit() {
      this.$refs.pageData.validate((valid) => {
        // debugger;
        if (valid) {
          this.p_editFormVisible = false;
          var url = '/ifbp-app-sm-infoset-web/page_config_head/create';
          if (this.pageData.pk) {
            url = '/ifbp-app-sm-infoset-web/page_config_head/update';
          }
          var data = {
            "busicode": this.pageTreeCode,
            "route": this.pageData.route,
            "code": this.pageData.code,
            "pk": this.pageData.pk,
          };
          this.$http({
            url: url,
            method: 'post',
            data: data,
            dataType: 'json'
          }).then((res) => {
            if (res.data.success === true) {
              // this.pageCustomLayoutData = res.data.data;
              this.$emit('pageSubmit', res.data.data);
            }

          }).catch(() => {
            this.$message({
              message: '保存失败',
              type: 'error'
            });
          });
        }
      })
    },
    pageCancel() {
      this.p_editFormVisible = false;
    }
  },
  mounted() {

  },
  created() {

  },
  watch: {
    pageEditFormVisible: function(value) {
      this.p_editFormVisible = value;
    },
    p_editFormVisible: function(value) {
      this.$emit('changeVisible', value);
    },
  },
}
</script>

<style lang="css">
</style>
