SMAirports/src/components/competencypop/index.vue

<template>
  <div class="bf-competencypop">
    <Dialog width="540px" :flag="dialogVisiblestart">
      <div class="title">权限规则</div>
      <div class="content">
        <el-form label-width="110px" class="from dialog-public-background">
          <!-- <el-form-item>
            <el-radio v-model="form.Action" disabled :label="item.id" v-for='(item,index) in option' :key="index">{{item.label}}</el-radio>
          </el-form-item>
          <el-form-item label="时效范围起">
            <el-date-picker size="small" v-model="form.ValidBegin" disabled type="datetime" :picker-options="pickerOptionsStart" placeholder="选择时间">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="至">
            <el-date-picker size="small" v-model="form.ValidEnd" disabled @change="setTime" :picker-options="pickerOptionsEnd" type="datetime" placeholder="选择时间">
            </el-date-picker>
          </el-form-item> -->
          <el-form-item label="许可查询行">
            <el-input size="small" v-model="form.QueryRow" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
          <el-form-item label="许可查询列">
            <el-input size="small" v-model="form.QueryCol" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
          <el-form-item label="许可删除行">
            <el-input size="small" v-model="form.DeleteRow" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
          <el-form-item label="许可新增列">
            <el-input size="small" v-model="form.NewCol" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
          <el-form-item label="许可编辑行">
            <el-input size="small" v-model="form.EditRow" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
          <el-form-item label="许可编辑列">
            <el-input size="small" v-model="form.EditCol" placeholder="请输入内容" disabled></el-input>
          </el-form-item>
        </el-form>
      </div>
      <div class="foot center">
        <el-button @click.native="handleClose" type="primary">确定</el-button>
      </div>
    </Dialog>
  </div>
</template>
<script>
import Dialog from '@/layout/components/Dialog'
export default {
  props: {
    dialogVisiblestart: {
      type: Boolean,
      default: false
    },
    form: {
      type: Object,
      default: () => { }
    }
  },
  data () {
    return {
      pickerOptionsStart: {
        disabledDate: time => {
          if (this.form.endWeeks) {
            return time.getTime() >= new Date(this.form.endWeeks).getTime()
          }
        }
      },
      pickerOptionsEnd: {
        disabledDate: time => {
          if (this.form.firstWeeks) {
            return time.getTime() <= new Date(this.form.firstWeeks).getTime() - 86400000
          }
        }
      },
      //   form: {
      //     endWeeks: '',
      //     firstWeeks: '',
      //     value1: '',
      //     value2: '',
      //     input1: '',
      //     input2: '',
      //     input3: '',
      //     input4: '',
      //     input5: '',
      //     input6: '',
      //   },
      butName1: '确定',
      isWidth: '29.1%',
      radio: 1,
      option: [{
        label: '显示权限',
        id: 1
      },
      {
        label: '显示及编辑权限',
        id: 2
      }],
      value1: '',
      value2: ''
    }
  },
  components: {
    Dialog
  },
  methods: {
    handleClose () {
      this.$emit('handleClose', this.form)
    },
    setTime (val) {
      if (this.form.endWeeks < this.form.firstWeeks) {
        this.endWeeks = ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.title {
  text-align: left;
}
.content {
  margin-left: 0;
  padding: 0 24px 0px 24px;
  text-align: left;
  .el-date-editor {
    width: 100%;
  }
  .el-form-item {
    margin-bottom: 15px;
  }
}
.footer {
  padding-bottom: 24px;
}
</style>