<template>
  <nm-dialog v-bind="dialog" @open="onOpen" :visible.sync="visible_">
    <el-tabs class="nm-dialog-tabs" v-model="tab" type="card" @tab-click="setProps">
      <el-tab-pane name="fcommon">
        <span slot="label">
          <nm-icon name="link" />常规
        </span>
        <FCommonPage />
      </el-tab-pane>
      <el-tab-pane name="fproduct">
        <span slot="label">
          <nm-icon name="link" />规则
        </span>
        <FProductPage />
      </el-tab-pane>
    </el-tabs>
    <template v-slot:footer>
      <nm-button text="添加" type="success" @click="onSubmit" />
      <nm-button text="重置" type="info" @click="onReset" />
    </template>
  </nm-dialog>
</template>

<script>
import { mixins } from 'dcms-ui'
import FCommonPage from './components/fcommon'
import FProductPage from './components/fproduct'

export default {
  mixins: [mixins.dialog],
  components: { FCommonPage, FProductPage },
  data() {
    return {
      tab: 'fcommon',
      dialog: {
        footer: true,
        title: '创建常规赠送政策',
        icon: 'add',
        width: '95%',
        class: 'nm-admin-menu-add',
        loading: false,
        draggable: false,
      },
      on: {
        success: this.onSuccess,
        error: this.onError,
        'validate-error': this.onValidateError,
      },
    }
  },
  props: ['parent', 'sort'],
  methods: {
    onSubmit() {
      this.dialog.loading = true
      this.$refs[this.tab].submit()
    },
    onReset() {
      this.$nextTick(() => {
        this.$refs[this.tab].reset()
      })
    },
    setProps() {
      this.$refs[this.tab].setProps()
    },
    onSuccess(model) {
      this.dialog.loading = false
      this.$emit('success', model)
    },
    onError() {
      this.dialog.loading = false
    },
    onValidateError() {
      this.dialog.loading = false
    },
    onOpen() {
      this.onReset()
    },
  },
}
</script>
<style lang="scss">
.nm-admin-menu-add {
  .el-scrollbar__view {
    padding: 0 !important;
  }
}
</style>
